/* --------------------------------------------------------------
Grid.css
* Creates an easy to use grid of 14 columns.
Based on work by:
* Nathan Borror [playgroundblues.com]
* Jeff Croft [jeffcroft.com]
* Christian Metts [mintchaos.com]
* Khoi Vinh [subtraction.com]
By default, the grid is 960px wide, with columns
spanning 50px, and a 20px margin between columns.
If you need fewer or more columns, use this
formula to find the new total width:
Total width = (columns * 70) - 20
-------------------------------------------------------------- */
/* A conainer should group all your columns. */
.container {
text-align: left;
position: relative;
padding: 0;
margin: 0 auto; /* Centers layout */
width: 960px; /* Total width */
}
/* Clear fix */
.container:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/* Use this to create a horizontal ruler across a column.
BUG: Margins butchered in IE */
hr {
background: lightblue;
color: lightblue; /* IE Fix */
clear: both;
float: left;
width: 100%;
height: 2px;
margin: 8px 0 8px 0;
padding: 0;
border: none;
}
/* Columns
-------------------------------------------------------------- */
/* Use this class together with the .span-x classes
to create any compsition of columns in a layout.
Nesting columns works like a charm (remember .first and .last). */
.column {
float: left;
margin: 0 10px;
padding: 0;
}
/* Add this class to a column if you want a border on its
right hand side. This should be customized to fit your needs. */
.border {
padding-right: 9px;
margin-right: 0;
border-right: 1px solid #eee;
}
/* The first and last elements in a multi-column
block needs one of these classes each. */
.first { margin-left: 0; }
.last { margin-right: 0; }
/* Use these classes to set how wide a column should be. */
.span-1 { width: 50px; }
.span-2 { width: 120px; }
.span-3 { width: 190px; }
.span-4 { width: 260px; }
.span-5 { width: 330px; }
.span-6 { width: 400px; }
.span-7 { width: 470px; }
.span-8 { width: 540px; }
.span-9 { width: 610px; }
.span-10 { width: 680px; }
.span-11 { width: 750px; }
.span-12 { width: 820px; }
.span-13 { width: 890px; }
.span-14 { width: 960px; margin: 0; }
/* Add these to a column to append empty cols. */
.append-1 { padding-right: 70px; }
.append-2 { padding-right: 140px; }
.append-3 { padding-right: 210px; }
.append-4 { padding-right: 280px; }
.append-5 { padding-right: 350px; }
.append-6 { padding-right: 420px; }
.append-7 { padding-right: 490px; }
.append-8 { padding-right: 560px; }
.append-9 { padding-right: 630px; }
.append-10 { padding-right: 700px; }
.append-11 { padding-right: 770px; }
.append-12 { padding-right: 840px; }
.append-13 { padding-right: 910px; }
/* Add these to a column to prepend empty cols. */
.prepend-1 { padding-left: 70px; }
.prepend-2 { padding-left: 140px; }
.prepend-3 { padding-left: 210px; }
.prepend-4 { padding-left: 280px; }
.prepend-5 { padding-left: 350px; }
.prepend-6 { padding-left: 420px; }
.prepend-7 { padding-left: 490px; }
.prepend-8 { padding-left: 560px; }
.prepend-9 { padding-left: 630px; }
.prepend-10 { padding-left: 700px; }
.prepend-11 { padding-left: 770px; }
.prepend-12 { padding-left: 840px; }
.prepend-13 { padding-left: 910px; }
/* Use a .box to create a padded box inside a column.
Sticking to 18px wide gaps since that's the baseline. */
.box {
padding: 18px;
margin-bottom: 18px;
background: #f0f0f0;
}
/* Nudge your elements [subtraction.com/archives/2007/0606_nudge_your_e.php]:
All block elements (not hr) inside a col should have a 5px padding on each side.
(Not everyone wants this, but feel free to uncomment if you do.)
p,ul,ol,dl,h1,h2,h3,h4,h5,h6,
caption,pre,blockquote,input,textarea {
padding-left: 5px;
padding-right: 5px;
}
div, table {
margin-left: 5px;
margin-right: 5px;
padding: 0;
} */
/* Images
-------------------------------------------------------------- */
/* Remember the baseline (typography.css). */
img { margin: 0 0 18px 0; }
/* Use these classes to make an image flow into the column before
or after it. This techique can also be used on other objects. */
.pull-1 { margin-left: -70px; }
.pull-2 { margin-left: -140px; }
.pull-3 { margin-left: -210px; }
.push-1 { margin: 0 -88px 0 18px; float: right; }
.push-2 { margin: 0 -158px 0 18px; float: right; }
.push-3 { margin: 0 -228px 0 18px; float: right; }
/* --------------------------------------------------------------
Reset.css
* Resets default browser CSS styles.
Created by Erik Meyer:
* meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* Remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* Tables still need 'cellspacing="0"' in the markup. */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
/* --------------------------------------------------------------
Typography.css
* Sets some default typography.
Based on work by:
* Nathan Borror [playgroundblues.com]
* Jeff Croft [jeffcroft.com]
* Christian Metts [mintchaos.com]
* Wilson Miner [wilsonminer.com]
* Typogrify [code.google.com/p/typogrify]
The default font size is 12px. The baseline is set to
18px. When you're setting heights of elements, always
remember to use a multiple of the baseline (18,36,54..).
The height of images shoud also be a multiple of 18.
Read more about using a baseline here:
* alistapart.com/articles/settingtypeontheweb
-------------------------------------------------------------- */
body,ul,ol,dl,h1,h2,h3,h4,h5,h6,td,th,
caption,pre,p,blockquote,input,textarea {
font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
font-size: 12px;
line-height: 18px; /* Baseline here at 150%. This is set multiple places. */
color: #333;
}
/* Headings
-------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 {
font-family: Helvetica, Arial, "Lucida Grande", Verdana, sans-serif;
margin: 0;
padding: 9px 0;
color:#111;
clear:both;
}
/* Total height for each heading has to be a multiple of the baseline (18). */
h1 { font-size: 36px; line-height: 36px; padding: 18px 0; }
h2 { font-size: 28px; line-height: 36px; }
h3 { font-size: 18px; }
h4 { font-size: 14px; }
h5 { font-size: 12px; font-weight:bold; }
h6 { font-size: 10px; font-weight:bold; }
/* Text elements
-------------------------------------------------------------- */
p { margin: 0 0 18px 0; text-align:justify; }
p.last { margin-bottom:0; }
p img { float: left; margin: 18px 18px 18px 0; padding:0; }
p img.top { margin-top:0; } /* Use this if the image is at the top of the <p>. */
ul, ol { margin: 18px 0 18px 18px; list-style-type:disc; }
li { line-height:18px; }
ol { list-style-type: decimal; }
dl { margin: 18px 0; }
dl dt { font-weight: bold; }
a { color: #125AA7; text-decoration: none; outline: none; }
a:hover { color: #000; }
blockquote { margin: 18px 0 18px 23px; font-size: 0.9em; color: #666; font-style: italic; }
strong { font-weight: bold; }
em { font-style: italic; }
pre { margin-bottom: 18px; line-height:18px; background: #eee; padding:8px; border:1px solid #ddd; }
code { font:0.9em Monaco, monospace; }
/* Tables
-------------------------------------------------------------- */
table { margin-bottom: 13px; border-top:1px solid #ddd; border-left:1px solid #ddd; }
th,td { height:17px; padding:0 8px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; }
th { font-weight:bold; }
/* Some default classes
-------------------------------------------------------------- */
.small, .small p { font-size: 10px; }
.large, .large p { font-size: 14px; }
.quiet, .quiet p { color: #666; }
.hide { display: none; }
/* TODO: Implement image captions. */
.caption { }
/* Extra fancy typography
-------------------------------------------------------------- */
/* For great looking ampersands, use this code instead of &:
<span class="amp">&</span> */
.amp {
color: #666;
font-family: "Warnock Pro", "Goudy Old Style","Palatino","Book Antiqua", serif;
font-size: 1.1em;
line-height:10%; /* Fix to maintain correct baseline */
font-style: italic;
}
/* For great looking quote marks in titles, replace "asdf" width:
<span class="dquo">“</span>asdf”
(That is, when the title starts with a quote mark). */
.dquo { margin-left: -.7em; }
/* (You may have to change this value depending on your font size). */
html, body, ul {
padding: 0;
margin: 0;
}
DIV#header {
height: 99px;
width: 684px;
background: #FFF;
}
DIV#searchBar {
height: 33px;
width: 684px;
background: #ffcc00 url(/uploads/searchbar.png) repeat-x;
padding-top: 12px;
padding-left: 21px;
overflow: hidden;
position: relative;
padding-right: 0;
}
IMG#logo {
float: left;
margin-left: 20px;
margin-top: 18px;
}
DIV#navigation {
width: 684px;
height: 168px;
background: #000;
padding-left: 21px;
float: left;
position: relative;
text-decoration: none;
text-transform: lowercase;
font-weight: normal;
clear: all;
margin-bottom: 18px;
}
DIV#navigation ul {
background: #000;
/*padding-top: 18px;*/
z-index: 1;
position: absolute;
height: 168px;
}
DIV#navigation ul li {
color: #b0a2a2;
background: #000;
list-style: none;
width: 112px;
clear: left;
float: left;
/*margin-right: 5px;*/
}
DIV#navigation ul li a {
display: block;
margin-right: 5px;
margin-left: 5px;
border-top: 1px solid #1a1a1a;
}
DIV#navigation ul ul {
display: none;
width: 112px;
height: 186;
position: absolute;
z-index: 2;
top: 0px;
cursor: pointer;
padding-right: 5px;
padding-left: 5px;
}
DIV#navigation ul ul li a {
border-top: 1px solid black;
}
div#navigation ul li.active ul {
z-index: 1;
width: 112px;
}
DIV#navigation ul li.active ul li a,
DIV#navigation ul li:hover ul li a {
color: #b0a2a2;
display: block;
}
div#navigation ul ul li {
white-space: nowrap;
width: 112px;
float: none;
}
div#navigation ul li.active ul, div#navigation ul li:hover ul {
display: block!important;
}
DIV#navigation ul a,
DIV#navigation ul,
DIV#navigation ul li ul a,
DIV#navigation ul li:hover ul li a {
color: #b0a2a2;
}
DIV#navigation ul li ul
DIV#navigation ul li ul a,
DIV#navigation ul li ul li,
DIV#navigation ul li ul li.active
{
background: #1c1c1c;
}
DIV#navigation ul a:hover,
DIV#navigation ul li.active a,
DIV#navigation ul li.active ul li.active a,
DIV#navigation ul li.active ul li.active a:hover,
DIV#navigation ul li:hover a,
DIV#navigation ul li:hover ul li a:hover {
color: #ffcc00;
}
DIV#navigation ul li ul {
background: #1c1c1c;
left: 112px;
position: absolute;
}
a, a:hover {
color: #e2b500;
}
a:hover {
text-decoration: underline;
}
label {
font-weight: bold;
}
DIV#content {
position: relative;
float: left;
width: 694px;
padding-top: 18px;
padding-left: 25px;
}
DIV.contentTitle {
position: relative;
border-bottom: 1px solid #e3e3e3;
clear: both;
text-transform: lowercase!important;
margin-bottom: 18px;
height: 35px;
}
DIV.contentTitle h2 {
position: absolute;
bottom: -18px;
width: 220px;
font-size: 18px;
margin-bottom: 0;
color: #111;
}
DIV.contentTitle h3 {
color: #9f9f9f;
position: absolute;
bottom: -8px;
margin-left: 230px;
font-size: 18px;
margin-bottom: 0px;
}
DIV.rightSidebar {
margin: 0;
padding: 0;
margin-left: 705px;
margin-top: -162px;
height: 330px;
}
DIV.rightSidebar img.fill {
width: 100%;
height: 330px;
overflow: hidden;
z-index: 3;
}
DIV.middleCol {
float: left;
margin-left: 231px;
width: 400px;
}
DIV.middleCol ul {
margin-left: 16px;
}
DIV.leftCol
{
float: left;
width: 220px;
clear: both;
}
DIV.leftCol ul li
{
list-style: none;
}
#slideshow.js{
width:185px;
border:1px solid #645014;
padding:5px;
background:#fff;
margin:0 0 10px 0;
color:#000;
}
.slidenav{
width:185px;
border: 1px solid #645014;
border-top: none;
border-bottom: none;
padding:5px;
margin:1em 0 0 0;
text-align:center;
font-weight:bold;
background:url(/uploads/slideshow_bg.PNG) repeat-x #ccc;
font-size:90%;
}
.slidenav a{
text-decoration:none;
color:#000;
}
.slidenav span{
padding:0 1em;
color:#000;
}
#slideshow.js img{
display:block;
margin:0 auto;
}
#slideshow.js li{
display:none;
padding:0;
}
#slideshow.js li.current{
display:block;
}
ul#slideshow
{
list-style-type: none;
}
.
Bookmarks