/* Ensure html and body take up the full screen height */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    /* Set the background image URL */
    background-image: url('http://kdkdesign.com/images/elephant.jpg'); 
    
    /* Center the image on the screen */
    background-position: center; 
	
    
    /* Do not repeat the image */
    background-repeat: no-repeat; 
    
    /* Scale the image to cover the entire container (viewport) */
    background-size: cover; 
    
    /* Optional: Fix the background so it doesn't scroll with content */
    background-attachment: fixed;
}

/* Optional: Styling for your actual page content so it's readable */
.content {
    position: relative;
    z-index: 1; /* Ensures content is above the background */
    color: white; /* Example text color */
    text-align: center;
    padding-top: 100px;
    /* Add other content styling as needed */
}@charset "UTF-8";
/* CSS Document */