body {
/*    background-image: url(../picts/burlap7.jpg); */
    background-color: rgb(100,90,70);
    background-color: rgb(170,173,160);
    background-color: rgb(200,203,190);
    background-color: rgb(210,208,190);
    background-color: rgb(220,220,200);
    background-color: rgb(220,218,202);
}

#back-menu {
    position: absolute;
    z-index: 0;
    top: 0;
    width: 94%;
    height: 17em;
    margin: 0 auto;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    background: rgb(220,223,210);
    box-shadow:rgba(0,0,0,0.6) 0px -26px 20px;
    background:-moz-linear-gradient(center top , rgb(230,229,216), rgb(210,208,192));
    background: -webkit-gradient(linear, center top, center bottom, from(rgb(230,229,216)), to(rgb(210,208,192)));

}


#content {
    position: relative;
    top: 0em;
    width: 95%;
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 1.5em auto -13em auto;
    padding: 0;
    font-size: 100%;
    border: 1px solid rgba(50,50,30,0.3); 
    background-color: rgb(245,245,244);
    background-color: rgb(240,240,235);
    box-shadow:rgba(0,0,0,0.4) 0px 20px 25px;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;

}

#push {
    height: 11em;
}

#footer {
    position: relative;
    width: 95%;
    margin: 0 auto;
    bottom: 0;
    height: 13em;
    color: rgb(50,50,30);
    text-align: right;
    background-color: rgb(60,60,40);
    border: 1px solid rgb(60,60,40);
}


@font-face {
    font-family: "Quark";
    src: url(../fonts/Quark.ttf) format("truetype");
}

@font-face {
    font-family: "Sansation";
    src: url(../fonts/Sansation_Regular.ttf) format("truetype");
}

@font-face {
    font-family: "La-Chata";
    src: url(../fonts/La-chata-normal.ttf) format("truetype");
}

@font-face {
    font-family: "ArchDaughter";
    src: url(../fonts/ArchitectsDaughter.ttf) format("truetype");
}

@font-face {
    font-family: "Anonymous";
    src: url(../fonts/Anonymous_Pro.ttf) format("truetype");
}

@font-face {
    font-family: "Whitehall";
    src: url(../fonts/whitehall.ttf) format("truetype");
}


#logo a:link {
    color: rgb(80,80,60);
    text-decoration: none;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;

}
#logo a:visited {
    color: rgb(80,80,60);
}

#logo a:hover {
    color: rgb(170,180,150);
}

#logo {
    font-family: "Quark";
    font-size: 4em;
    position: relative;
    right: 43px;
    letter-spacing: 0.1em;
    top: 0em;
    text-align: right;
    color: rgb(80,80,60);
}

#small-logo {
    font-family: "Quark";
    font-size: 1.2em;
    letter-spacing: 0.1em;
}




#logo2 {
    font-family: Arial;
    font-size: 1.1em;
    position: relative;
    top: -0.2em;
    right: 40px;
    text-align: right;
    letter-spacing: 0.75em;
    color: rgb(30,30,0);
}

#email-me a:link {
    color: rgb(120,120,100);
    text-decoration: none;
}

#email-me a:hover {
    color: rgb(170,180,150);
    text-decoration: underline;
}


#email-me {
    position: relative;
    left: 3em;
    bottom: 0.3em;
    text-align: left;
}

#burlap {
    position: absolute;
    bottom: -5em;
    left: 0em;
    width: 100%;
    height: 50%;
    background-image: url(../burlap4.jpg);
    z-index: 0;
}



body {
/*    background-image: url(../picts/burlap6.jpg);
    background: rgb(225,225,210); */
    font-family: "ArchDaughter", Helvetica;
    color: rgb(80,80,60);
    font-weight: light;
    font-size: 100%;
    text-align: center;
    margin: 0 auto;
    width: 94%;
}


a:link {
    text-decoration: none;
    color: rgb(80,80,255);
}

a:hover {
    text-decoration: underline;
}

#inner-content {
    margin-top: 1em;
    padding: 3em 3em;
    text-align: center;
    line-height: 1.2em;
    font-size: 100%;
}


body, html {
    height: 100%;
}


#header {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    background: #e1e1d2; /* Old browsers */
    background: -moz-linear-gradient(top,  #e1e1d2 0%, #e1e1d2 91%, #cdcdbe 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e1e1d2), color-stop(91%,#e1e1d2), color-stop(100%,#cdcdbe)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #e1e1d2 0%,#e1e1d2 91%,#cdcdbe 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #e1e1d2 0%,#e1e1d2 91%,#cdcdbe 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #e1e1d2 0%,#e1e1d2 91%,#cdcdbe 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #e1e1d2 0%,#e1e1d2 91%,#cdcdbe 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e1e1d2', endColorstr='#cdcdbe',GradientType=0 ); /* IE6-9 */

    box-shadow:rgba(0,0,0,0.7) 0px 0px 12px;
}

#top-logo {
    position: absolute;
    font-family: "Quark";
    font-size: 1.8em;
    color: rgb(210,210,190);
    top: 0.5em;
    left: 0.5em;
    text-align: left;
    clear: both;
}

#menu {
    position: relative;
    top: 0.5em;
    width: 98%;
    margin: 0 auto;
    z-index: 0;
    padding: 0.8em;
    font-size: 1.1em;
}

#menu a:link {
    border: rgb(155,155,120) solid 2px;
    text-decoration: none;
    color: rgb(155,155,120);
    padding: 0.2em 2em;
    margin: 0.3em 0.5em;
    text-align:right;
    line-height: 2.5em;
    display:inline;
    background-color: rgb(225,225,210);
    opacity: 0.6;
    border-radius: 15px;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
}

#menu a:visited {
    border: rgb(155,155,120) solid 2px;
    background-color: rgb(225,225,210);
    color: rgb(155,155,120);
    opacity: 0.6;
}


#menu a:hover {
    opacity: 0.8;
    color: rgb(115,115,100);
    border: rgb(115,115,100) solid 2px;
    text-align: right;
    -webkit-box-shadow: 3px 3px 5px 6px #ccc;
    box-shadow:rgba(75,75,60,0.7) 0px 2px 8px;
}


.albumThumb {
    border: black solid 1px;
    margin: 1em;
    width: 85px;
    height: 85px;
    text-decoration: none;
}

.thumbnail{
    position: relative;
    z-index: 0;
    text-decoration: none;
}

.thumbnail:hover{
    background-color: transparent;
    text-decoration: none;
    z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
    position: absolute;
    background-color: rgb(50,50,30);
    opacity: 0.9;
    box-shadow:rgba(0,0,0,0.7) 0px 0px 12px;
    border-radius: 10px;
    border: solid 1px black;
    padding: 1em;
    width: 16em;
    left: -1000px;
    visibility: hidden;
    color: white;
    text-decoration: none;
}


.thumbnail:hover span{ /*CSS for enlarged image on hover*/
    visibility: visible;
    text-decoration: none;
    z-index: 0;
    top: -20px;
    left: -83px; /*position where enlarged image should offset horizontally */

}

#to-left {
    text-align: left;
    padding: 0em 4em;
    font-weight: 600;
    font-size: 1.2em;
    text-decoration: underline;
}

#left-just {
    text-align: left;
}

#straight-font {
    font-family: Arial, Helvetica;
    color: rgb(145,145,130);
}

#out-list {
    padding: 0 2em;
    text-align: left;
    text-indent: -2em;
}

form {
	width:90%;
	margin:0 auto;
	font-family: Arial;
}

input, textarea {
    width:90%;
    height:1.5em;
    background:rgb(222,223,215);
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border:2px solid rgba(200,200,180,1.0);
    padding:0.8em;
    margin-top:1em;
    font-family: Arial;
    font-size:1em;
    color:rgb(150,150,130);

    /*    -webkit-box-shadow: 3px 3px 5px 6px #ccc; 
    background: -moz-linear-gradient(top, rgb(215,215,200) 0%, rgb(237,240,230) 8%);  
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(210,210,200)), color-stop(10%,rgb(230,230,225)));  webkit */


}

input:focus, textarea:focus {
	border:2px solid rgb(200,200,180);
}

textarea {
	height:8em;
}

#submit {
    border: rgb(150,155,120) solid 2px;
    text-decoration: none;
    color: rgb(150,155,120);
    background-color: rgb(50,60,40);
    background: rgb(50,60,40);
    opacity: 0.7;
    border-radius: 15px;
    -webkit-transition:all 0.1s;
    -moz-transition:all 0.1s;

    width:6em;
    height:3em;
    margin-top:1em;
/*    -webkit-box-shadow: 3px 3px 5px 6px #ccc;
    box-shadow:rgba(75,75,60,0.7) 0px 2px 8px; */

}

#submit:hover {
    opacity: 1.0;
    border: rgb(200,200,165) solid 2px;
    background: rgb(70,80,60);
    color: rgb(200,200,165);
    -webkit-box-shadow: 3px 3px 5px 6px #ccc;
    box-shadow:rgba(70,80,60,0.7) 0px 2px 8px;
    cursor: pointer;
}

#studio-picts {
    border: rgb(50,50,30) solid 2px;
    width: 80%;
    margin-top: 1em;
}