@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700);

/* Grundeinstellungen der Website */

* {
    margin: 0px;
    padding: 0px;
    font-family: 'Open Sans', Arial;
    font-size: 13px;
    font-weight: 400;
    color: #554c3b;
}

body {		
    background-color: #e9e6da;
}

img {
	border: 0px;
	border-radius: 3px;	 
}

/* Grundraster der Website */

div#website {
    width: 1000px;
    margin: 20px auto 0px auto;
    border-radius: 3px;
    -webkit-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.40);
    -moz-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.40);
    box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.40);
}

	/* Header-Bereich der Website */
	
	header {
	    width: 1000px;
	    height: 115px;
	    background-image:url(../graphics/layout/header.png);
	}
		
	    header h1 {
		width: 270px;
		height: 84px;
		float: left;
	    }	
	    
	    /* Sprachauswahl */
	    
	    header nav#language ul {
		padding: 17px 0px 0px 916px;
		list-style: none;
	    }

		header nav#language ul li {				
		    width: 23px;
		    height: 12px;
		    margin: 0px 0px 0px 4px;
		    padding: 1px;
		    background-color: #8e8063;
		    border-radius: 3px;
		    float:left;				
		}
		
	    /* Navigationsleiste */
    
	    header nav#menu ul {
		padding: 38px 22px 0px 0px;
		list-style: none;
		float:right;
	    }

	    header nav#menu ul li {
		float:left;
		margin: 0px 0px 0px 0px;
		padding: 0px 4px 0px 4px;
	    }
	    
		/* Gestaltung der Dropdown-Menüs */		
		
		ul li ul.dropdown_dogs {
		    margin: 0px 0px 0px -10px !important;
		    padding: 6px 0px 4px 0px !important;
		    position: absolute;
		    z-index: 999;
		    background-color: #c7b684;
		    
		    filter: alpha(opacity=0); 
		    opacity: 0;
		    -webkit-transition: all 0.5s linear; 
		    -moz-transition: all 0.5s linear; 
		    -o-transition: all 0.5s linear; 
		    -ms-transition: all 0.5s linear; 
		    transition: all 0.5s linear;
		}		
		
		ul li:hover ul.dropdown_dogs {
		    margin: 0px 0px 0px -10px !important;
		    padding: 6px 0px 4px 0px !important;
		    position: absolute;
		    z-index: 999;
		    background-color: #c7b684;	
		    border-radius: 3px;
		    
		    filter: alpha(opacity=1); 
		    opacity: 1;
		    -webkit-transition: all 0.5s linear; 
		    -moz-transition: all 0.5s linear; 
		    -o-transition: all 0.5s linear; 
		    -ms-transition: all 0.5s linear; 
		    transition: all 0.5s linear;
		}
		
		ul li ul.dropdown_dogs li {
		    width: 57px;
		    padding: 0px 8px 4px 8px !important;		    
		    display: block;
		    text-align: center;
		    clear: both;
		}		
		
		ul li ul.dropdown_breed {
		    margin: 0px 0px 0px -12px !important;
		    padding: 6px 0px 4px 0px !important;
		    position: absolute;
		    z-index: 999;
		    background-color: #c7b684;
		    
		    filter: alpha(opacity=0); 
		    opacity: 0;
		    -webkit-transition: all 0.5s linear; 
		    -moz-transition: all 0.5s linear; 
		    -o-transition: all 0.5s linear; 
		    -ms-transition: all 0.5s linear; 
		    transition: all 0.5s linear;
		}		
		
		ul li:hover ul.dropdown_breed {
		    margin: 0px 0px 0px -12px !important;
		    padding: 6px 0px 4px 0px !important;
		    position: absolute;
		    z-index: 999;
		    background-color: #c7b684;	
		    border-radius: 3px;	    
		    
		    filter: alpha(opacity=1); 
		    opacity: 1;
		    -webkit-transition: all 0.5s linear; 
		    -moz-transition: all 0.5s linear; 
		    -o-transition: all 0.5s linear; 
		    -ms-transition: all 0.5s linear; 
		    transition: all 0.5s linear;
		}
		
		ul li ul.dropdown_breed li {
		    width: 56px;
		    padding: 0px 8px 4px 8px !important;		    
		    display: block;
		    text-align: center;
		    clear: both;
		}
	
	/* Content-Bereich auf der Startseite */
	
	p#content_index {
	    width: 1000px;
	    height: 550px;
	    border-bottom: 1px solid #c7b684;
	}
	
	    p#content_index img {		
		border-radius: 0px;	
	    }
		
	/* Gestaltung des Content-Bereich mit Inhalt */
	
	div#content {
	    width: 998px;
	    min-height: 650px; 
	    background-color: #ffffff;
	    border: 1px solid #ffffff;
	}
	
	    /* Gestaltung der Überschriften */
	    
	    div#content h2 {
		margin: 25px 26px 0px 25px;
		float: left;
	    }
	    
	    div#content h3 {
		margin: 20px 26px 4px 78px;
		font-family: 'Open Sans', Arial;
		font-size: 16px;
		font-weight: 400;		
		color: #c7b785;
	    }
	    
	    	div#text h3 {
		    margin: 0px 26px 4px 0px;
		    font-family: 'Open Sans', Arial;
		    font-size: 16px;
		    font-weight: 400;		
		    color: #c7b785;
	    	}

	    div#content h4 {
		margin: 10px 26px 4px 78px;
		font-family: 'Open Sans', Arial;
		font-size: 16px;
		font-weight: 400;		
		color: #c7b785;
	    }

		div#text h4 {
		    margin: 10px 26px 4px 0px;
		    font-family: 'Open Sans', Arial;
		    font-size: 13px;
		    font-weight: 400;		
		    color: #c7b785;
    		}  
	    	    
	    /* Textuelle Gestaltung */
	    
	    div#content div#text {
		margin: 21px 26px 15px 78px;
	    }
		
	    div#content p {
		margin: 0px 26px 0px 78px;
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;	
	    }

	    div#content p.distance {
		margin: 0px 26px 7px 78px;
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;	
	    }
	    
		div#text p {
		    margin: 0px 0px 7px 0px !important;
		    -webkit-hyphens: auto;
		    -moz-hyphens: auto;
		    -ms-hyphens: auto;
		    hyphens: auto;
		}
		
		div#text ul {
		    margin: 0px 0px 10px 13px;
		}
		
		div#text ul li {
			text-indent: 0px;
			padding: 0px 0px 2px 0px;
		}
	    
	    /* Profilbild */
		
	    div#content p#picture {
		width: 315px;
		height: 315px;
		margin: 25px 25px 10px 26px;
		float: right;
	    }
	    
	    /* Gestaltung der Bildergalerie (Lightbox) */
		
	    div#content ul#lightbox {
		width: 974px;
		height: 134px;
		margin: 0px 0px -1px -1px;
		padding: 26px 0px 0px 26px;
		clear: both;
		list-style: none;
		background-color: #ebeccd;
	    }
	    
		div#content ul#lightbox li {
		    width: 108px;
		    height: 108px;
		    margin: 0px 12px 0px 0px;
		    float: left;				    
		}
	
	/* Gestaltung der Fußzeile */
	
	footer {
	    width: 1000px;
	    height: 29px;
	    clear: both;
	    background-color: #c7b684;
	}
	
	    footer nav ul {
		margin: 0px 25px 0px 0px;
		list-style: none;
		float: right;
	    }
		
	    footer nav ul li {
		margin: 6px 0px 0px 7px;
		float:left;
	    }