* {
     font-family: Helvetica, Arial, Verdana, sans-serif;
}

html {
}

body {
     width: 100%;
     text-align: center;
     background-color: black;
}

body {background-image: url('pattern-bg-fill.jpg'); background-repeat: repeat; }

#wrapper {
         margin-top: 20px;
         margin-left: auto;
         margin-right: auto;
         width: 640px;
         height: 540px;
         background-color: black;
         color: white;
         text-align: center;
         border: solid 1px gray;
         position: relative;
}

/* #wrapper {background-image: url('background-handmade-paper-edited-cropped-640x540px-drop-shadow.png'); background-repeat: no-repeat; 
background-color: transparent;
border: none;} */

#wrapper {background-image: url('background-mask-640x540px.png'); background-repeat: no-repeat; 
background-color: transparent;
}

/* #wrapper {background-image: none; background-repeat: no-repeat; 
background-color: transparent;
border: solid 1px gray;} */

h1 {
}

h2 {
}

h3 { 
}

a:link {color: white; }
a:visited {color: white; }
a:hover {color: #00FFFF; }
a:active {color: white; }

.section {float: left; text-align: center; width: 33.3%; border: none; }
.section-name {float: left; text-align: center; width: 33%; color: #D3D3D3; font-weight: normal; margin-top: 10px; padding-bottom: 10px;}

#artist-name {clear: both; text-align: center; width: 99%; }

#footer { width: 640px; margin-left: auto; margin-right: auto;}

#copyright {float: left; clear: both; font-size: x-small; width: 100%; background-color: gray; border: solid gray 1px; margin-left: -1px;}
#copyright a:link {color: black; }
#copyright a:visited {color: black; }
#copyright a:hover {color: #00FFFF; }
#copyright a:active {color: black; } 
#home {float: left; margin-left: 10px;}
#about {float: left; margin-left: 10px;}
#contact {float: left; margin-left: 10px; }
#blog {float: left; margin-left: 10px; }
#copyright_text {float: left; margin-left: 10px;}

#artworks {float: left; margin-left: auto; margin-right: auto; text-align: center; position: relative; width: 99%}

#viewport_image {text-align: center; margin-top: 20px; margin-bottom: 15px;}

#artwork_title {float: left; clear: both; font-weight: bold; margin-left: auto; margin-right: auto; text-align: center; width: 99%;}

#artwork_descr {float: left; clear: both; margin-left: auto; margin-right: auto; text-align: center; width: 99%;}

#thumbnail_container {float: left; margin-left: 20px; padding-bottom: 20px; margin-right: 10px; }

#portfolio_navigation {float: left; clear: both; width: 99%; margin-top: 10px;}
#previous_navigation {float: left; }
#next_navigation {float: right; }

#categories {float: left; margin-left: 20px; padding-bottom: 20px; margin-right: 10px; }

.thumbnail_image {float: left; margin-top: 20px; margin-left: 20px; }
.bio {float: left; text-align: left; margin-left: 10px; margin-right: 10px; margin-bottom: 20px; }
.bio a:link {color: red; white-space: nowrap;}
.bio a:visited {color: red; white-space: nowrap;}
.bio a:hover {color: #00FFFF; white-space: nowrap;}
.bio a:active {color: #00FFFF; white-space: nowrap;} 
.bio img {float: left; margin-right: 10px; margin-bottom: 10px; }

#contact_wrapper {text-align: left; }
#contact_wrapper p label {float: left; clear: left; width: 100px; margin-left: 20px; }
#contact_wrapper input {margin-left: 1px; }
#contact_wrapper textarea {margin-left: 1px; text-align: left; }