/**************************************************************************************************/

html
{
	margin: 0;
	padding: 0;
	overflow-y: scroll;
}

body
{
	margin: 0;
	padding: 0;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
    font-size: 17px;
	text-align: left;
	line-height: 1.5em;
	color: #252525;
    background-color: #dedbcd;
}

/**************************************************************************************************/

    #header
    {
    	margin: 0 auto;
    	padding: 0;
        width: 100%;
        position: relative;
        display: block;
    }
    
        @media only screen and ( max-width: 1000px )
        {
            #header
            {
            	margin: 200px auto 0 auto;
            }
        }
        
        @media only screen and ( max-width: 500px )
        {
            #header
            {
            	margin: 150px auto 0 auto;
            }
        }
/**************************************************************************************************/ 
    
    #top
    {
    	margin: 0 auto;
    	padding: 0;
        background-image: url(/layout/top-hg.png);
        background-position: top center;
        background-repeat: no-repeat; 
        width: 100%;
        z-index: 100;
        position: relative;
        height: 200px;
        position: absolute;
    }
    
        @media only screen and ( max-width: 1000px )
        {
            #top
            {
            	margin: -90px auto 0 auto;
            	padding: 0;
                background-image: url(/layout/top-hg-mobil.png);
                background-position: top center;
                background-repeat: no-repeat; 
            }
        }
        
/**************************************************************************************************/ 

    #logo
    {
        position: absolute;
        left: 20%;
    }
    
        @media only screen and ( max-width: 1750px )
        {
             #logo
            {
                left: 8%;
            }
        }
    
        @media only screen and ( max-width: 1300px )
        {
            #logo
            {
                left: 2%;
            }
        }
        
        @media only screen and ( max-width: 1000px )
        {
            #logo
            {
                top: -50px;
                right: 0; 
                text-align: center;    
            }
            
            #logo img
            {
                width: 200px !important;
                height: auto !important; 
            }

        }
        
        @media only screen and ( max-width: 500px )
        {
            #logo
            {
                top: -10px;
                right: 0; 
                text-align: center;    
            }
            
            #logo img
            {
                width: 120px !important;
                height: auto !important; 
            }

        }

/**************************************************************************************************/

    #bild
    {
        margin: 0 auto;
        padding: 0;     
        width: 100%;
        max-width: 100%;  
        position: relative;
    }

    #bild div
    {
        margin: 0;
        padding: 0;      
    }

    #bild p
    {
        padding: 0 !important;
        margin: 0 !important;
    }

    #bild .blend
    {
    	position: absolute;
    	top: 0;
    	left: 0;
    }

    #bild .spacer
    {
    	padding: 0 !important;
        margin: 0 !important;
    }

    #bild .first
    {
    	z-index: 2;
    }

    #bild .second
    {
    	z-index: 1;
    }
    
    #bild img
    {
        margin: 0;
        padding: 0; 
        max-width: 100%;
        width: 100% !important;
        height: auto !important;
    }

    #bild .hiddenclear
    {
        display:none;
    }
    
        @media only screen and ( max-width: 1000px )
        {
            #bild
            {
                margin: 50px 0 0 0;  
            }
        }
    
/**************************************************************************************************/

    #kontakt
    {
    	margin: -5px auto 0 auto;
    	padding: 0;
        width: 100%;   
        height: 65px;   
        background-image: url(/layout/kontakt-hg.jpg);
        background-position: top center;
        background-repeat: no-repeat;
        font-size: 22px;
        font-weight: bold;
        text-transform: uppercase;
    }

    #kontakt p, #kontakt ul
    {
        margin: 0; 
        padding: 10px 0;
    }
    
    #kontakt div:first-child
    {
        position: relative;
        left: 20%;
        width: auto; 
        float: left;
        color: #fff;
        margin: 0; 
        padding: 0;
    }
    
    #kontakt div:first-child a
    {
        color: #fff; 
        text-decoration: none;
    } 
        
    #kontakt div:nth-child(2)
    {
        right: 20%;
        width: auto; 
        position: relative; 
        float: right;
        margin: 0; 
        padding: 0;
    }
    
    #kontakt div:nth-child(2) li
    {
        list-style-type: none; 
        float: left;
        background-color: #fff;
        color: #252525;
        padding: 2px 15px;
        margin: 0 5px;
        height: 40px;
    }
    
    #kontakt div:nth-child(2) a
    {
        color: #252525;
        text-decoration: none;  
    }
    
    #kontakt div:nth-child(2) a:hover
    {
        color: #1a80c7;
        text-decoration: none;  
    }  
    
    #kontakt img
    {
        vertical-align: -40%;
        margin: 0 5px 0 0;
        padding: 0;      
    }
    
        @media only screen and ( max-width: 1750px )
        {
            #kontakt div:first-child
            {
                left: 8%;
            }
            
            #kontakt div:nth-child(2)
            {
                right: 8%;
            }
        }
    
        @media only screen and ( max-width: 1300px )
        {
            #kontakt
            {
                font-size: 20px;
            }
            
            #kontakt div:first-child
            {
                left: 2%;
            }
        }
        
        @media only screen and ( max-width: 1000px )
        {
            #kontakt
            {
                font-size: 16px;
            }
            
            #kontakt div:nth-child(2)
            {
                right: 2%;
            }
        }
        
        @media only screen and ( max-width: 750px )
        {
            #kontakt
            {
                height: 120px;
            }

            #kontakt div:first-child
            {
                float: none;
                display: block;
                margin: 0 auto;
                text-align: center;
            }
            
            #kontakt div:nth-child(2) li
            {
                padding: 2px 1%;
                width: 46%;
                margin: 0 1%;
            }
            
            #kontakt div:nth-child(2)
            {
                float: none;
                display: block;
                margin: 0 auto;
                text-align: center;
            }
        }
        
        @media only screen and ( max-width: 500px )
        {
            #kontakt
            {
                height: 150px;
            }
            
            #kontakt div:first-child
            {
                left: 0;
            }
            
            #kontakt div:nth-child(2)
            {
                right: 0;
            }
            
            #kontakt div:nth-child(2) img
            {
                float: none;
                display: block;
                clear: both;
                margin: 0 auto;
            }
            
            #kontakt div:nth-child(2) 
            {
                text-align: center;
                text-transform: none;
                font-size: 14px;
            }
            
            #kontakt div:nth-child(2) li
            {
                height: 70px;
            }
            
        }


/**************************************************************************************************/

    #inhalte
    {
        margin: 0 auto;
        padding: 55px 2% 35px 2%;
        max-width: 1500px;
        width: 96%;
        text-align: left;
        display: block; 
        position: relative;
    }

    #inhalte article, #inhalte div
    {
        margin: 0;
        padding: 0;
    }
    
    #inhalte h1
    {
        color: #1a80c7;
        font-size: 45px;
        text-transform: uppercase;
        margin: 25px 0 10px 0;
        padding: 0;
        line-height: 1.0em;
    }
    
    #inhalte h2
    {
        color: #252525;
        font-size: 25px;        
        margin: 25px 0 5px 0;
        padding: 0;
    }
    
    #inhalte h3
    {
        color: #1a80c7;
        font-size: 20px;        
        margin: 15px 0 5px 0;
        padding: 0;
    }

    #inhalte a
    {
        color: #252525;
        text-decoration: underline;
    }

    #inhalte a:hover
    {
        color: #504f4f;
        text-decoration: none;
    }
    
    @media only screen and ( max-width: 700px )
    {
        #inhalte h1
        {
            font-size: 30px;   
        }
        
        #inhalte h2
        {
            font-size: 23px;   
        }
        
        #inhalte h3
        {
            font-size: 19px;   
        }
    }
    
    @media only screen and ( max-width: 500px )
    {
        #inhalte 
        {
            padding: 0 2%;  
        }
        
    }

    /**************************************************************************************************/

    #innen
    {
        margin: 0;
        padding: 0;
        text-align: center;
        width: 100%;
        display: block; 
    }
    
    #innen div
    {
        margin: 0;
        padding: 25px 2%;
        border-bottom: 1px solid #74726b;
    }
    
    #innen article
    {
        margin: 25px 0;
        padding: 0 2%;
    }
    
    #innen p
    {
        padding: 10px 150px;
    }

    #innen img
    {
        
        max-width: 100% !important; 
        height: auto !important;
    }
    
    #innen iframe
    {
        width: 100%;   
    }
    
    #innen ul
    {
        text-align: left;
        padding: 10px 150px; 
    }
    
    #innen #anker
    {
        padding: 25px 0 0 0;
    }
    
    #innen .bilderleiste p   
    {
        width: 100%; 
        display: flex;  
        display: -ms-flexbox;  
        justify-content: space-between; 
        flex-wrap: wrap; 
        margin: 10px auto;
        padding: 0;
        border: 0;        
    }
    
    #innen .bilderleiste a
    {
        padding: 0 1% 0 0; 
        width: 32%;    
    }

    #innen .datenschutz ul
    {
        text-align: center;
    }
    
    #innen .schneebericht
    {
        width: 100% !important;  
        margin: 10px auto;
        padding: 0;
        border: 0 !important;
    }

    #innen .schneebericht div
    {
        margin: 0 3.3% 0 0; 
        padding: 0;  
        width: 30%;
        float: left;         
    }
    
    #innen #sitemap ul
    {
         padding: 0 0 0 20px;
    }
    
        @media only screen and ( max-width: 1200px )
        {
            #innen p
            {
                padding: 10px 0;
            }
            
            #innen ul
            {
                text-align: left;
                padding: 10px 10px; 
            }
        }
        
        @media only screen and ( max-width: 700px )
        {
            #innen .bilderleiste a
            {
                padding: 0; 
                width: 100%;    
            }
        }
        
        @media only screen and ( max-width: 600px )
        {
            #innen .schneebericht div
            {
                margin: 0; 
                width: 100%;    
            }
        }
    
    
    /**************************************************************************************************/ 
    
    #innen .block
    {
        width: 100% !important; 
        display: flex !important;  
        display: -ms-flexbox !important;  
        justify-content: space-between; 
        flex-wrap: wrap; 
        margin: 10px auto;
        padding: 0;
        border: 0 !important;
    }

    #innen .block div
    {
        margin: 0 1% 0 0; 
        padding: 0;
        flex: 1;  
        width: 49%;
        height: auto;
        position: relative;
        overflow: hidden;  
    }
    
        @media only screen and ( max-width: 1000px )
        {
            #innen .block div
            {
                margin: 10px 0; 
                padding: 2%;
                flex: unset;  
                width: 96%;  
            }
        }

    #innen .block .linkButton 
    {
        position: absolute; 
        top: 15px;
        left: 0;
        right: 0;
        font-size: 28px;
        color: #fff; 
        text-transform: uppercase;
        background-color: transparent !important;  
    }
    
    #innen .block .linkButton a, #innen .block .linkButton a:hover
    {
        color: #fff;
        text-decoration: none;
        background-color: none;
        text-shadow: black 0 0 5px;  
    }

    #innen .block p
    {
        margin: 0 0 -5px 0; padding: 0;
        background-color: #333;
        width: 100%;
        height: auto;
        position: relative;
        overflow: hidden;
    }
    
    #innen .block img
    {
        margin: 0; 
        padding: 0;  
    }

    #innen .block div:hover img
    {
        transform: scale(1.1);
        opacity: 0.6;
    }
    

/**************************************************************************************************/

    #links
    {
        margin: 0 5% 0 0;
        padding: 0;     
        width: 60%;
        float: left;   
    }
    
    #links div
    {
        margin: 25px 0;
    }
    
    #links img
    {
        float: left;
        margin: 0 10px 0 0;
        padding: 0;
    }
    
    #links h1
    {
        color: #252525;
        font-size: 25px;        
        margin: 25px 0 5px 0;
        padding: 0;
    }  
     
/**************************************************************************************************/

     #rechts
    {
        margin: 0;
        padding: 0;     
        width: 35%;
        float: right;   
    }
    
    #rechts ul
    {
        margin: 0; 
        padding: 0;
    }
    
    #rechts li
    {
        margin: 1px 0; 
        padding: 0;
        list-style-type: none;
    }
    
    #rechts a
    {
        background-color: #1a80c7;
        padding: 5px 10px;
        color: #fff;
        display: block;
        text-decoration:none;
    }
    
    #rechts a:hover
    {
        background-color: #2db0e5;
        padding: 5px 10px;
        color: #fff;
        display: block;
    }
    
    #links img
    {
        width: 100%;
        max-width: 100%;
        height: auto !important;
    }
    
    @media only screen and ( max-width: 600px )
    {
        #rechts, #links
        {    
            width: 100%;
            float: none;
            display: block;   
        }
    }

    @media only screen and ( max-width: 400px )
    {
        
        #links img, #bisy #links img
        {
            width: 100%;
            max-width: 100% !important; 
            height: auto !important;
            float: none;
            display: block;
            margin: 0;
        } 
    }

/**************************************************************************************************/

    #footer
    {
        margin: 0;
        padding: 0;
        background-image: url(/layout/kontakt-hg.jpg);
        background-position: top center;
        background-repeat: repeat-y;
        color: #fff; 
        border-top: 5px solid #fff;
    }
    
    #footer h4
    {
        font-size: 20px;
        font-weight: bold;
        margin: 0; 
        padding: 0;
    }
    
    #footer p
    {
        margin: 0; padding: 0;
    }
    
    #footer a
    {
        color: #fff;
        text-decoration: none;
    }
    
    #footer a:hover
    {
        color: #fff;
        text-decoration: underline;
    }
    
    #footer .linkButton a
    {
        background-color: #fff;
        color: #252525;
        padding: 0 10px;
    }
    
    #footer .infoleiste
    {
        margin: 0 auto;
        padding: 15px 0;
        max-width: 1500px;
        width: 96%;
        text-align: left;
        display: block; 
        position: relative;
        display: flex !important;  
        display: -ms-flexbox !important;  
        justify-content: space-between; 
        flex-wrap: wrap; 
            
    }
    
    #footer .infoleiste .block
    {
        flex: 1;
        display: inline;
        padding: 10px 0;
    }

    #footer .copyright
    {
        background-color: #303030;
        padding: 2px 0;
        font-size: 12px;
    }
    
    @media only screen and ( max-width: 1000px )
    {
        #footer .infoleiste .block
        {
            display: block;
            flex: unset;
            width: 96%;
            padding: 20px 2%;
            text-align: center;  
        }
    }
    
/**************************************************************************************************/

.hiddenclear, hr
{
	font-size: 1px !important;
	line-height: 1px !important;
	clear: both !important;
	margin: 0 !important;
	padding: 0 !important;
	height: 1px !important;
	visibility: hidden !important;
}

.clear
{
	clear: both !important;
}