/*
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Author: Adrian Jacob / adrian@firechaser.com
Type: Screen, Projection
Info: Screen and projection stylesheet for Shane Engines
Created: 09/07/2007
Modified: 11/09/2007
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
*/
/* COMMON AND GLOBAL */
html,body { height:100%; }
body { font:62.5%/1.8em Arial,Verdana,Helvetica,sans-serif; margin:0; padding:0; background:#FFF url(../images/bodyBg.gif) top repeat-x; color:#333; text-align:center; }
img { display:block; border:0; }
p { padding:0 0 1.0em 0; margin:0; }
ul { list-style:none; padding:0; margin:0; }
a { color:#598eb5; text-decoration:underline; }
a:hover { color:#CC9966; }
hr { display:none; }
h1 span, h2 span, #header p a span, #homeOptions a span, #flash span, #edrawings span { position:absolute; top:-10000px; }
/* ----- IDS ----- */
#container { font-size:1.2em; min-height:100%; position:relative; width:726px; margin:0 auto; text-align:left; padding:0 10px; }
#containerPad { padding-bottom:222px; }
#header { height:72px; }
#header p { padding:0; }
#header p a { display:block; height:100px; width:117px; background:url(../images/contact.gif) no-repeat; position:absolute; top:0px; right:7px; }
#header div { position:absolute; top:20px; right:10px; }
#homeOptions { padding-bottom:37px; margin-bottom:30px; background:url(../images/hr.gif) bottom repeat-x; float:left; }
#homeOptions li { float:left; margin-left:30px; }
#homeOptions a { display:block; width:222px; height:112px; float:left; }
#homeOptions .how { margin-left:0px; }
#homeOptions .how a { background:url(../images/homeOptions.jpg) 0 0 no-repeat; }
#homeOptions .how a:hover { background-position:0 -112px; }
#homeOptions .eng a { background:url(../images/homeOptions.jpg) -253px 0 no-repeat; }
#homeOptions .eng a:hover { background-position:-253px -112px; }
#homeOptions .dev a { background:url(../images/homeOptions.jpg) -504px 0 no-repeat; }
#homeOptions .dev a:hover { background-position:-504px -112px; }
#strap { padding:37px 0; background:url(../images/hr.gif) bottom repeat-x; }
#home #strap p { width:211px; height:44px; padding:0px; margin:37px 0 0 0; }
#home #strap p a { display:block; width:211px; height:44px; background:url(../images/contactHome.gif); text-decoration:none; }
#home #strap p span { position:relative; top:-10000px; }
#content { padding:30px 0 37px 0; background:url(../images/hr.gif) bottom repeat-x; }
#homeCol1 { float:left; width:476px; padding-left:10px; }
#homeCol2 { float:right; width:212px; }
#col2 { width:595px; float:left; }
#col2 strong { font-size:1.1em; }
#col2 ul { padding-bottom:1.0em; padding-left:10px; }
#col2 li { background:url(../images/li.gif) 0 7px no-repeat; padding-left:10px; }
#flash { padding-top:37px; margin-top:20px; background:url(../images/hr.gif) top repeat-x; }
#flash ul { padding:0; }
#flash li { padding:0; margin-left:25px; float:left; background:none !important; }
#flash a { display:block; height:96px; width:117px; font-weight:bold; }
#flash .flash1 { margin-left:0px; }
#flash .flash1 a { background:url(../images/flash.gif) 0 0 no-repeat; }
#flash .flash1 a:hover { background:url(../images/flash.gif) 0 -96px no-repeat; }
#flash .flash2 a { background:url(../images/flash.gif) -143px 0 no-repeat; }
#flash .flash2 a:hover { background:url(../images/flash.gif) -143px -96px no-repeat; }
#flash .flash3 a { background:url(../images/flash.gif) -286px 0 no-repeat; }
#flash .flash3 a:hover { background:url(../images/flash.gif) -286px -96px no-repeat; }
#flash .flash4 a { background:url(../images/flash.gif) -429px 0 no-repeat; }
#flash .flash4 a:hover { background:url(../images/flash.gif) -429px -96px no-repeat; }
#edrawings { padding:37px 0; margin-top:30px; background:url(../images/hr.gif) top repeat-x; float:left; width:100%; }
#edrawings img { position:relative; left:-30px; }
#edrawings ul { padding:0; }
#edrawings li { padding:0; margin-right:25px; float:left; background:none !important; }
#edrawings a { display:block; height:96px; width:117px; font-weight:bold; }
#edrawings .edraw1 a { background:url(../images/flash.gif) 0 -192px no-repeat; }
#edrawings .edraw1 a:hover { background:url(../images/flash.gif) 0 -288px no-repeat; }
#edrawings .edraw2 a { background:url(../images/flash.gif) -143px -192px no-repeat; }
#edrawings .edraw2 a:hover { background:url(../images/flash.gif) -143px -288px no-repeat; }
#footer { color:#999; font-size:0.8em; padding:30px 10px; }
#footer span { padding:0 5px; color:#CCC; }
#footer a { float:right; }
#footer2 { height:202px; position:relative; margin:-202px 0 0 0; text-align:left; background:url(../images/bodyBtmBg.jpg) left no-repeat; }
#development div { background:url(../images/hr.gif); height:7px; padding:0px; margin:10px 0 22px 0; border:0px; }
/* ----- CLASSES ----- */
.clear { clear:both; }
.float_left { float:left; }
.float_right { float:right; }
.textCenter { text-align:center; }
.textRight { text-align:right; }
.textLeft { text-align:left; }
.image_right { float:right; padding:0 0 10px 20px; }
.image_left { float:left; padding:0 20px 10px 0; }
.relative { position:relative; }
.absolute { position:absolute; }
.printShow { display:none; }
.padding { padding-left:50px; }
.left10 { position:relative; left:-10px; display:inline; }
.hr { background:url(../images/hr.gif); height:7px; padding:0px; margin:10px 0 22px 0; border:0px; }
/* ----- NAVIGATION ----- */
#nav { float:left; width:131px; }
#nav ul { border-top:1px solid #e5e5e5; }
#nav a { display:block; width:131px; font-size:1.1em; color:#666; border-bottom:1px solid #e5e5e5; text-decoration:none; }
#nav span { padding:5px 10px; display:block; }
#nav a:hover, #nav .active { color:#cc9966; }
#nav ul ul { border-top:0px; font-size:0.85em; }
#nav ul ul span { padding:5px 10px 5px 20px; }
#nav #flashcontent { margin-top:30px; }
/* ----- HEADINGS ----- */
h1,h2,h3,h4,h5,h6 { padding:0; margin:0; clear:both; }
h1 { width:348px; height:72px; background:url(../images/TheShaneEngine.gif) no-repeat; }
h1 a { display:block; width:348px; height:72px; }
h2 { height:57px; width:726px; background:url(../images/strap.gif) no-repeat; }
#home h2 { height:83px; width:438px; background:url(../images/strapHome.gif) no-repeat; }
h3 { padding-bottom:0.7em; font-size:1.8em; }
h4 { padding-bottom:0.7em; font-size:1.4em; color:#CC9966; }
h5 { padding-bottom:0.7em; font-size:1.4em; color:#CC9966; }
/* ----- SIFR 3.0 ----- */
/*=:project
scalable Inman Flash Replacement (sIFR) version 3.
=:file
Copyright: 2006 Mark Wubben.
Author: Mark Wubben,
=:history
* IFR: Shaun Inman
* sIFR 1: Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2: Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben
=:license
This software is licensed and provided under the CC-GNU LGPL.
See
*/
.sIFR-flash { visibility:visible !important; margin:0; padding:0; }
.sIFR-replaced { visibility:visible !important; }
.sIFR-alternate { position:absolute; left:0; top:0; width:0; height:0; display:block; overflow:hidden; }
/*
Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it.
Conveniently, the object tab is always in a div, so we hide all divs directly inside the replaced element.
*/
.sIFR-replaced > div { display: none !important; }
/*---- Header styling ---*/
.sIFR-active h3 { visibility:hidden; font-size:28px; height:28px; line-height:28px; position:relative; left:-1px; }
.sIFR-active h4 { visibility:hidden; font-size:22px; height:22px; line-height:22px; }
.sIFR-active h5 { visibility:hidden; font-size:22px; height:22px; line-height:22px; }
/* ----- LIGHTBOX ----- */
#lightbox{
position: absolute;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#lightbox a img{ border: none; }
#outerImageContainer{
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
margin-top:-40px;
}
#imageContainer{
padding: 10px;
}
#loading{
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#hoverNav{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{
width: 49%;
height: 100%;
background: transparent url(../images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
display: block;
}
#prevLink { left: 0; float: left; background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink { right: 0; float: right; background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{
font: 10px Arial, Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%
}
#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width:100%; text-align: left; }
#imageData #caption { font-weight:bold; font-size:11px; }
#imageData #numberDisplay{ display: block; clear: left; }
#imageData #bottomNavClose{ width: 80px; text-align:left !important; float:left;}
#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
}