@import "reset.css";
@import "/fonts/stylesheet.css";
@import "typography.css";

/* Site */
html, body { height: 100% !important; }
body { min-width:860px;}
#wrap { height: 100%; position: relative; }
#logo { position: absolute; top: 20px; left: 26px; z-index: 100; margin: 0;}
#nav {
    position: absolute; z-index: 10;
    top: 0px; left: 0px;
    background: #fff;
    width: 128px;
    height: 100%;
    font-family: Verdana, Helvetica, sans-serif;
}
#nav a {
    cursor: pointer;
    line-height: 1;
}
#nav .menu {
    position: absolute;
    bottom: 80px;
}
#nav ul {
    margin: 16px 0 0 26px;
    list-style: none;
}
#nav ul li {
    text-transform: uppercase;
    width: 160px;
    margin-top: -4px;
    padding: 1px 0 2px 0;
}
#nav ul li a {
    font-family: 'Futura Bk BT', Verdana, Helvetica, sans-serif;
    font-size: 14.4px;
    letter-spacing: 0.0574ex;
}
#nav ul li a:hover,
#nav ul li a.hover {
    text-decoration: none;
}
#nav li a.about { margin-left: 20px; }
#content {
    position: relative;
    margin-left: 180px;
    min-height: 100%;
}
#content-main {
    padding-top: 66px;
    padding-right: 40px;
    padding-bottom: 40px;
}
#footer { 
    position: absolute;  bottom: 0;
    width: 100%; height: 30px;
    padding-top: 6px;
}
#copyright { 
    color: #6F6C6C; font-size: 85%; 
    font-family: Arial, Helvetica, Clean, sans-serif; text-transform: uppercase; 
    margin: 0 auto; text-align: center;
    padding-right: 20px;
}

.page {
    width: 66%;
    margin: 0 auto;
    text-align: justify;
}
.page h2 { text-align: center; }
.page p { text-indent: 3em; }

ul.collection-list { 
    margin: 0; list-style: none; 
    margin: 0 auto; width: 680px; 
}
.collection-list li {
    position: relative;
    width: 320px; height: 254px;
    float: left;
    margin: 10px 10px 0 10px;
}
.collection-list h2 {
    margin: 0 0 4px 2px;
    text-transform: uppercase;
    font-size: 14.4px;
}
.collection-list li:hover h2,
.collection-list h2.hover {
    color: #ED1344 !important;
}
.collection-list li a {
    display: block;
    border: solid 3px; border-color: #4F4C4C;
    width: 314px; height: 218px;
}
.collection-list li a:hover, .collection-list li a.hover { border-color: #ED1344 !important;  }
.collection-list a img { display: block; }

.images { position: relative; margin-bottom: 20px;}
.image-frame { position: relative; width: 600px; height: 406px; margin: 0px auto; text-align: center; }
.image-frame a { text-align: center; display: block; }
.image-frame a img { border: solid 2px; border-color: #4F4C4C; display: block;}
.image-info { position: relative; margin: 20px auto 0 auto; width: 250px; }
.image-caption, .image-numbers { color: #6F6C6C; font-size: 90%;     text-align: center; overflow: hidden; }
.image-caption { 
    width: 90%; max-width: 400px; 
    margin: 0 auto;
    min-height: 2em;
}
.image-next,
.image-prev {
    position: absolute;
    cursor: pointer;
    display: block;
    width: 22px;
    height: 17px;
    outline: none;
    color: transparent !important;
}
.image-next { top: 0px; right: -30px; background: url(../img/right.png);}
.image-prev { top: 0px; left: -30px; background: url(../img/left.png); }
.image-next:hover { background: url(../img/right_over.png); }
.image-prev:hover { background: url(../img/left_over.png); }

.page .images { margin-bottom: 50px; }
.page .image-frame { width: 260px; height: 180px;}
.page .image-info { width: 180px; }

.contact { font-size: 130%; }
.contact p { text-indent: 0 !important; }