/** 
 * SilverStripe Black Candy Theme
 * http://www.silverstripe.com
 *
 * Main Layout File
 */
 
/* Misc Styles and defaults 
-------------------------------------------- */
  
* {
   margin: 0;
   padding: 0;
}

body {
   color: #333;
   font-size: 62.5%;
   margin-bottom: 40px;
   font-family: Verdana, Lucida, sans-serif; 
}

html {
   background: url(../images/kachel.png);
}

table {
   border-collapse: collapse;
   border-spacing: 0;
}
caption, th, td {
   text-align: left;
   font-weight: normal;
}

.clear{
   clear:both;
}



/* CONTAINER
----------------------------------------- */
#BgContainer {
   /*border: 0px solid #FF0000;*/
   width: 850px;
   margin: 0 auto;
   background: transparent; 
}
#Container {
   /*border: 0px solid #FFFF00;*/
   width: 820px;
   padding-bottom: 15px;
   margin-top: -140px;
   background: transparent;
   vertical-align: top;
}
#Layout {
   /*border: 0px solid #0000FF;*/
   width: 760px;
   clear: both;
   overflow: hidden;
   min-height: 550px;
   padding: 15px 40px 20px 20px;
   margin: 0 auto;
   background: #ffffff;
}
#Content {
   /*border: 0px solid #00FF00;*/
   width: 580px;
   float: right;
   margin: 0 0 0 0;
   padding: 0 0 0 0px;
   text-align: left;
}

#Main {
   /*border: 0px solid #FFFF00;*/
   width: 100%;
   background: transparent repeat-y center;
}

/* WAPPEN
----------------------------------------- */
#Wappen {
   width: 118px;
   height: 154px;
   display: block;
   background: transparent url(../images/Wappen.png) no-repeat center;
   position: relative;
   left:-70px; top:20px;
   }

/* Abt. Volleyball Logo
----------------------------------------- */
#AbtVolley {
   width: 310px;
   height: 43px;
   display: block;
   background: transparent url(../images/AbtVolley.png) no-repeat center;
   position: relative;
   left: 80px; top:-40px;
   }
   
/* HEADER
----------------------------------------- */
#Header {
   width: 820px;
   height: 200px;
   margin: 0 auto;
   overflow: hidden;
   background: transparent url(../images/Header.png) no-repeat left center;
  }

#HeaderTop {
      width: 100%;
      background: transparent url(../images/HeaderLine.png) no-repeat top;
      height: 15px;
   }

    #Header h1 { 
        color: #fff; 
      font-size: 3.2em; 
      font-family: Tahoma, Verdana, sans-serif;
      font-weight: 300;
      padding: 20px 0 0 30px;
   }
   #Header p {
      font-size: 1.4em;
      color: #fff;
      clear: left;
      margin: 0 0 0 100px;
   }

/* MAIN NAVIGATION - TABS
----------------------------------------- */
#Navigation {
   width: 820px;
   margin: 0 auto;
   padding-top: 0px;
   overflow: hidden;
   background: transparent url(../images/Navi.png) no-repeat center;
}
   #Navigation ul { 
      margin-left: 10px;
   }
      #Navigation ul li { 
         list-style: none;
         margin: 0 0px; 
         float: left;
         line-height: 2.8em;
         display: block;
      }
           #Navigation ul li a { 
            float: left;
            text-decoration: none;
            display: block; 
            height: 2.3em; 
            font-size: 1.4em;
            font-weight: bold;
            padding: 0 0 0 10px;
            color: #fcf500;
         }
            #Navigation ul li a span {
               text-align: center;
               float: left;
               padding-right: 10px;
               height: 2.3em;
            }
               #Navigation ul li a:hover { 
                  background: transparent;
                  color: #ffffff;
                  cursor: pointer;
               }
               #Navigation ul li a:hover span {
                  background: transparent;
                  cursor: pointer;
               }
               
             #Navigation ul li a.current,
             #Navigation ul li a.section,
             #Navigation ul li a.section:hover,
             #Navigation ul li a.current:hover { 
                background: transparent;
                color: #fcf500;
               }
            #Navigation ul li a.current span,
            #Navigation ul li a.section span,
             #Navigation ul li a.section:hover span,
            #Navigation ul li a.current:hover span {
               background: transparent;
               color: #fcf500;
            }
    
/* BREADCRUMBS
-------------------------------------------- */
#Breadcrumbs { 
    color: #B7C0C5;
   text-align: left;
   font-size: 0.9em; 
   margin: 0px 5px 10px 0;
}
   #Breadcrumbs p {
      margin: 0;
   }


/* SIDEBAR
-------------------------------------- */
#Sidebar { 
   width: 150px;
   float: left;  
   margin: 10px 0 0 0;
   padding: 0;
}
   #Sidebar .sidebarBox {
      /*border: 1px solid #FF0000;*/
      margin: 0 0 5px 0;
      padding-bottom: 2px;
      background: #ffffff;
   }
   #Sidebar ul {
      /*border: 1px solid #0000FF;*/
      margin: 2px 0 5px 3px;
   }
      #Sidebar li {
         /*border: 1px solid #00FF00;*/
         margin: 0px 0px;
         list-style: none;
         background: transparent url(../images/submenu_space.gif) no-repeat left top;
      }
   #Sidebar h3 { 
      clear: both; 
      color: #096e07;
      font-weight: bold;
      font-size: 1.4em;
      margin: 0 0 10px 0;
      line-height: 1.8;
      padding: 1px 0 0 10px;
      background: transparent;
   }
   
   #Sidebar .sidebarBottom {
      display: block;
      width: 100%;
      margin: 100px 0 0 0;
      padding: 0 0 0 0;
      background: transparent;
   }
        #Sidebar p.sidebarinfo {  
           width: 135px;
           height: 15px;
           background: #ffffff;
           text-align: center;
           font-weight: 700;
           color: #096E07;
        }
           #Sidebar .sidebarBottom img,
           #Sidebar #Aktuell_img {
              padding: 0px 0 20px 10px;
              width: 135px;
           }
           
   #Sidebar a em {
      font-style: normal;
   }
   #Sidebar p {
      font-size: 11px;
       clear: both;
       margin: 10px 10px 0 10px;
   }
   
   /* MENU2 */
    ul#Menu2 li { 
       font-size: 1em;
       margin: 0 0 0 5px;
       padding: 8px 0 0 0px;
       list-style: none;
    }
       ul#Menu2 li a {
            display: block;
            width: 140px;
            font-size: 1.2em;
            height: 1.8em;
            line-height: 1.8em;
            color: #096e07;
         }
         ul#Menu2 li em {
            padding-left: 10px;
            display: block;
         }
            ul#Menu2 li li em {
               padding-left: 0;
            }
         /* Level 1 
         - We use 3 elements for the nav to get 3 background images applied.
            * span - topleft rounded corner
            * em - bottomleft rounded corner
            * a - arrow on the right
            <a><span><em></em></span></a>
         */
         ul#Menu2 li a:hover,
         ul#Menu2 li a.current,
         ul#Menu2 li a.current:hover {
           background: #AAFFAA;
           cursor: pointer;
           text-decoration: none;
         }
        ul#Menu2 li a.current {
           font-weight: 700;
        }
         ul#Menu2 li a.section,
         ul#Menu2 li a.section:hover {
            background: transparent;
            font-weight: 700;
            width: 140px; 
         }
         ul#Menu2 li a.levela:hover span,
         ul#Menu2 li a.current span,
         ul#Menu2 li a.section span,
         ul#Menu2 li a.section:hover span,
         ul#Menu2 li a.current:hover span {
         background: transparent;
         display: block;
         width: 130px;
         height: 100%;
      } 
      ul#Menu2 li a.levela:hover em,
      ul#Menu2 li a.current em,
      ul#Menu2 li a.section em,
      ul#Menu2 li a.section:hover em,
      ul#Menu2 li a.current:hover em {
                 background: transparent;
                 display: block;
                 width: 130px;
                 height: 100%;
         }
      ul#Menu2 li a.levela:hover em,
      ul#Menu2 li a.section:hover em {
                 background: #aaffaa;
                 display: block;
                 width: 130px;
                 height: 100%;
         }
            ul#Menu2 li ul {
               height: 100%;
               position: relative;
               margin: -4px 0 0 0;
               width: 193px;
               padding: 4px 0 10px 0;
               background: transparent;
            }
               ul#Menu2 li ul li {
                  width: 160px;
                  background: transparent;
                  padding: 0;
                  font-size: 0.8em;
                  display: inline;
                  margin: 0;
               }
                  ul#Menu2 li ul li ul {
                     background: transparent;
                     margin-left: 0;
                  }   
      
               ul#Menu2 li li a.current,
                  ul#Menu2 li li a.section,
                  ul#Menu2 li li a.section:hover,
                  ul#Menu2 li li a.current:hover {
                     color: #555;
                     font-weight: 700;
                     background: transparent;
                  }
                     ul#Menu2 li li ul {
                        margin: 0 0 0 10px;
                        padding: 0;
                        width: 175px;
                     }
                     ul#Menu2 li li ul .roundWhite {
                        margin-bottom: -10px;
                     }
                     
                     ul#Menu2 li ul li .roundWhite li {
                        background: transparent;
                     }
               
         /* Sub Menu */
            ul#Menu2 li a.levelb {
               font-size: 1.7em;
               text-indent: 8px;
               width: 130px;
               background: transparent;
               margin-left: 10px;
            }
           ul#Menu2 li a.levelb:hover,
            ul#Menu2 li li a.current,
            ul#Menu2 li li a.current:hover,
            ul#Menu2 li li a.section,
            ul#Menu2 li li a.section:hover {
               background: transparent;
               text-decoration: none;
               display: block;
               color: #096e07;
            }
            ul#Menu2 li a.levelb:hover span,
            ul#Menu2 li li a.current span,
            ul#Menu2 li li a.current:hover span,
            ul#Menu2 li li a.section span,
            ul#Menu2 li li a.section:hover span {
               background: transparent;
               display: block;
               width: 100%;
               height: 100%;
            }    
            ul#Menu2 li a.levelb:hover em,
            ul#Menu2 li li a.current em,
            ul#Menu2 li li a.current:hover em,
            ul#Menu2 li li a.section em,
            ul#Menu2 li li a.section:hover em {
               background: transparent;
               display: block;
               width: 100%;
               height: 100%;
            }
           ul#Menu2 li a.levelb:hover span {
               background: transparent;
               text-decoration: underline;
               display: block;
               color: #096e07;
            }

/* SSVB-Info
---------------------------------------- */
#SSVB-Info {
   width: 550px;
   background: #FFFFFF;
   position: relative;
   top: 0;
   left: 0;
   /*display: none;*/
}
#SSVB-Info table {
        width: 100%;
        border: 1px solid #000000;
        color: #006600;
}
        #SSVB-Info table tr{
                height: 30px;
        }
        #SSVB-Info table tr.green{
                background: #ccff99;
                height: 30px;
        }
                #SSVB-Info table tr td{
                        border: 1px solid #000000;
                        padding: 0 5px 0 5px;
                        text-align: center;
                }

/* GALERIE
---------------------------------------- */
div.galery {
        /*border: 1px solid #000000;*/
        height: 550px;
}

div.folder {
        width: 100%;
        height: 100%;
        background: url(../images/ordner.jpg) top left no-repeat;
}

div.folder p{
        padding-top: 30px;
        font-weight: bold;
        text-align: center;
        font-size: 9px;
        color: #000000;
}

div.galeryentry {
        /*border: 1px solid #FF0000;*/
        float:left;
        width: 115px;
        height: 115px;
        padding: 10px 10px 10px 10px;
        text-align: center;
        vertical-align: center;
}

img.galerypic {
        border: 3px solid #005070 !important;
        text-align: center;
        vertical-align: center;
}

div.galeryentry_small {
        /*border: 1px solid #FF0000;*/
        float:left;
        width: 75px;
        height: 75px;
        padding: 10px 10px 10px 10px;
        margin-top: 10px;
}

div.galeryentry_small a:hover{
        text-decoration: none;
}

/* COMMENTS
---------------------------------------- */
#CommentHolder ul {
   list-style: none;
   margin: 20px 0;
}
#PageComments li {
   margin: 5px 0;
   padding: 1px;
   width: 88%;
}
   #PageComments li.odd {
      background: #E8F6FF url(../images/commentBg.png) no-repeat 1% 10%;
      padding-left: 40px;
      padding-right: 10px;
      border-bottom: 2px solid #BCE4FE;
   }
   #PageComments li.even {
      background: #fff url(../images/commentBgAlt.png) no-repeat 99% 10%;
      padding-right: 40px;
      padding-left: 10px;
   }

      #PageComments li.odd p.info {
         color: #3AA0C3;
      }

      .actionLinks li {
         display: inline;
         border-right: 1px solid;
      }
         .actionLinks li a {
            padding-right: 3px;
            font-size: 10px;
         }
            .actionLinks li.last {
               border-right: none;
            }

.commentrss {
   background: transparent url(../images/feed-icon-14x14.png) no-repeat;
   padding-left: 20px;
   font-size: 1.1em;
   line-height: 1.6em;
}
#PageCommentsPagination p {
   text-align: center;
   font-size: 1.2em;
}
#PageComments p {
   font-size: 1em;
}
   #PageComments p.info {
      color: #999;
      margin: 0px;
      padding: 0;
      line-height: 1em;
      font-size: 0.9em;
   }

/* SEARCH RESULTS STYLES
------------------------------------------------ */
ul#SearchResults {
   margin: 10px 0;
}
   ul#SearchResults li {
      list-style: none;
      margin: 5px 0;
      font-size: 1em;
   }

/* SEARCH FORM 
-----------------------------------------------*/
html #SearchForm_SearchForm {
   float: right;
   width: 240px;
   margin: 5px;
}
html #SearchForm_SearchForm .middleColumn {
   float: left;
   width: 164px;
   margin: 0 5px 0 0;
   padding: 2px;
   background-color: #51a9df;
   
}
   html #SearchForm_SearchForm .middleColumn input.text {
      width: 160px;
      border: none;
      color: #666;
   }
html #SearchForm_SearchForm #SearchForm_SearchForm_action_results {
   float: left;
   margin-top: 2px;
}

/* MESSAGEBOXS
--------------------------------------------- */
.message {
   margin: 15px;
   padding: 5px;
   width: 92%;
   color: #979908;
   border: 4px solid #F7F8B4;
   background: #FFFFEA;
}
span.middleColumn .message {
   margin: 4px 0 0 3px;
}
.required {
   margin: 4px 0 0 3px;
   padding: 5px;
   width: 92%;
   color: #DC1313;
   border: 4px solid #FF7373;
   background: #FED0D0;
}



p#Remember label {
   margin: -24px 0 0 20px;
   text-align: left;
}
.entry {
   border-bottom: 1px solid #eee;
}

.typography #Content p.authorDate {
   color: #444;
   margin-top: -15px;
   }
   
/* PAGING
------------------------------------------------ */
#paging{
   /*border: 1px solid #FFFF00;*/
   font-size: 12px;
   text-align:center;
   margin:auto;
   width: 400px;
}

   #paging_single{
      width: 100%;
   }
   
   #paging_first,#paging_last,#paging_mid{
      width: 80px;
      float: left;
      margin-top: 5px;
   }

   #paging_mid{
      width: 240px;
   }
   
/* UNSUBSCRIBE NEWSLETTER
------------------------------------------------ */
#Unsubscribe_MailingListForm_MailingListForm{
   min-height:100px;
}

   #Unsubscribe_MailingListForm_MailingListForm p{
      margin:0 !important;
      padding:10px;
   }
      #Unsubscribe_MailingListForm_MailingListForm p label{
         display: inline;
      }
   #Unsubscribe_MailingListForm_MailingListForm label{
      margin:0;
   }


/* FOOTER
----------------------------------------------- */

#Footer {  
   width: 820px;
   height: 20px;
   background: #ffffff url(../images/footer.gif) no-repeat center;
   text-align: center;
}
#FooterBottom {
   width: 100%;
   background: transparent url(../images/ContainerBottom.png) no-repeat bottom;
   display: block;
   height: 20px;
   }
     #Footer p { 
      color: #000000;
      font-size: 1.2em;
      padding-top:2px;
      text-align: center;
   }
        #Footer a { 
            color: #fcf500;
            text-decoration: none;
      }
         #Footer a:hover {
            color: #fff;
            text-decoration: underline;
         }