/* ~~~~~~~~~ layout ~~~~~~~~~~ */
#container {	width: 1200px;	height: 633px;	margin: 20px auto;	background: #000;	padding: 10px 0;	overflow: hidden;	border-radius: 3px;	}    
/* ~~~~~~~~~ header ~~~~~~~~~~ */
#main-navigation {/*	border-bottom: 5px solid #666;*/    margin: 4px 0;    }
#main-navigation ul {    overflow: hidden;    width: 100%;    list-style: none;    font-size: 1.2em;    }
#main-navigation li {    float: right;    }
#main-navigation li a {    background: #999;    margin: 0 0 0 20;    padding: 2px 5px;    display: block;    color: #333333;    text-decoration: none;    }
#main-navigation li.current a {    background: #666;    }
#main-navigation li a:hover {    background: #777;    }

/* ~~~~~~~~~ preview ~~~~~~~~~~ */preview {    position:relative;/*    left: 60px;*//*    right: 6px;*/    top:-260px;    float: right;/*    width: 310px;*/    }
img.link {    opacity:0.9;    border: 0px solid transparent;    margin: 1px;    }
img.link:hover {    opacity:1;    border: 1px solid #777;    margin: 0px;    }
img.link:hover{    color: black; /* irrelevant definition to overcome IE bug */    }            /*  Gallery ---------------------------*/
/* these are currently referenced by id tag but should use class instead*/
#divider {    margin: 0px 0px;    }

#thumbnails {    position:relative;    margin: 10px 3px;    }

#thumb {    opacity:0.9;    border: 0px solid transparent;    margin: 1px;    }
#thumb:hover {    opacity:1;    border: 1px solid white;    margin: 0px;    }
#thumb:hover{    color: black; /* irrelevant definition to overcome IE bug */    }
/* 3d Viewport -------------- */

.modelViewer {    position:relative;    top:0px;    margin: 20px auto;    padding: 10px 0;    overflow: hidden;    z-index:0;    width: 840px;    height: 790px;    border-radius: 3px;    /*gradients taken from the example at mozilla.org*/    background: #000; /* fallback color if gradients are not supported */    background: -webkit-linear-gradient(top, #000, hsl(204, 26%, 32%));    background:    -moz-linear-gradient(top, #000, hsl(204, 26%, 32%)); /* For Fx 3.6 to Fx 15 */    background:     -ms-linear-gradient(top, #000, hsl(204, 26%, 32%)); /* For IE 10 Platform Previews and Consumer Preview */    background:      -o-linear-gradient(top, #000, hsl(204, 26%, 32%)); /* For Opera 11.1 to 12.0 */    background:   linear-gradient(to bottom, #000, hsl(204, 26%, 32%)); /* Standard syntax; must be the last statement */    box-shadow: -12px 8px 16px rgba(0, 0, 0, .3);    }
.viewport3d {    position:absolute;    top:0px;/*    margin: 20px auto;*/    overflow: hidden;    z-index:50;    }

.logo {    position: absolute;    top: 268px;    left: 30px;    z-index:10;    }

.creatureLabel {    position:absolute;    bottom:100px;    left:1em;    display:block;    z-index:5;    text-align:left;    padding:0.0em 1.6em 1em 0.6em;    color: #fff;    }
.toolbar3d {    position:absolute;    bottom:  0px;    left: -4em;    display: block;    z-index: 60;    font-size:120%;    width: 130%;    height:5em;    overflow:hidden;    line-height: 5em;    text-align:  left;    text-indent: 6em;
    background: #262E34;
    color:      #BCBDBE;    box-shadow:  inset 0px 6px 9px rgba(0, 0, 0, .4);    text-shadow: 0px 1px 1px #000;    pointer-events: none;
    }
.buttons3d {    position: absolute;    right:    30px;    bottom:   18px;    display:  block;    z-index:  80;    text-align: right;    }
/* ~~~~~~~~~ about ~~~~~~~~~~ */about {    width: 100%;    overflow: hidden;    }
section {    position: relative;    margin: 0 20px auto;    top: 10px;    float: left;    width: 355px;    }

/* ~~~~~~~~~ footer ~~~~~~~~~~ */footer {    position: relative;    width: 1180px;    margin: 6px auto;    font-size: 1.2em;    text-align: right;    }
