/* ## WATCHERS OF THE SKY ## Updated: May 10, 2010 ## css by www.mimoymima.com - - - Color References - - - */ /* - - - Tags on this site - - - */ html { color: #EFEFEF; background: #000000; } /* set width to 100% unless this is a fixed width site */ body { position: relative; width: 864px; margin: 0 auto; font: 100 1.3em "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", "myriad pro", "myriad web pro", "myriad web", myriad, helvetica, sans-serif; letter-spacing: .05em; } /* Links */ a:link, a:visited { color: #3399CC; text-decoration: underline; } a:hover, a:focus, a:active { color: #33CCCC; text-decoration: none; } /* Content Headings */ #Content h1 { font-size: 1.8em; margin: 1.5em 0 .3em 0; } #Content h2 { font-size: 1.6em; margin: 1.5em 0 .3em 0; } #Content h3 { font-size: 1.4em; margin: 1.5em 0 .3em 0; } #Content h4 { font-size: 1.2em; margin: 1.5em 0 .3em 0; } #Content h5 { font-size: 1.0em; margin: 1.5em 0 .3em 0; } #Content h6 { font-size: 0.8em; margin: 1.5em 0 .3em 0; } #Content h1+h2, #Content h2+h3, #Content h3+h4, #Content h4+h5, #Content h5+h6 { padding-top: 0 !important; } /* Forms */ .Button { border: 2px outset #3CF; cursor: pointer; text-transform: uppercase; padding: .2em .5em; background: #6CF; color: #FFF; font-weight: bold; } .Button:hover, .Button:focus { background: #FC3; border: 2px outset #F90; } label { color: #333; font-weight: normal; display: block; } .InputList li { padding: 5px; float: left; clear: none; } fieldset { margin-bottom: 1.5em; } /* form colors */ .TextInput, textarea, select { font-size: 1.2em; color: #666; background: #F7F5EB; } .TextInput:focus, .TextInput:hover, textarea:focus, textarea:hover, select:focus, select:hover { color: #390; background: #FFC; } /* specific fields */ form .TextInput { width: 180px; } form #ItemName { float: none; } form #ItemHomePhone, form #ItemEmail { clear: left; } form #City { width: 120px; } form #State { width: 40px; } form #Zip { width: 100px; } /* Tables */ .DataTable td, .DataTable th { padding: 1em 10px; } .DataTable thead th { background: #87E6F0 url(/images/bkg_datatable_thead_th.png) no-repeat top left; font-size: 1.4em; text-align: center; } .DataTable tbody th { background: #C2EC7C url(/images/bkg_datatable_tbody_th.png) no-repeat top left; text-align: right; vertical-align: top; color: #333; } .DataTable tbody td { border: 2px solid #FFF; background-color: #EEE; } /* Other */ .Rounded { -moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; } #Content img { margin: 30px 0; } /* Lists */ /*.LinkList li a { padding-left: 12px; margin-left: -12px; } put this in if you want the bullets for link lists to be links - only works if you don't want to mix linklists with regular text */ .NoBullet li { margin-bottom: .5em; } /* Text */ #Content p { line-height: 1.7em; margin: .75em 0; } .Heavy { font-family: "Agency FB", "Abadi MT Condensed Extra Bold", impact, helvetica, sans-serif; } .Condensed { font-family: "Arial Narrow"; } .Serif { font-family: "Hoefler Text", baskerville, cambria, georgia, 'lucida bright', palatino, bookman, 'Bookman Old Style', 'Book Antiqua', serif; } /* jQuery */ .MakeLink { color: #06F !important; text-decoration: none; } .MakeLink:hover, .MakeLink:focus, .MakeLink:active { cursor: pointer; color: #C60; text-decoration: underline; } /* - - - Page Divisions on this site - - - */ /* Header */ #Header { } /* Masthead */ #Masthead { clear: both; background: url(../images/bkg_header.jpg) 0 -86px no-repeat; height: 350px; position: relative; } #MainLogo { height: 107px; width: 527px; position: absolute; top: 73px; left: 70px; } /* Nav with image rollovers */ #Nav { height: 18px; font-family: courier, monospace; font-size: 1.3em; overflow: hidden; } /* don't remove overflow hidden */ #Nav ul { width: 450px; } #Nav a { height: 18px; display: inline-block; color: #CCC; padding: 0px 14px; line-height: 1em; text-transform: uppercase; text-decoration: none; letter-spacing: .08em; } #Nav a span { position: absolute; left: -999em; } #Nav a:hover, #Nav a:focus, #Nav a:active { color: #FFF; } #Nav li.Active a { color: #FFF; } #Nav .Active a:hover, #Nav .Active a:focus { color: #FFF; } /* nav UP state */ #NavSynopsis a { height: 18px; width: 120px; background: url('../images/nav.png') 0 0 no-repeat; } #NavGallery a { width: 119px; background: url('../images/nav.png') -150px 0 no-repeat; } #NavTrailer a { width: 112px; background: url('../images/nav.png') -300px 0 no-repeat; } /* nav DOWN state */ #NavSynopsis a:hover, #NavSynopsis a:focus { background-position: 0 -18px; } #NavGallery a:hover, #NavGallery a:focus { background-position: -150px -18px; } #NavTrailer a:hover, #NavTrailer a:focus { background-position: -300px -18px; } /* nav Active state */ #NavSynopsis.Active a { background-position: 0 -18px; } #NavGallery.Active a { background-position: -150px -18px; } #NavTrailer.Active a { background-position: -300px -18px; } /* Content*/ #Content { margin: 20px auto; width: 750px; padding-bottom: 50px; font-size: 1.3em; } /* Page Nav */ .PageNav { margin-bottom: 2em; float: left; width: 100%; } .PageNav a { font-weight: bold; color: #36F; text-decoration: none; background: #DFF2F6; display: block; float: left; width: auto; margin: 0 1px; padding: .3em 1em !important; -moz-border-radius: 2px; -khtml-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .PageNav a:hover { font-weight: bold; color: #FFF; background: #36F; } .PageNav .PageNavHead { margin-left: .8em; background: none; font-weight: bold; } .PageNav .PageNavHead:hover { color: #FC0; background: none; } /* Footer */ #Footer { font-size: 1.2em; color: #999; clear: both; } #Footer #FooterLinks { clear: both; margin: 1em 0; } #Footer #FooterLinks a { margin-right: 20px; } #Footer a { color: #FF0; text-decoration: none; } #Footer a:hover, #Footer a:active { color: #FC3; text-decoration: underline; } #Footer #Copyright { float: right; } #Footer #Credit { float: right; } /* - - - Classes - - - */ /* Elements you want hidden by placement off screen */ .Hidden { position: absolute; left: -999em; } /* vCards */ #Footer .vcard { display: none; } .street-address { display: block; } /* Credits */ #Credits { text-align: right; font-size: 90%; margin-top: 50px; } /* Tiny mYm Credit */ #CreditsMYM { position: absolute; right: 50px; padding: 20px 0; } #CreditsMYM h2 { color: #09F; position: absolute; left: 0; z-index: 4; font-size: .9em; font-weight: normal; width: 38px; height: 39px; overflow: hidden; } #CreditsMYM h2:hover { color: #F90; } #CreditsMYM h2 a { position: absolute; left: 0; z-index: 5; margin-bottom: -48px; display: block; width: 38px; height: 39px; background: url(/images/logo_mym-credit.png) no-repeat; } #CreditsMYM h2 a:hover { background-position: 0 -39px; cursor: pointer; } /* Social Bookmarking */ #SocialBookmarks { position: absolute; bottom: 100px; right: 50px; } #SocialBookmarks h4 { font-size: 1.1em; font-weight: bold; color: #AF826B; margin-bottom: .5em; } #SocialBookmarks a { overflow: hidden; display: block; width: 18px; height: 18px; float: left; margin-right: 6px; } #SocialBookmarks a#SocialDigg { background: url(/images/icon_social.png) 0 0 no-repeat; } #SocialBookmarks a#SocialDelicious { background: url(/images/icon_social.png) -18px 0 no-repeat; } #SocialBookmarks a#SocialGoogle { background: url(/images/icon_social.png) -36px 0 no-repeat; } #SocialBookmarks a#SocialStumble { background: url(/images/icon_social.png) -54px 0 no-repeat; } #SocialBookmarks a#SocialFacebook { background: url(/images/icon_social.png) -72px 0 no-repeat; } /* Javascript Indicator */ #JSIndicator { position: absolute; top: 9em; right: 0px; } #JSIndicator a:link, #JSIndicator a:visited { font-weight: bold; font-size: .9em; text-transform: uppercase; background-color: #FF0; color: #09C; text-decoration: underline; padding: .5em 1em; } #JSIndicator a:hover, #JSIndicator a:active, #JSIndicator a:focus { text-decoration: none; } /* - - - Specific Pages on this site - - - */ /* Home */ #Home { }