/* @import must be at top of file, otherwise CSS will not work */
@import url("http://hello.myfonts.net/count/283431");
@font-face {font-family: 'BrandonGrotesque-Black';src: url('webfonts/283431_0_0.eot');src: url('webfonts/283431_0_0.eot%3F') format('embedded-opentype'),url('webfonts/283431_0_0.woff') format('woff'),url('webfonts/283431_0_0.ttf') format('truetype');} 
@font-face {font-family: 'BrandonGrotesque-BlackItalic';src: url('webfonts/283431_1_0.eot');src: url('webfonts/283431_1_0.eot%3F') format('embedded-opentype'),url('webfonts/283431_1_0.woff') format('woff'),url('webfonts/283431_1_0.ttf') format('truetype');}
@font-face {font-family: 'BrandonGrotesque-Medium';src: url('webfonts/283431_2_0.eot');src: url('webfonts/283431_2_0.eot%3F') format('embedded-opentype'),url('webfonts/283431_2_0.woff') format('woff'),url('webfonts/283431_2_0.ttf') format('truetype');}
 

/*static styles*/
* {
    font-family: Arial,Helvetica,sans-serif;
    font-size:11px;
    text-align: left;
    
}

a {
   text-decoration: none;
   color: #666;
   outline:none;
   
}
a:hover {
    
    color: #ff0099;
}
html {
    overflow-x: hidden;
}

html , body {    
    height: 100%;
}


body {
    margin: 0;
    padding: 0;
    background: url(../images/bg.png) repeat-x top center #fefcf5;
}

.hide {
    display: none;
}

.clear {
    clear: both;    
}

input, select,textarea {    
    border: 1px solid #666;
}

fieldset {
    border: none;
    margin: 0;
    padding: 0;
}
#content legend {
    margin: 0;
    padding: 0;
}

/*graphic styles*/

#outerDiv {    
    margin: 0 0 0 0;    
}

    #header {
        
        position: absolute;
        z-index: 1000;
        width: 960px;
        height: 118px;
        background: #fff;
        margin: 0 auto 0 auto; 
        
    }
        #logo  {
            float: right;
            width: 100%;
            font-family: 'BrandonGrotesque-Black',Arial;
            font-size: 35px;
            color: #E07E62;
            text-align: right;
            text-transform: uppercase;
            letter-spacing: 2px;
            padding-top: 22px;
            cursor: pointer;
        }
        #mainNav {
            
            width: 633px;
            float: right;
            
            
        }
            #mainNavUL {
                
                list-style-type: none;
                margin-top: 0;
                padding-left: 90px;
            }
            #mainNavUL li {
                float: left;            
                height: 16px;
                margin-right: 10px;
                padding-right: 10px;
                margin-bottom: 6px;
                border-right: 1px solid #E07E62;
            }
                #mainNavUL li#n2,
                #mainNavUL li.contact{
                    margin-right: 0;
                    border-right: 0;
                    padding-right: 0;
                }
                #mainNavUL li#n3 {
                    margin-left: 42px;
                }
            #mainNavUL li a {
                
                font-family: 'BrandonGrotesque-Medium', Airal;
                line-height: 21px;
                font-size: 14px;
                color: #E07E62;
                text-align: right;
                
            }
       
            #mainNavUL li a:hover,#mainNavUL li a.act {
                color: #7BC8C2;
            }
            #mainNavUL li.contact a {
                color: #E0B678;
            }
            #mainNavUL li.contact a:after {
                content: "";
            } 
             
            
    #container {    
        width: 1024px;
        min-height:100%;
        margin: 0 auto 0 auto;        
    }
       
   
        #tray2 {
            
            position: relative;
            float: left;
            width: 1024px;
            min-height: 530px;
            background: url(../images/ALLE_BLUMEN_farbig.png) no-repeat center 0;
            margin-top: 25px;
        }
           
            #contents {
                
                position: absolute;
                bottom: 0;
                
            }
                div.article .text,
                div.article .image {
                    position: absolute;
                }
                
                
                div.article .text {
                    
                    border-radius: 50%;
                    width: 202px;
                    height: 202px;
                    background: rgba(123,200,194,0.9);                    
                }
                    div.article .text * {
                        
                        color: #fff;
                        text-align: center;
                        line-height: 17px;
                        font-size: 14px;
                    }
                    
                    
                    div.article div.text .bodytext {
                        margin: 60px 20px;
                        font-family: 'BrandonGrotesque-Medium',Arial;
                    
                    }
                    div.article div.text .bodytext a {
                        font-family: 'BrandonGrotesque-BlackItalic',Arial;
                        
                    }
                    div.article div.text .bodytext a:hover {
                        color: #E07E62;
                    }
                
                    
                    div.article .text {
                        z-index: 1000000000000;
                    }
                    
                    div#a1.article .text {
                        top: 20px;
                        left: 100px;
                    }
                        div#a1.article div.text .bodytext {
                            margin: 55px 10px;
                        }
                        
                        div#a2.article .text {
                            top: 0px;
                            left: 700px;
                            width: 270px;
                            height: 270px;
                        }
                            div#a2.article div.text .bodytext {
                                margin: 65px 0px;
                            }
                            
                        div#a3.article .text {
                            top: 120px;
                            left: 50px;
                            width: 196px;
                            height: 196px;
                        }
                            div#a3.article div.text .bodytext {
                                margin: 60px 10px;
                            }
                       
                        div#a4.article .text {
                            top: 160px;
                            left: 555px;
                            width: 270px;
                            height: 270px;
                        }
                            div#a4.article div.text .bodytext {
                                margin: 50px 0 0 0px;
                            }
                            
                        div#a5.article .text {
                            top: 210px;
                            left: 745px;
                            width: 280px;
                            height: 280px;
                        }
                            div#a5.article div.text .bodytext {
                                margin: 60px 0 0 0px;
                            }
                            
                        div#a6.article .text {
                            top: 210px;
                            left: 745px;
                            width: 235px;
                            height: 235px;
                        }
                            div#a6.article div.text .bodytext {
                                margin: 55px 0 0 0px;
                            }  
                
             
                #a1 .image {                    
                    top: 102px;
                    left: 276px;
                }
                
                #a2 .image {                    
                    top: 0px;
                    left: 486px;
                }
                
                #a3 .image {                    
                    top: 207px;
                    left: 186px;
                }
                
                #a4 .image {                    
                    top: 201px;
                    left: 429px;
                }
                
                #a5 .image {
                    top: 215px;
                    left: 588px;
                    
                }
                
                #a6 .image {                    
                    top: 102px;
                    left: 693px;
                }
                
                
                
            #biene1 {
                z-index: 1;
                position: absolute;
                bottom: 400px;
                /*margin-left: 190px;*/
                left: -10px;
                width: 97px;
                height: 80px;
                background: url(../images/Biene_rosa.gif) no-repeat 0 0;
                
            }
      
            #biene2 {
                z-index: 1;
                bottom: 380px;
                position: absolute;
                left: -200px;
                /*margin-left: 240px;*/
                
                width: 97px;
                height: 80px;
                background: url(../images/Biene_rot.gif) no-repeat 0 0;
                
            }
            
#impressum {
    z-index: 10;
    position: fixed;
    bottom: 10px;
    right: 10px;
    line-height: 20px;
}
    #impressum .csc-default {
        background: none;
        padding: 0 !important;
        margin: 0 !important;
    }
    #impressum .bodytext {
         text-align: right;
    }
    #impressum * {
        font-family: 'BrandonGrotesque-Medium', Arial;
        color: #E0B678;
        font-size: 12px;
        
    }
    #impressum a:hover {
        color: #7BC8C2;
    }
    
    
    



/*=========================================
	Media Queries
=========================================*/

/*2 columns*/
@media screen and (max-width: 1023px) {
    
    * {
        -webkit-text-size-adjust:none;    
    }
    #container {
        width: 960px;
        
    }
}
/*
@media screen and (max-width: 799px) {
 
    * {
           -webkit-text-size-adjust:none;    
    }   
    
}

@media screen and (max-width: 479px) {
    
    * {
        -webkit-text-size-adjust:none;    
    }
     
}

*/