/* Basic */
html, body { height: 100%; }
body { margin: 0px; padding:0px; }
body {
    position: relative;
    color: #000;
    font: 14px Arial,Helvetica,Clean,sans-serif;
    min-width: 1000px;
    min-height: 600px;
}
div,p,td,ul,li,h1,h2,h3{ margin:0px; padding: 0px; }
p { margin: 0; margin-bottom: 10px }

a { color: #1FB2D1; text-decoration: none; outline: none;}
a:hover, a.hover { color: #000000;}
a img { border: none; }
ul { list-style: none; }
table, td { border: none; }


/* Navigation */
#left-menu {
    position: absolute;
    top: 0px; left: 0px;
    z-index: 10;
    height: 100%;
    min-height: 600px;
    width: 28px;
}
#left-menu a, .pages-side-menu a {
    display: block;
}
#left-menu a img {
    position: absolute;
    left: 9px; bottom: 12px;
}
#right-menu {
    position: absolute;
    top: 0px; right: 0px;
    z-index: 10;
    height: 100%;
    min-height: 600px;
    width: 28px;
}
#right-menu a {
    display: block;
}
.pages-side-menu  {
    position: absolute;
    top: 0px; left: 0px;
    height: 100%;
    min-height: 600px;
    width: 28px;
    z-index: 40;
}
.pages-side-menu a { background: transparent; }
.pages-side-menu a img { position: absolute;left: 9px; bottom: 12px; }

.top-menu {
    height: 29%; width: 100%; 
    z-index: 30;
    position: absolute;
    top: 0px; left: 0px;
    padding-bottom: 2px;
}
.middle-menu {
    height: 42%; width: 100%; 
    z-index: 30;
    position: absolute;
    bottom: 29%; left: 0px;
}
.bottom-menu {
    height: 29%; width: 100%; 
    z-index: 30;
    position: absolute;
    bottom: 0px; left: 0px;
}

/* menu strips*/
#menus {
    position: absolute;
    top: 0px; left: 0px;
    z-index: 5;
    height: 100%;
    min-height: 600px;
    width: 100%;    
}
.menu-strip { z-index: 30; }
.menu-strip a {
    font-weight: bold;
    font-size: 14px;
    text-transform: lowercase;
    display: block;
}
#collections-menu, .collections-menu {
    position: absolute;
    top: 0px; left: 0px;
    width: 100%;
    height: 29%;  
    background:#FFF200;    
    padding-bottom: 2px;
}
#about-menu, .about-menu {
    height: 42%; width: 100%; 
    position: absolute;
    bottom: 29%; left: 0px;
    background: #ffffff;
}
#about-menu ul, .about-menu ul {
    margin-left: 28px;
    width: 300px; min-width: 300px;
    text-align: right;    
}
#about-menu ul li, .about-menu ul li {
    height: 18px;
}

#laurels-menu, .laurels-menu {
    position: absolute;
    top: 71%; left: 0px;
    width: 100%;
    height: 29%; 
    background: #e3f2aa;
}
#laurels-menu ul , .laurels-menu ul {
    margin-left: 28px;
    width: 300px; min-width: 300px;
    text-align: right;
}
#laurels-menu ul li, .laurels-menu ul li {
    height: 18px;
}

/* Collection */
.collection-types {
    margin-left: 28px;
    margin-right: 50px;
    width: 300px;
    text-align: right;
    float: left;
}
.collection-types ul li {
    height: 18px;
}
.collection-types a { color: #94989A; }
.collection-types a:hover, .collection-types a.hover { color: #000; }
.collections {
    position: absolute;
    z-index: 30;
    left: 380px;
    width: 600px;
}
.collections ul{ 
    float: left;
    margin-right: 20px;
}
.collections li {
    white-space: nowrap;
}
.collections li a {
    color: #E94947;
}
.collections li a:hover,
.collections li a.hover {
    color: #000;
}
.collection-images {
    position: absolute;
    top: 29%; left: 0px;
    width: 100%;
    height: 42%; 
    overflow: hidden;
    padding-bottom: 2px;
}
.collection-images div.container {
    width: 80%;
    margin-left: 100px;
    position: relative;
}
.collection-images div.container ul {
    margin-left: auto;
    margin-right: auto;
}
.collection-images div.container li {
    float: left;
}
.collection-text {
    position: absolute;
    bottom: 0; left: 0px;
    width: 100%;
    height: 29%; 
}
.collection-text .short-description {
    font-size: 18px;    
    text-align: center;
    margin: 20px;
}
.short-description {font-weight:normal;}
.collection-text .description {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    height: 57%;
    overflow: hidden;
}

/* Page */
.page { 
    position: absolute;
    min-height: 600px;
    left: 0; top: 0;
    z-index: 30;
    overflow: hidden;
}
.page-text { 
    position: relative;
    padding: 0; margin: 0;
    margin-left: 350px;
    margin-right: 50px;
    height: 95%;
}
.page-body { text-align: justify; overflow: hidden; max-height: 90%; padding-right: 40px;}

.scroller-next, .scroller-prev {
    width: 14px; height: 17px;
    position: absolute;
    cursor: pointer;
}
.scroller-next { 
    background: transparent url('/img/down.png');
    bottom: 30%; right: 0;
}
.scroller-prev {
    background: transparent url('/img/up.png');
    top: 30%; right: 0;
}
.scroller-next:hover {
    background: transparent url('/img/down_over.png');
}
.scroller-prev:hover {
    background: transparent url('/img/up_over.png');
}
.scroller-controls .disabled { display: block; }

.collection-text .scroller-next, .collection-text .scroller-prev { right: 14%; }

img.page-loading {
    position: absolute; right: 40px; top: 40px;
    z-index: 1000;
}

/* Helper Classes */
.float-right { float:right; }
.float-left { float:left; }
.clear { clear: both; }

.clearfix:after {
    content: " "; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */

.disabled { display: none; }