/* ----------- site generic styles ------------ */ body{ background-color: #FFFFFF; text-align: center; font-family: Helvetica, Arial, sans-serif; /*min-height: 800px;*/ } a{ outline: none; } .clear{ clear: both; } #container{ margin: 60px auto 0px auto; width: 980px; color: #000000; } #container #navigation{ text-align: left; font-weight: bold; font-size: 12px; float: left; width: 300px; left:100px; position:absolute; text-align:left; top:60px;} #container #navigation a{ color: #000000; background-color: #FFFFFF; text-decoration: none; } #container #navigation a:hover{ color: #000000; background-color: #FFFFFF; text-decoration: none; } #container #navigation h1{ margin: 0px 0px 30px 0px; font-size: 30px;} #container #navigation h1 img{ border: 0px; } #container #navigation h2{ height: 18px; margin: 0px; font-size: 16px; font-weight: bold;} #container #navigation h2 .selected{ background-color: #FFFFFF; color: #000000; font-weight: bold;} #container #navigation h2 a:hover{ background-color: #000000; color: #FFFFFF; font-weight: bold;} #container #navigation h2 a.selected{ padding: 0px; background-color: #000000; color: #FFFFFF; font-weight: bold;} /* fix cufon issues */ #container #navigation h2 a span{ padding: 0px; margin: 0px; } #container #navigation h2 a:hover span{ margin-top: 0px; } #container #navigation h3{ height: 18px; margin: 0px 0px 0px 10px; font-size: 16px;} #container #navigation h3 a:hover{ background-color: #000000; color: #FFFFFF; } #container #navigation h3 a.selected{ padding: 0px; background-color: #000000; color: #FFFFFF;} /* fix cufon issues */ #container #navigation h3 a span{ padding: 0px; margin: 0px; } #container #navigation h3 a:hover span{ margin-top: 0px; } #container #navigation h4{ height: 18px; margin: 0px 0px 0px 20px; font-size: 16px;} #container #navigation h4 a:hover{ background-color: #000000; color: #FFFFFF;} #container #navigation h4 a.selected{ padding: 0px; background-color: #000000; color: #FFFFFF;} /* fix cufon issues */ #container #navigation h4 a span{ padding: 0px; margin: 0px; } #container #navigation h4 a:hover span{ margin-top: 0px; } #container #navigation h5{ height: 18px; margin: 0px 0px 0px 30px; font-size: 16px;} #container #navigation h5 a:hover{ background-color: #000000; color: #FFFFFF;} #container #navigation h5 a.selected{ padding: 0px; background-color: #000000; color: #FFFFFF;} /* fix cufon issues */ #container #navigation h5 a span{ padding: 0px; margin: 0px; } #container #navigation h5 a:hover span{ margin-top: 0px; } #container #navigation h6{ height: 18px; margin: 0px 0px 0px 40px; font-size: 16px;} #container #navigation h6 a:hover{ background-color: #000000; color: #FFFFFF;} #container #navigation h6 a.selected{ padding: 0px; background-color: #000000; color: #FFFFFF;} /* fix cufon issues */ #container #navigation h6 a span{ padding: 0px; margin: 0px; } #container #navigation h6 a:hover span{ margin-top: 0px; } #container #navigation h6.extra-margin{ margin-left: 50px;} #container #content{ margin: 0px 0px 0px 80px; float: left; width: 700px; text-align: left; } #container #content .player{ margin: 0px; padding: 0px; } #container #content .separator{ height: 4px; background-color: #000000; color: #000000; } #container #content .col1{ width: 350px; float: left; } #container #content .col2{ width: 350px; float: left; } .page{ width: 660px; padding: 0px 0px; margin-left: 280px; text-align: left; } /* ------------------------------ home ----------------------------------- */ body.home{ text-align: center;} .home #player-container{ width: 886px; margin: 0px auto; text-align: right; height: 10px;} .home #player{ position: relative; top: 0px; right: -26px;} .home #container{ width: 486px; height: 534px; margin: 10px auto; padding: 20px 0px 5px 0px; position: relative;} .home #container .first-image{ z-index: 1; position: absolute; display: block; float: left; left: 300px; top: 20px; opacity: 0; } .home #container .second-image{z-index: 2; position: absolute; display: block; float: left; left: 300px; top: 20px; opacity: 0; } .home #navigation{ text-align: left; font-weight: bold; font-size: 12px; float: left; width: 300px; left:100px; position:absolute; text-align:left; top:60px;} .home #navigation a:link{ color: #000000; text-decoration: none; } .home #navigation a:hover{ color: #000000; text-decoration: none; } .home #navigation h1{ margin: 0px 0px 30px 0px; font-size: 30px;} .home #navigation h2{ margin: 0px; padding: 0; font-size: 16px;} .home #navigation h2 a:link{ height: 18px; margin: 0px; padding: 0px; font-size: 16px; color: #000000; text-decoration: none; } .home #navigation h2 a:visited{ margin: 0px; padding: 0; font-size: 16px;color: #000000; text-decoration: none; } .home #navigation h2 a:active{ padding-left: 20px; margin: 0px; padding: 0; font-size: 16px;color: #000000; text-decoration: none; } .home #navigation h2 a:hover{ margin: 0px; padding: 0px; font-size: 16px; background-color: #000000; color: #FFFFFF; } .home #navigation h2 a.selected{ color: #FFFFFF; background-color: #000000; } /* fix cufon issues */ .home #navigation h2 a span{ padding: 0px; margin: 0px; } .home #navigation h2 a:hover span{ margin-top: 0px; } .home #navigation h3{ height: 18px; margin: 0px 0px 0px 10px; padding: 0px; font-size: 16px;} .home #navigation h3 a:link{ background-color: #FFFFFF; color: #000000; text-decoration: none; } .home #navigation h3 a:visited{ background-color: #FFFFFF; color: #000000; text-decoration: none; } .home #navigation h3 a:active{ background-color: #FFFFFF; color: #000000; color: #000000; text-decoration: none; } .home #navigation h3 a:hover{ padding: 0px 0px 0px 20px; margin: 0px; background-color: #000000; color: #FFFFFF; } .home #navigation h3 a.selected{ background-color: #000000; color: #FFFFFF;} #container #over-flash-layer #navigation{ text-align: left; font-weight: bold; font-size: 12px; float: left; width: 180px; position: relative; left: 0; top: 0;} #container #over-flash-layer #navigation a{ color: #FFFFFF; background-color: #000000; text-decoration: none; } #container #over-flash-layer #navigation a:hover{ color: #FFFFFF; background-color: #000000; text-decoration: none; } #container #over-flash-layer #navigation h1{ margin: 0px 0px 30px 0px; font-size: 30px;} #container #over-flash-layer #navigation h2{ margin: 0px; font-size: 12px;} #container #over-flash-layer #navigation h2 .selected{ background-color: #000000; color: #FFFFFF;} #container #over-flash-layer #navigation h2 a.selected{ background-color: #000000; color: #FFFFFF;} #container #over-flash-layer #navigation li{ list-style: none;margin-left: -40px;padding-left: 1em;text-indent: -1em;} #container #over-flash-layer #navigation li.selected{ background-color: #FFFFFF; color: #000000;} #container #over-flash-layer #navigation li a.selected{ background-color: #FFFFFF; color: #000000;} #music-player{ position:absolute; left: 50px; top: 250px; } #music-player p{ color: #FFFFFF; padding-left: 50px; padding-top: 80px; width: 160px; } #music-player p a{ color: #FFFFFF; text-decoration: underline; } /* ------------------------------ collections ----------------------------------- */ body.collections { height: 100%; margin: 0; padding: 0; background-color: #ffffff;} .collections #navigation{ text-align: left; font-weight: bold; font-size: 12px; float: left; width: 300px; left:100px; position:absolute; text-align:left; top:60px;} .collections #navigation a{ color: #000000; text-decoration: none; } .collections #navigation a:hover{ color: #000000; text-decoration: none; } .collections #navigation h1{ margin: 0px 0px 30px 0px; font-size: 30px;} .collections #navigation h2{ height: 18px; margin: 0px; padding: 0; font-size: 16px;} .collections #navigation h2 a{ padding-left: 20px; margin: 0px; padding: 0; font-size: 16px;} .collections #navigation h2 a:hover{ margin: 0px; padding: 0px; font-size: 16px; background-color: #000000; color: #FFFFFF; } .collections #navigation h2 a.selected{ color: #FFFFFF; background-color: #000000; } .collections #navigation h2 a span{ padding: 0px; margin: 0px; } .collections #navigation h2 a:hover span{ margin-top: 0px; } .collections #navigation h3{ height: 18px; margin: 0px 0px 0px 10px; padding: 0px; font-size: 16px;} .collections #navigation h3 a{ background-color: #FFFFFF; color: #000000;} .collections #navigation h3 a.selected{ background-color: #000000; color: #FFFFFF;} .collections #navigation h3 a:hover{ padding: 0px; margin: 0px; background-color: #000000; color: #FFFFFF; } .collections #navigation h3 a span{ padding: 0px; margin: 0px; } .collections #navigation h3 a:hover span{ margin-top: 0px; } .collections #navigation h4{ height: 18px; margin: 0px 0px 0px 20px; font-size: 16px;} .collections #navigation h4 .selected{ background-color: #000000; color: #FFFFFF;} .collections #navigation h4 a.selected{ background-color: #000000; color: #FFFFFF;} .collections #navigation h4 a:hover{ margin: 0px; background-color: #000000; color: #FFFFFF; } .collections #navigation h4 a span{ padding: 0px; margin: 0px; } .collections #navigation h4 a:hover span{ margin-top: 0px; } /* ----------- slideshow --------- */ #container #content .slideshow{ width: 350px;} #container #content #nav{ background-color: #FFFFFF; color: #000000; width: 350px; margin-top: -6px;} #container #content #nav a.prev{ width: 175px; float: left; text-align: left; background-color: #000000; color: #FFFFFF; } #container #content #nav a.next{ width: 175px; float: right; text-align: right; background-color: #000000; color: #FFFFFF; } #container #content .slideshow-caption{ float: left; left: 360px; top: 0; width: 100px;} #container p{ font-size: 13px; line-height: 1.5;} .contact .page h2{ font-size: 26px; margin-bottom: 35px; text-transform: uppercase; } .contact .page h3{ font-size: 22px; margin: 10px 0 20px 0; padding: 0; } .contact .page h3 a{ color: #000000; } .contact .page h4{ font-size: 14px; margin: 0 0 5px 0; padding: 0; } .contact .page h4 a{ color: #000000; } .contact .page .col1{ width: 330px; float: left; } .contact .page .col2{ width: 330px; float: left; } /* ------------------------------ archive ----------------------------------- */ body.archive-body{ background-color: #000000; height: 100%; width: 100%; } .archive-body #container #navigation{ z-index: 5000; } .archive-body #container #navigation h1 a{ background-color: transparent; } .archive-body #container #navigation h1 a:hover{ background-color: transparent; } .archive-body #container #navigation h2 a{ margin: 0px; font-size: 16px; background-color: transparent; color: #FFFFFF; } .archive-body #container #navigation h2 a.selected{ background-color: #FFFFFF; color: #000000;} .archive-body #container #navigation h2 a:hover{ background-color: #FFFFFF; color: #000000; } .archive-body h6{ font-size: 60px; } .archive-body h6 a{ color: #CC0000; } .archive .col175{ width: 175px; float: left; margin: 0px; padding: 0px; } .archive .col175 a{ display: block; width: 175px; height: 131px; } .archive .col175 .space{ display: block; width: 175px; height: 131px; } .archive .col175 a img{ border: 0; margin: 0px; padding: 0px; width: 175px; height: 131px; } .archive a{border: 0px; outline: none; } .archive a:hover{ border: 0px; outline: none; } .archive a:active{border: 0px; outline: none; } .archive a img{border: 0px; outline: none; } /* ------------------------------ other-lines ----------------------------------- */ #scroller { width: 660px; margin: 0 auto; position: relative; } #scroller .scroll { height: 495px; width: 660px; overflow: auto; overflow-x: hidden; position: relative; clear: left; background: #FFFFFF url(images/content_pane-gradient.gif) repeat-x scroll left bottom; } #scroller .scrollContainer div.panel { padding: 0px; height: 495px; width: 660px; } #scroller div.navigation { list-style: none; margin: 0; padding: 0; padding-bottom: 9px; text-align: left; } #scroller div.navigation a { padding: 0px; margin: 0px; text-decoration: none; } #scroller div.navigation a:hover { background-color: #ffffff; } #scroller div.navigation a.selected { background-color: #ffffff; } #scroller div.navigation a img{ border: 0px none #ffffff; opacity: 1; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); } #scroller div.navigation a.selected img:hover{ border: 0px none #ffffff; opacity: 0.3; filter: alpha(opacity=30); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);} #scroller div.navigation a.selected img{ border: 0px none #ffffff; opacity: 0.3; filter: alpha(opacity=30); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);} #scroller div.navigation a:focus { outline: none; } #scroller .scrollButtons { position: absolute; top: 150px; cursor: pointer; } #scroller .left-right-navigation{ height: 20px; clear: both; margin-bottom: 5px; } #scroller .left { font-weight: bold; background-color:#000000; color:#FFFFFF; display:block; float:left; padding: 2px 0px 4px 0px; line-height: 1; text-align:left; text-decoration:none; width:320px; height: 14px; padding-left: 10px; } #scroller .left:hover { background-color:#111111; color:#FFFFFF; } #scroller .right { font-weight: bold; background-color:#000000; color:#FFFFFF; display:block; float:right; line-height: 1; padding: 2px 0px 4px 0px; text-align:right; text-decoration:none; width:320px; height: 14px; padding-right: 10px;} #scroller .right:hover { background-color:#111111; color:#FFFFFF; } #scroller .hide { display: none; } .campaign #scroller { width: 660px; margin: 0 auto; position: relative; } .campaign #scroller .scroll { height: 394px; width: 660px; overflow: auto; overflow-x: hidden; position: relative; clear: left; background: #FFFFFF url(images/content_pane-gradient.gif) repeat-x scroll left bottom; } .campaign #scroller .scrollContainer div.panel { padding: 0px; height: 394px; width: 660px; } .campaign #scroller div.navigation { list-style: none; margin: 0; padding: 0; padding-bottom: 9px; text-align: left; } .campaign #scroller div.navigation a { padding: 0px; margin: 0px; text-decoration: none; } .campaign #scroller div.navigation a:hover { background-color: #ffffff; } .campaign #scroller div.navigation a.selected { background-color: #ffffff; } .campaign #scroller div.navigation a img{ border: 0px none #ffffff; opacity: 1; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); } .campaign #scroller div.navigation a.selected img:hover{ border: 0px none #ffffff; opacity: 0.3; filter: alpha(opacity=30); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);} .campaign #scroller div.navigation a.selected img{ border: 0px none #ffffff; opacity: 0.3; filter: alpha(opacity=30); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);} .campaign #scroller div.navigation a:focus { outline: none; } .campaign #scroller .scrollButtons { position: absolute; top: 150px; cursor: pointer; } .campaign #scroller .left-right-navigation{ height: 20px; clear: both; margin-bottom: 5px; } .campaign #scroller .left { font-weight: bold; background-color:#000000; color:#FFFFFF; display:block; float:left; padding: 2px 0px 4px 0px; line-height: 1; text-align:left; text-decoration:none; width:320px; height: 14px; padding-left: 10px; } .campaign #scroller .left:hover { background-color:#111111; color:#FFFFFF; } .campaign #scroller .right { font-weight: bold; background-color:#000000; color:#FFFFFF; display:block; float:right; line-height: 1; padding: 2px 0px 4px 0px; text-align:right; text-decoration:none; width:320px; height: 14px; padding-right: 10px;} .campaign #scroller .right:hover { background-color:#111111; color:#FFFFFF; } .campaign #scroller .hide { display: none; } .still-credits{ position: absolute; left: 100px; margin-top: 20px; } .still-credits h3{ text-align: left; } /* ----------------- dr-martens ----------- */ .dr-martens a{ outline: none; } /*.dr-martens #slider .navigation .selected img{ opacity: 0.4; }*/ /* ----------------- raf-by-raf ----------- */ .raf-by-raf #slider .navigation{ margin-top: 4px; } /* ----------- peter-de-potter ----------- */ .peter-de-potter .drag1{ position: relative; right: -1000px; top: -1000px; } .peter-de-potter .drag2{ position: relative; right: -1000px; top: -1000px; } .peter-de-potter .drag3{ position: relative; right: -1000px; top: -1000px; } .peter-de-potter .drag4{ position: relative; right: -1000px; top: -1000px; } .peter-de-potter .drag5{ position: relative; right: -1000px; top: -1000px; } /* ------------------------------ curriculum ----------------------------------- */ .curriculum .page h2{ font-size: 30px; } .curriculum .page h3{ font-size: 22px; margin-bottom: 20px; } .curriculum .page h4{ font-size: 14px; } .curriculum .page p{ margin-bottom: 10px; } /* ------------------------------ shops ----------------------------------- */ .shops .page{ width: 780px; } .shops .page h3{ font-size: 22px; margin-bottom: 10px; } .shops .page .col1{ width: 500px; float: left; padding: 0px 0px 0px 0px; margin-right: 20px; } .shops .page .col1 p a{ color: #000000; } .shops .page .col2{ width: 200px; float: left; padding: 0 0 20px 0; margin: 0px 0px 40px 0px; } .shops .page .col2 p{ padding: 0 0 20px 0; margin: 0; } .shops .page .col2 p a{ color: #000000; } .shops .page .shop-gallery-1{height: 333px; width: 500px; overflow: hidden; } .shops .page .shop-gallery-2{height: 400px; width: 500px; overflow: hidden; } .shops .page .shop-gallery-1-nav{ } .shops .page .shop-gallery-1-nav a{ text-decoration: none; } .shops .page .shop-gallery-1-nav .prev-btn{ background-color: #000000; color: #FFFFFF; width: 240px; display: block; float: left; padding-left: 10px; } .shops .page .shop-gallery-1-nav .next-btn{ background-color: #000000; color: #FFFFFF; width: 240px; display: block; text-align: right; float: right; padding-right: 10px; } .shops .page .shop-gallery-2-nav{} .shops .page .shop-gallery-2-nav a{ text-decoration: none; } .shops .page .shop-gallery-2-nav .prev-btn{ background-color: #000000; color: #FFFFFF; width: 240px; display: block; float: left; padding-left: 10px; } .shops .page .shop-gallery-2-nav .next-btn{ background-color: #000000; color: #FFFFFF; width: 240px; display: block; text-align: right; float: right; padding-right: 10px; } /* ------------------------------ other-lines ----------------------------------- */ .other-lines-gallery{} .other-lines-gallery-navigation .prev-btn{background-color:#000000;color:#FFFFFF;display:block;float:right; padding-bottom:3px;padding-right:10px;text-align:left;text-decoration:none;width:320px;} .other-lines-gallery-navigation .prev-btn:hover{background-color:#121212;color:#FFFFFF;} .other-lines-gallery-navigation .next-btn{background-color:#000000;color:#FFFFFF;display:block;float:right; padding-bottom:3px;padding-right:10px;text-align:right;text-decoration:none;width:320px;} .other-lines-gallery-navigation .next-btn:hover{background-color:#121212;color:#FFFFFF;} /* ------------------------------ diary ----------------------------------- */ .diary .box1{ position: relative; left: -1000px; } .diary .box2{ position: relative; left: -1000px; } .diary .box3{ position: relative; left: -1000px; } .diary .film-entry{ width: 600px; height: 338px; background-color: #FFFFFF; padding: 0px; margin: 0px; border: 1px solid #000000; } .diary .text-entry{ width: 580px; background-color: #FFFFFF; padding-bottom: 0px; margin-bottom: 10px; border: 1px solid #000000; padding: 0px 20px; } .diary .text-entry h2{ padding: 0px; margin: 0px 0px 20px 0px; } .diary .text-entry p{ margin: 0px 0px 20px 0px; } .diary .image-entry{ width: 600px; background-color: #FFFFFF; padding-bottom: 0px; margin-bottom: 10px; border: 1px solid #000000; } .diary .image-entry a{ color: #000000; } .gallery1{ min-height: 400px;} .diary a.myPlayer { display:block; width: 600px; height: 370px; text-align:center; margin: 0px; border: 1px solid #cdcdcd; outline: none; margin-top: -27px; } .diary a.myPlayer img { margin-top:160px; border:0px; } .diary a.myPlayer:hover { border:1px solid #000; outline: none; } .diary #diary-pagination{ position: absolute; left: 100px; top: 650px; color: #000000; border-bottom: 1px solid #000000; width: 980px; text-align: center; } .diary #diary-pagination a{ color: #000000; text-decoration: none; font-weight: bold; font-size: 16px; } .diary #diary-pagination a:hover{ background-color: #000000; color: #FFFFFF; } .diary #diary-pagination .first{ float: left; } .diary #diary-pagination .last{ float: right; } .diary #diary-pagination #page-links{ width: 400px; margin: 0 auto; } .diary #diary-pagination .page-link{ padding: 0px 5px; } .diary #diary-pagination .page-link:hover{ color: #FFFFFF; background-color: #000000; } .diary .tab{ cursor:move; font-size: 18px; font-weight: bold; width: 150px; height: 20px; display: block; position: relative; top: -27px; padding: 3px; left: 443px; border-left: 1px solid #000000; border-top: 1px solid #000000; border-right: 1px solid #000000; text-align: right; background-color: #FFFFFF; } .diary .tab a{ cursor:move; color: #000000; text-decoration: none; } .diary .galery-nav{ height: 20px; } .diary .galery-nav .gallery-prev1{ width: 290px; padding-bottom: 3px; display: block; float: left; text-align: left; text-decoration: none; padding-left: 10px; background-color: #000000; color: #FFFFFF; outline: none; } .diary .galery-nav .gallery-next1{ width: 290px; padding-bottom: 3px; display: block; float: right; text-align: right; text-decoration: none; padding-right: 10px; background-color: #000000; color: #FFFFFF; outline: none; } /* ------------------------------ campaign ----------------------------------- */ .campaign #player{ margin-left: 300px; } .campaign .slideshow{ z-index: -10; } .campaign .credits{ position: relative; left: 100px; margin-top: 20px; } .campaign .credits h3{ text-align: left; }