/*   Stylesheet für Cat Cloud Manager Blaue Edition                   */
/*   Erstellt am:  03.02.2013   von: Susann Hornschuch                */

#loginbutton , .werbebutton { background-color:  #A80104;
                             border-color:      #A80104;							 
               color : #FFFFFF;
               background-image: linear-gradient(to top, #E31E1A, #F5E6E5 90% )
             }


html { font-size:        10pt; /*11*/                         /* Einstellungen für Grundelemente */
       font-family:      "Verdana", "Geneva", sans-serif;
     }
body {  background-color: #F8FEFE;                           /*99CCCC*/
        background-image: url(picture/squares.jpg);
        color :           #000000;
     }
/************************************************************ Allgemeines ***********************************************/
  hr.standard { background-color: #FFFFFF;                      /* Standardlinie über ganze Seite  Farbe für Opera und Firefox */
                color:            #FFFFFF;                                                 /* Farbe für Internet Explorer (IE) */
              }
  h3          { color:            #24140B; }                 /* Überschrift */
  .info       { color:            #008030; }
/**************************************************** Einstellungen für WRAPPER ********************************************/
  #wrapper, #wrapper_hp  { width:         94%; }                           /*  Seitenbreite : muss hier angepasst werden  */
  #wrap-2, #wrap-2_hp    { background:    #A80104; }                   /* Farbe Hintergrund */

/******************************************* Kopf *************************************************************************/
  #head, #head_hp,#left_kopf_hp  { height:           250px;
                                   border:           3px solid #A80104;
                                   border-bottom:    0px ;

                                 }
  div.left_im_kopf               { width: 252px;  }
  div.left_im_kopf div ul li a   { box-shadow:      3px 3px 8px #292929;   }
  #lang, #lang a                 { color: #000000; }
  #aktsprache                     { background-color: #006666;
                         color:            #ECF0FE;
                        }


   #head { background: url(picture/header1.jpg) no-repeat center;  
                /*background-repeat: no-repeat; */
               /*background-position: center; */
          border-left:  3px solid #A80104;
          border-right: 3px solid #A80104;
          border-top:   3px solid #A80104;
      background-color: #FFFFFF;
        }

/********************************************************** Navigation Hauptmenü ******************************************/
 #navi ul li { background:     linear-gradient( to bottom, #F5BBB7, #E31E1A 55%);
			box-shadow:2px 2px 5px #292929;
			background-size: auto 100% ;      }
			
  #navi ul li.akt     { background: #ECF0FE;  }  /* Menü grau*/
  #navi a             { color: #ECF0FE; }           /* 000000 = schwarz*/
  #navi a.akt         { color:#1F1F1F ; }           /* FFFFFF = weiss */
  #navi a:hover, #navi a.akt:hover  { color:#000000 ; }
  #navi, div.hp_menue, div.menue_cloud  { background:   #A80104;}          /* A80104 = rot  C6D1A9=mittelgrün*/
  #navi               {/* padding-top:  15px; */        /* Abstand Hauptmenü von oben und links */
                 /*       padding-left: 240px; */     /*  background: #A80104; margin-top: -2px;margin-bottom: 0px; padding-top: 2px; padding-bottom: 1px; */
                      }
/****************************************************** Linke Sidebar *****************************************************/

   #left_sidebar,div.home    { color:      #ECF0FE;                /* Linke Sidebar und home*/
                               width:      250px;
                               margin-top: 3px;       /* Hier muss die obere Position für die linke Seite angepasst werden, je nach Rahmengröße des Mittelteils */
                             }

  div.hp_menue a,div.extras
          { background:     linear-gradient( to bottom, #F5BBB7, #E31E1A 55%);
			box-shadow:2px 2px 5px #292929;
			background-size: auto 100% ;      }

 	div.hp_menue a,
    div.hp_menue ul#hp_navi ul li a { border-color: #F5E6E5; }
   /* Abstand zwischen Buttons im HP-Menü  */
   /*nur für eckige Buttons */
    div.hp_menue a,
    div.hp_menue ul#hp_navi ul li a,
  div.hp_menue ul#hp_navi ul ul li  a,
  div.hp_menue ul#hp_navi ul ul ul li  a   { border-top:     0px solid #F5E6E5;
                                             border-bottom:  15px solid #F5E6E5;
                                           }
  div.hp_menue ul#hp_navi ul li:nth-child(1) { border-top: 3px solid transparent; }  /* das ist der Abstand vom Anfang bis zum ersten Menüpunkt im Aufklappmenü */
  /*nur für runde Buttons */
  div.hp_menu ul#hp_navi li{margin-bottom:10px;}
  /* Ende */
    div.extras    { box-shadow:3px 3px 8px #292929;}
    div.extras a:hover { color: black; }     /*Farbe Text linke Auswahlliste bei hover*/
  div.hp_menue ul#hp_navi li:hover ,
    div.hp_menue ul#hp_navi ul li:hover,
    div.hp_menue ul#hp_navi ul ul li:hover,
  div.hp_menue ul#hp_navi ul ul ul li:hover { background: transparent;
                                              color: #000000;
                                            }
  div.hp_menue ul#hp_navi li:hover > a,
    div.hp_menue ul#hp_navi ul li:hover > a,
    div.hp_menue ul#hp_navi ul ul li:hover > a,
  div.hp_menue ul#hp_navi ul ul ul li:hover > a { background: #F5E6E5;
                                                  color: #000;
                                                }

  div.hp_menue ul#hp_navi li  a,
  div.hp_menue ul#hp_navi ul li  a,
  div.hp_menue ul#hp_navi ul ul li  a,
  div.hp_menue ul#hp_navi ul ul ul li  a { /*border-color:transparent;
                                  background:transparent;*/
                                  color: #FFF;       }   /* Schriftfarbe Menue links */

  /*div.hp_menue ul#hp_navi li  ,
  div.hp_menue ul#hp_navi ul li  ,
  div.hp_menue ul#hp_navi ul ul li  ,
  div.hp_menue ul#hp_navi ul ul ul li   { margin-bottom: 3px;
                border-radius: 5px;
                  padding:       5px 5px 7px 5px;
                background:    linear-gradient( to top,#6B5A53, #DC9761);
                 border:        1px solid #DC9576;
                 box-shadow:    0px 1px 2px #999; } */  /* Schriftfarbe Menue links */


  div.hp_menue ul#hp_navi{
          font-size: 110%;
          background:  #A80104;
                  }

  div.hp_menue li a   { border-radius: 8px;
                   padding:       7px 5px 6px 5px; /*oben, rechts, unten, links*/
                   background:    linear-gradient( to bottom, #F5E6E5, #A80104 75%);
                   border:        3px solid #A80104;
                   box-shadow:    0px 1px 2px #999;
                   color:         black;
                  }
  div.hp_menue a  { height:          21px;
                    padding:         0px;
                    padding-left:    8px;
                    padding-top:     6px;
                    margin:          0px;
          color: #000;
                 }
				 
  @media all and (max-width: 800px)                               /* Menue für kleine Displays */
  { div.menue_button, div.menue_nach_button        { background: #A80104; }
    div.menue_nach_button  ul li                   { background: #F5E6E5; }
      div.menue_nach_button  ul li li                { background: #F0E6E6; }
      div.menue_nach_button  ul li li li             { background: #E7E2E1;  }
      div.menue_nach_button, div.menue_nach_button a { color: #000; }
  }
/************************************************************ Mittelteil ************ ***********************************/
    #inhalt { border:           4px solid #A80104;            /* Mittelteil 339999 grün: 99CCCC */
              margin-top:       0px;
              color:            #241B16;
              background-color: #ECF0FE;
            }
  #inhalt_hp { border:           4px solid #A80104;            /* Mittelteil 339999 grün: 99CCCC */
              margin-top:       0px;
              color:            #241B16;
              background-color: #ECF0FE;
            }

/****************** Navigation Untermenü *********************/
    #naviinnen, #naviinnenuntermenue       {/* background-color: #A80104;   /*Stammdaten, Stammbaum, ...: dunkelblau */
      background-image: repeating-linear-gradient( hsla(359,99%,33%,0),          /* die Farbe #006699 umwandeln in hsla-Farbe */
                                                   hsla(359,99%,33%,0) 4px,      /* ist neuer Standard ind wesendlich felxibler und einfacher */
                                                   hsla(359,99%,33%,1) 1px,      /* beinhaltet Transparenzen das ist CSS3 */
                                                   hsla(359,99%,33%,1) 20px,     /* http://www.workwithcolor.com/hsl-color-picker-01.htm */
                                                   hsla(359,99%,33%,0) 1px,
                                                   hsla(359,99%,33%,0) 33px);
                                                    font-weight:      normal;    }
    #naviinnen  ul li, #naviinnenuntermenue  ul li      { background-color: #CCCCCC; }  /*grau*/
    #naviinnen  a, #naviinnenuntermenue  a              { color: #000000;             /* schwarz */
                                                                                                   font-weight: normal;    }
    #naviinnen a.akt, #naviinnenuntermenue  a.akt       { color: #FB8226; }        /*orange */
    #naviinnen  a:hover , #naviinnenuntermenue  a:hover { color: #FFFFFF; }      /*weiss*/

/****************** Link *********************/
a {              color:            #241B16; }                 /* Navigation allgemein 241B16 */
a:hover {        color:            #1F0000; }
a.button {       background-color: #F8FEFE; }                 /* Link als Button auf Seite 66CCFF F8FEFE*/
a.buttonakt {    background-color: #8A2B29; }                 /* aktuell ausgewählte Generation */
a.button:hover { color:            #BF0000; }                 /* BF0000 rot */
a.left {         color:            #FAF8F8; }                 /* Farbe Text linke Auswahlliste */
a.eingabe, a.auswahljs  {      background-color: #F8FEFE; }                 /* Button zum editieren 99CCFF*/
a.eingabestb {   background-color: transparent; }             /* Button zum editieren im Stammbaum*/
a.sprache {      color:            #312316; }                 /* Navigation Sprache */

.tabletiere          { color:            #312316; }           /* intern */
.tabletiere tr:hover { background-color: #DC0206; }           /* markiertes Tier in Tabelle */
a.tier               { color:            #241B16; }
 .tabletiere  td.name   { width: 23%; }                                     /* Weiten der Spalten */
.tabletiere  td.gebdat { width: 5%; }
.tabletiere  td.adresse{ width: 16%; }  /*Breite für Farbe+Züchter*/
.tabletiere  td.zbnr   { width: 12%; }   /*Breite für ZbNr+Rasse*/
.tabletiere  td.bild   { width: 2%; }
  .farbe1 { background-color: #F8FEFE; }                      /* Farben für Farbwechsel in Tabellen */
  .farbe2 { background-color: #B9B8B8; }                      /* C3DD92 = grün , C7C6AE = hellgrau, D4823C = braun*/
  .farbe2hell { background-color: #E1E9ED; }

/**************** Group Links ********************/
 .linkbutton_gruppe li a span.color_DECKMELDUNG, table.statistik tr.color_DECKMELDUNG, table.statistik td.color_DECKMELDUNG { background-color:#778E33; }
.linkbutton_gruppe li a span.color_NICHTAUFGEN, table.statistik tr.color_NICHTAUFGEN, table.statistik td.color_NICHTAUFGEN { background-color:#FFAFAF; }
/*****************************************/


div.bezeichnung { width:       150px;                         /* Tier  */
                  color:      #000000;                   /* #005050; */
                }
div.bezeichnung_spalte {                                      /* Stammdaten Breite Spalte Bezeichnung*/
  background-color:; /* #F7F1EA;                                Farbe aktivieren um Anpassungen in Felderdatei zu vereinfachen */
  width:            145px;
  min-width:        145px;
  font-weight:      bold;
  color:  #000000;
  }
div.inhalt_spalte {                                            /* Stammdaten Breite Spalte Daten*/
 /* background-color: #FFFFFF; */
  width:            520px;
  min-width:        520px;
  }
div.inhalt       { width: 72%;  }
table.stb        { background-color: #E31E1A; }               /* Stammbaum */
.tabletierestamm { color:            #312316;                 /* Table Geschwister / Nachkommen */
                   background-color: #E31E1A;            /* Rahmen um Mittelteil 99CCCC */
                 }
.tabletierestamm .zwischentitel,table.statistik th, table.statistik .zwischentitel, h2.zwischentitel  { background-color: #99CCCC;  }
.obergruppe       { background-color: #99CCCC;   }
.nachkommen1      { background-color: #F8FEFE; }                      /* Farben für Farbwechsel in Tabellen beim Aufklappen der Nachkommen*/
.nachkommen2      { background-color: #F8FEFE; }

.table_nachkommen         { border:           3px solid #99CCCC; }
table.statistik div.tiere {   background-color:#ECF0FE ;}
td.stb, div.zb_satz, div.box, form.suchen { background-color: #FAF8F8; } /* Hintergrundfarbe Stammbaum, Zuchtbuch  Ausgabebox z.B. Inzucht  Suche in Admin und Datenverwaltung */
   .zb_bez {  color:  #532004;                               /* Bezeichnung */
           }
#erwsuche_formular   { color:            #ECF0FE;            /* Schriftfarbe Formular erweiterte Suche */
                       background-color: #E31E1A;            /* Hintergrundfarbe Formular erweiterte Suche */
                     }
#erwsuche_ergebnis, #suche_inhalt, #eingabe_merkmal { color: #241B16;              /* Schriftfarbe Ergebnis erweiterte Suche */    /* Suche Eltern /Bes. / Züchter  */   /* Eingabe der Merkmale */
                                                      background-color: #ECF0FE;   /* Hintergrundfarbe Ergebnis erweiterte Suche */
                                                    }
#eingabe_extern  { color:            #241B16;                 /* Eingabe extern */
                   background-color: #ECF0FE;
                   width:            430px;
                 }
span.maennlich   { color: #00A0FF; }                      /* Farbe für Zeile männliches Tier */
span.weiblich    { color: #E938FC; }                      /* Farbe für Zeile weibliches Tier*/
span.checkbox1   { width: 33%; }                              /* Ausgabeweite für Checkboxen */

/******************** Kalender ***********************************/
.kalender { background-color:#ffffff; }
.kalender a:link, .kalender a:visited, .kalender a:active { color: black; }
.kal-header,.kal-header-lnk { color:                #cceeff;
                              background-color:     #E31E1A;
                            }
.kal-today { color: red; }
.kal-head, .kal-weekhead, .zurueck{  background-color: #F8FEFE; }
.kal-week  { color:            #666666;
             background-color: #F8FEFE;
           }
.choose    { border: 1px solid #cceeff;
             background-color: #F8FEFE;
           }
.ausg_auf_hint { color: white; }
#imp_dat ul li a { border-color: white; }  /* Linien zwischen Impressum und Datenschutz */
 /*********************** Statistik *********************************/
div.statistik_auswahl, div.statistik_auswahl_2, div.statistik_starten, div.statistikjahr { background-color:#FAF8F8; }
#merkmalanzeige, div.experte_merkmal, div.experte_verknuepfung                           { background-color:#ECF0FE; }
span.innenabfrage, div.statistikjahr label                                               { font-weight:      bold; }
a.experteaufruf          { background-color: #99CCCC; }
span.zusammen            { border:           1px solid black; }
span.abfrage, span.verkn { background-color: #E0FF00; }
span.innenverkn          { font-weight:      normal; }

/* Ausstellung */

.hint_maennlich { background-color: #7D943A; }                      /* Farbe für Hintergrundfarbe Text männliches Tier */
.hint_weiblich  { background-color: #D6ED9D; }                      /* Farbe für Hintergrundfarbe Text weibliches Tier*/

div.eingabe_aussen { background-color: #DCECA1;
                  }
				  
/********************* Show *********************************/
h2.meldung { background-color: #A80104;
             margin-bottom: 7px;
             -moz-border-radius: 7px;
             -webkit-border-radius: 7px;
             border-radius: 7px;
             -moz-box-shadow:  2px 3px 0 0 rgba(0, 0, 0, .3);
             -webkit-box-shadow: 2px 3px 0 0 rgba(0, 0, 0, .3);
             box-shadow:  2px 3px 0 0 rgba(0, 0, 0, .3);
			 color : white;
           }