body, td, tr, div {
font-family: Helvetica, Arial, sans-serif;
color: #000;
background-color: #fff;
letter-spacing: 1px;
margin: 0;
padding: 0;
line-height: 15px;
}

body {
line-height: 15px;
font-size: 0.75em;
margin: 10px 20px 0px 20px;
}

#container {
width: 960px;
margin-left: auto;
margin-right: auto;
overflow: hidden;
margin-bottom: 130px;
}

#works {
float:left;
}

#info, #nav, #subscribe {
text-align: right;
}

#nav {
margin-top: 2em;
}

#subscribe {
margin-top: 1em;
}

#about {
padding-left: 6px;
}

.subtopic {
display: none;
}

.info span, .sorting span {
float: left;
}

.tech, .date, .dim, .title {
padding: 0.54em 0 0.54em 0;
border-top: solid 1px #000;
 
}

.text {
border-bottom: solid 1px #000;
line-height: 14px;
padding: 8px 0px 8px 0px;
}

.sorter {
border-top: none;
}

.tech {
width: 320px;
}

.dim {
width: 220px;
}

.date {
width: 60px;
}

.title, .text {
width: 360px;
}

#date-sort, #title-sort, #dim-sort, #tech-sort, #work-title, #about-title, #com-title {
font-size:.7em;
font-weight: bold;
margin-bottom: 6px;
text-decoration: underline;
text-transform: uppercase;
}

#work-title, #about-title, #com-title {
font-size: 0.9em;
margin-bottom: 1em;
}

#work-title {
margin-bottom: 3em;
}

a, a:link, a:visited, a:active {
color:#000;
text-decoration: none;
font-weight:normal;
border-bottom: 1px dashed #000CFF;

}

.sorter:hover {
color: #f10;
display: inline;
cursor: pointer;
}

.toggle:hover {
cursor: pointer;
color: red;
}

a:hover, h1:hover, h2:hover, h3:hover {
border-bottom: 1px dashed #f10;
}

img {
border: 0;
padding-right: 6px; 
padding-top: 6px; 
}

h1 {
letter-spacing: -0.03em;
font-weight:normal;
font-size: 2em;
margin: 0;
margin-top: 1em;
color: #f10;
text-align: right;
margin-bottom: 1em;
}
h1:hover {
cursor: pointer;
}
h1.news {
text-align: left;
}


h2, h3, h4 {
font-size: 1em;
font-weight: normal;
}

h2:hover, h1:hover {
color: #f10;
cursor: pointer;
border-bottom: 0;
}

h4, h4:active {
font-size: 12px;
font-weight: bold;
line-height: 11px;
margin-bottom: 0px;
margin-top: 11px;
text-indent: 0px;
}


.toggle {
}

.toggle:hover {
}

.toggle2, .toggle2 .active, div.info:hover .active {
color: #f10;
}

.toggle2 .title {
font-weight: bold;
}

.toggle2:hover {
}

.selected span {
	background-color: #e3e3e3;
}

.active {
color: #660000;
}

.pics {  
    height:  600px;  
    width:   810px;  
    padding: 0;  
    margin:  32px 0px 20px 0px;
    overflow: hidden;
} 
 
.pics img {  
/*
    width:  810px; 
    height: 540px; 
*/
    top:  0; 
    left: 0;
} 

.pics:hover {
cursor: pointer;
}

.jw:hover {
cursor: default;
}

.next {
border-bottom: 1px solid #f10;
float: right;
margin-top: -330px;
}

.cap {
margin-right: 4px;
margin-top: -310px;
float: right;
}

#book-cap {
margin-right: 0px;
}

.next:hover {
cursor: pointer;
}

iframe {
margin: 1em 0 40px 0;
}

.info-button {
margin-top: -20px;
text-align: right;
cursor: pointer;
}

input {
border: 1px solid #ccc;
background: #f8f8f8;
margin-bottom: 4px;
}

input.btn:hover {
cursor:pointer;
background: #e8e8e8;
}