/* And I think I will travel to Rio */

/*

------------------------------------------------------
Copyright Jan Brasna, http://www.alphanumeric.cz/
some rights reserved
http://creativecommons.org/licenses/by-sa/2.0/

You are free to use this style sheet and its
associated image files to create your own site.
However, we ask that you respect the template's
creator by maintaining this attribution in
the style sheet.

Copyright Kilt Klassic modified and edited all graphics
and css for use by Kilt Klassic race committee 2008.
------------------------------------------------------

*/

body {
background: #807aa1 url(img/bg.png) repeat-y center;
font: 75%/1.2 verdana, lucida, sans-serif;
margin: 0;
padding: 0;
color: #333;
text-align: center;
}

h1, h2, h3 {
font-family: "Trebuchet MS", "Geneva CE", lucida, sans-serif;
color: #201937;
background: url('img/head-dec.png') right no-repeat;
}

h1 {
font-size: 220%;
letter-spacing: -0.08em;
}

h2 {
font-size: 170%;
letter-spacing: -0.05em;
}

h3 {
font-size: 150%;
}

p, ul {
margin: 0;
}

a {
color: #030ab0;
}

a:hover {
color: #e2be75;
background: #8472ec;
text-decoration: none; }

a:visited {
color: #0052ff;
}

#banner {
background: url('img/bg-head.png') center no-repeat #ffc600;
/*width: 680px;*/
height: 75px;
margin: 0 auto;
padding: 4px 0em 40px 0em;
position: relative;
overflow: hidden;
}

#banner p {
margin: 0 auto;
padding: 15px 0em 0px 0em;
text-align: Center;
width: 600px;
font: 380%/1.2 "Trebuchet MS", "Geneva CE", lucida, sans-serif;
color: #493291;
font-weight: bold;
letter-spacing: -0.08em;
}

#nav-toplevel {
margin: 0 auto;
padding: 0;
text-align: left;
position: relative;
width: 600px;
}

#nav-meta {
margin: 0 auto;
position: relative;
width: 80px;
top: -10px;
left: 260px;
}

#nav-meta ul {
list-style: none;
margin: 10px;
height: 0px;
}

#nav-meta a {
display: block;
width: 26px;
height: 18px;
position: absolute;
}

#nav-meta span {
display: block;
width: 0;
height: 0;
overflow: hidden;
}

#nav-meta #skip a {
width: 0;
height: 0;
}

#nav-meta #cont a {
background: url('img/nav-cont.gif') no-repeat;
left: 0;
}

#nav-meta #sear a {
background: url('img/nav-sear.gif') no-repeat;
left: 28px;
}

#nav-meta #smap a {
background: url('img/nav-smap.gif') no-repeat;
left: 54px;
}

#container {
width: 680px;
margin: 0 auto;
padding: 0;
text-align: left;
position: relative;
top: -42px;
}

#nav-main {
width: 680px;
height: 75px;
background: url('img/bg-header.png') no-repeat;
margin: 0 auto;
padding: 0;
text-align: left;
position: relative;
}

#nav-main ul {
list-style: none;
margin: 0;
padding: 0;
width: 680px;
overflow: hidden;
position: absolute;
bottom: 8px;
left: 25px;
}

#nav-main li, #nav-meta li {
display: inline;
}

#nav-main a {
display: block;
float: left;
padding: 10px;
margin-left: 1px;
background: url('img/bg-menu.png') bottom repeat-x #8279a2;
color: #ffc600;
text-decoration: none;
font-weight: bold;
font-size: 120%;
}

#nav-main a:hover {
background: url('img/bg-menu-on.png') bottom repeat-x #493291;
}

#nav-main a.current {
background: url('img/bg-menu-ac.png') bottom repeat-x #493291;
color: #ffc600; }

/*Display toggle so attributes match content*/
#content {
background: #ffd254 url(img/main-bot.png) no-repeat bottom;
margin: 25px 190px 0px 10px;
padding: 0.2em 2em 2em 2em;
color: #201937; }

#content li {
margin: 3px 25px 5px;
 }
 /*----------------Display Toggle in content here------------------------*/
#content foo {
display:none;
}

#content blockquote {
margin: 25px 25px 25px;
 }
#content-wide {
background: #ffd254 url(img/main-bot-wide.png) no-repeat bottom;
margin: 20px 10px 0 10px;
padding: 0.2em 2em 2em 2em;
color: #201937; }

#content-anchor {
background: url('img/main-top.png') top no-repeat #ffd254;
display: block;
position: absolute;
top: 100px;
left: 10px;
width: 480px;
height: 10px;
color: #ffd254; }

#content-anchor-wide {
background: url('img/main-top-wide.png') top no-repeat #b6c36d;
display: block;
position: absolute;
top: 100px;
left: 10px;
width: 600px;
height: 10px;
}

#photo {
background: #ffd254 url(img/main-bot.png) no-repeat bottom;
margin: 20px 190px 0 10px;
padding: 0.2em 2em 2em 2em;
color: #201937; }

#photo-anchor {
background: url('img/main-top.png') top no-repeat #b6c36d;
display: block;
position: absolute;
top: 100px;
left: 10px;
width: 480px;
height: 10px;
}
/*Place a photo right of content instead of additional Nav*/
#Right-Photo {
position: absolute;
top: 100px;
left: 515px;
width: 170px;
/*background: #443b92 url(img/side-top.png) no-repeat top;*/
/*color: #443b92;*/ }

/*Place a photo right of content BELOW additional Nav*/
#Right-PhotoLow {
position: absolute;
top: 150px;
left: 515px;
width: 170px;
/*background: #443b92 url(img/side-top.png) no-repeat top;*/
/*color: #443b92;*/ }

#nav-subs {
position: absolute;
top: 100px;
left: 500px;
width: 170px;
background: #ffd254 url(img/side-top.png) no-repeat top;
color: #201937; }

#nav-subs ul {
margin: 1.5em 1.5em 0 1.5em;
padding: 0;
list-style: none;
}

#nav-subs li {
background: url('img/side-bul.png') left no-repeat;
padding-left: 12px;
}

#nav-subs a {
color: #201937;
text-decoration: none;
}

#nav-subs .youarehere {
color: #e2be75;
background: #201937;
text-decoration: none;
}

#nav-section {
background: url('img/side-bot.png') bottom no-repeat;
padding-bottom: 1.5em;
}

/*---Original Nav-Section with the Mid.png Changed code above to bottom
#nav-section {
background: url('img/side-mid.png') bottom no-repeat;
padding-bottom: 2.5em;
}
*/
#nav-supp {
background: url('img/side-bot.png') bottom no-repeat;
padding-bottom: 1.5em;
}

#info-site {
background: url('img/bg-foot.png') center repeat-y #ffc600;
margin: 0;
padding: 1em;
font-size: 85%;
color: #bf8c01;
}

#info-site a {
color: #bf8c01;
text-decoration: none;
}

#info-site a:hover {
color: #ffc600;
background: #bf8c01;
}

/*=============Gallery Container==============*/

.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid blue;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #ffd254;
padding: 5px;
left: -1000px;
border: 1px dashed #ffc600;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0; /*original was 0*/
left: 230px; /*position where enlarged image should offset horizontally original 230*/
z-index: 50;
}