/* stylesheet for Centre for Cultural Technology & Innovation / CCTI */

body {background: #aaadb4 url(images/background-grid.jpg); color: #fff; font-family: Verdana, Arial, sans-serif; margin: 0;}

a {text-decoration: none;}
a:link,a:visited {color: #ccc960;}
a:hover,a:active {color: #f0ed83;}
a img {border: none;}
.anchor {font-size: 0; height: 0; clear: both;}

div {text-align: left; border: 0px red solid;}
#page {position: relative; width: 770px;}
#head {position: absolute; left: 110px; top: 0; width: 660px;}
#left {position: absolute; left: 110px; top: 110px; width: 110px;}
#body {position: absolute; left: 220px; top: 110px; width: 550px; opacity: .85; filter: alpha(opacity=85);}
#right {position: absolute; left: 770px; top: 0px; width: 110px;}
#right2 {position: absolute; left: 880px; top: 0px; width: 110px;}


/* index page */
#indexright {position: absolute; left: 770px; top: 110px; width: 220px;}
.indexcaption {position: absolute; left: 0; top: 219px; width: 220px; min-height: 54px; color: #000; font-size: 0.9em; background-color: #c1c4cc; border-top: 1px #e3e6ed solid; border-bottom: 1px #e3e6ed solid;}
.indexcaption p {margin: 0; padding: 10px 18px;}
.indexcaption a:link, .indexcaption a:visited {color: #33397a;}
.indexcaption a:hover, .indexcaption a:active {color: #f0ed83;}


/* head */
#nscad {position: absolute; left: 0; top: 55px;}
#title {position: relative; left: 110px; background: url(images/title-block.gif) no-repeat 0px 0px; opacity: .85; filter: alpha(opacity=85);}
#title img {position: absolute; left: 18px; bottom: 17px;}


/* general layout */
.block {position: relative; width: 549px; background-color: #725e58; border-bottom: 1px #937a74 solid; overflow: auto;}
.block p {margin: 1em 18px 1em 18px; line-height: 1.5em;}
.box {position: relative; width: 109px; height: 109px; background-color: #ccc960; border-bottom: 1px #e3e6ed solid; /*overflow: hidden;*/}

.x1 {height: 109px;}
.x2 {height: 219px;}
.x3 {height: 329px;}
.x4 {height: 439px;}
.half {height: 54px;}
.quarter {height: 28px;}
.sponsored {height: 399px;}
.sponsor {height: 40px;}
.foot {min-height: 54px;}


/* left */
.gallerylink {}
.gallerylink img {width: 85px; height: 85px; margin: 11px; border: 1px #d3d5dc solid; opacity: .50; filter: alpha(opacity=50);}
.gallerylink p {position: absolute; left: -110px; width: 91px; height: 91px; margin: 0px; padding: 9px; font-size: 0.9em; color: #fff; text-align: right; line-height: 1.3em; background-color: #9fa2a9; opacity: .80; filter: alpha(opacity=80);}
.gallerylink a:link, .gallerylink a:visited {color: #fff;}
.gallerylink a:hover, .gallerylink a:active {color: #f0ed83;}
.selected img {opacity: .99; filter: alpha(opacity=99);}
.gallerylink.selected a:link, .gallerylink.selected a:visited {color: #333; cursor: default;}
.selected .box {background-color: #fff;}


/* body */
.smaller {font-size: 0.8em;}
.panel {display: none;}

.photobox {display: none; position: absolute; left: 220px; top: 110px; width: 549px; background-color: #725e58; z-index: 10;}
.photobox img {position: relative;}
.photocaption {position: absolute; left: 0; top: 439px; width: 549px; min-height: 70px; color: #000; font-size: 0.9em; background-color: #c1c4cc; border-top: 1px #e3e6ed solid; border-bottom: 1px #e3e6ed solid;}
.photocaption p {margin: 0; padding: 10px 18px;}


/* right */
.instructions {background: none;}
.instructions p {position: absolute; bottom: 0; padding: 6px; margin: 0; font-size: 0.7em; color: #F2F3F4;}