/*
------------------------------------------------------------------------
This is the "capri" style for joelschou.com, part of the "destinations"
theme designed and grafted onto WordPress 1.5 starting in February 2005.

The graphics and design are Copyright �� 2005 Joel Schou and joelschou.com.
Reproducing the design in whole or part is strictly prohibited. However,
creative inspirtaion is wonderful and inevitable.

Feel free to learn from the CSS. Copying all or part is not only shallow,
but completely useless if you want to actually learn CSS. Please respect
my hard work and only use my code for reference. I will gladly answer
your questions. Email me at misc@joelschou.com.

The masthead photo was taken by me on 04 April, 2004 (my birthday!)
looking east(ish) from high upon Capri Island, Italy in early evening.
------------------------------------------------------------------------
Text sizes are found in small.css and large.css in this folder.
------------------------------------------------------------------------
*/

/* ------ start of global region ------------------------------------------ */
* {
	margin: 0;
	padding: 0;
}

body {
	background: #C9D7D2;
}

#container {
	top: 0px;
	left: 0px;
	text-align: center;
	background: url(/styles/capri/img/container.jpg) repeat-x;
	border: none;
}

/* ------ end of global region ------------------------------------------

   ------ start of header region ------------------------------------------ */
#head {
	position: relative;
	top: 0px;
	margin: 0px auto;
	padding-right: 49px;
	width: 784px;
	height: 320px;
	background: url(/styles/capri/img/head.jpg) no-repeat;
}

#head h1 {
	height: 0px;
	text-indent: -9999px;
	background: none;
}
#head h2 {
	position: absolute;
	top: 4px;
	right: 69px;
	margin: 0; padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	color: #121E17;
	text-align: right;
	background: none;
}

#accessible {
	position: absolute;
	left: -9999px;
}

/* ------ site navigation ------------------------------------------ */
ul#nav {
	position: absolute;
	top: 60px;
	left: 49px;
	width: 735px;
	height: 225px;
	list-style: none;
}

ul#nav li {
	display: block;
	position: absolute;
}
li#index {
	left: 0px;
	top: 0px;
	width: 735px;
	height: 40px;
	background: url(/styles/capri/img/navindex.png) no-repeat;
}
li#journal, li#studio, li#portfolio, li#about, li#contact {
	top: 195px;
	height: 40px;
	background: url(/styles/capri/img/nav.png) no-repeat;
}
li#journal { left: 20px; width: 145px; }
li#studio { left: 165px; width: 125px; }
li#portfolio { left: 290px; width: 155px; }
li#about { left: 445px; width: 120px; }
li#contact { left: 565px; width: 150px; }

ul#nav li a {
	display: block;
	height: 40px;
	text-indent: -9999px;
	text-decoration: none;
	border: none;
}
li#index a:link, li#index a:visited {
	background: url(/styles/capri/img/navindex.png) no-repeat;
}
li#index a:hover, li#index a:active {
	background-position: 0px -40px;
}
li#journal a:link, li#studio a:link,
li#portfolio a:link, li#about a:link,
li#contact a:link, li#journal a:visited,
li#studio a:visited, li#portfolio a:visited,
li#about a:visited, li#contact a:visited {
	background: url(/styles/capri/img/nav.png) no-repeat
}
li#journal a:hover, li#journal a:active { background-position: 0px -40px; }
li#studio a:hover, li#studio a:active { background-position: -145px -40px; }
li#portfolio a:hover, li#portfolio a:active { background-position: -270px -40px; }
li#about a:hover, li#about a:active { background-position: -425px -40px; }
li#contact a:hover, li#contact a:active { background-position: -545px -40px; }

/* ------ styleswitcher ------------------------------------------ */
#switch {
	position: absolute;
	right: 90px;
	top: 350px;
	padding: 2px 0;
	height: 26px;
	width: 441px;
	text-align: right;
	font-family: 'Bernhard Modern Std', Baskerville, Georgia, TimesNewRoman, Times, serif;
	background: url(/styles/capri/img/cside.gif) -252px 0;
	border: 1px solid #919F99;
	border-top: none;
}
#switch dt {
	font-weight: normal;
	padding: 0 211px 0 10px;
}
#switch dd {
	position: absolute;
	top: 2px; height: 20px;
	text-align: left;
}
#switch-capri { right: 158px; width: 42px; padding: 2px 1px 2px 0; }
#switch-tate { right: 115px; width: 42px; padding: 2px 1px 2px 0; }
#switch-paris { right: 65px; width: 42px; padding: 2px 8px 2px 0; }
#switch-small { right: 42px; width: 22px; padding: 2px 1px 2px 0; }
#switch-large { right: 20px; width: 22px; padding: 2px 0px 2px 0; }
#switch a, #switch a.notselect {
	display: block;
	height: 20px;
	border: 1px solid #9fada8;
	text-decoration: none;
	text-indent: -9999px;
	background: url(/styles/capri/img/switch.jpg);
}
#switch-capri a, #switch-capri.notselect a { background-position: -1px -1px; }
#switch-tate a, #switch-tate.notselect a { background-position: -43px -1px; }
#switch-paris a, #switch-paris.notselect a { background-position: -85px -1px; }
#switch-small a, #switch-small.notselect a { background-position: -127px -1px; }
#switch-large a, #switch-large.notselect a { background-position: -149px -1px; }
#switch dd a:hover, #switch dd.select a {
	border: 1px solid #24332B;
}
#switch-capri a:hover, #switch-capri.select a { background-position: -1px -23px; }
#switch-tate a:hover, #switch-tate.select a { background-position: -43px -23px; }
#switch-paris a:hover, #switch-paris.select a { background-position: -85px -23px; }
#switch-small a:hover, #switch-small.select a { background-position: -127px -23px; }
#switch-large a:hover, #switch-large.select a { background-position: -149px -23px; }

/* ------ end of header region ------------------------------------------

   ------ start of content region ------------------------------------------ */
#content {
	margin: 28px auto;
	width: 731px;
	background: #B1BFB9 url(/styles/capri/img/content.gif) -2px 0;
	border-width: 2px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
	z-index: 10;
}

/* ------ content top ------------------------------------------ */
#ctop {
	width: 731px;
	height: 8px;
	text-align: left;
	clear: both;
	background: url(/styles/capri/img/ctop.gif) no-repeat -2px -2px;
}

/* ------ content columns ------------------------------------------ */
.cfull {
	display: none;
	padding: 0 20px 10px 20px;
	clear: both;
	text-align: left;
}

.cmain {
	position: relative;
	display: inline;
	width: 520px; /*487px*/
	margin: 40px 20px 0 10px;
	text-align: left;
	float: right;
	clear: right;
	background: url(/styles/capri/img/content.gif) -193px -30px;
}

.cside {
	/*width: 164px;*/
	margin: /*10px*/40px 20px 0 0/* 0 0 20px*/;
	text-align: left;
	/*background: url(/styles/capri/img/units.gif) no-repeat 85px 0;*/
}

/* ------ content bottom ------------------------------------------ */
#cbottom {
	position: relative;
	width: 731px;
	height: 8px;
	clear: both;
	background: url(/styles/capri/img/cbottom.gif) no-repeat -2px 100%;
}

#totop {
	position: relative;
	bottom: -20px;
	float: right;
	margin: -20px 18px 0 0;
	padding: 0;
	width: 200px;
	height: 30px;
	text-align: center;
	background: #dae0e3 url(/styles/capri/img/floatbottom.gif) repeat-x;
}
#totop a, #totop a:link, #totop a:visited {
	display: block;
	font-family: 'Bernhard Modern Std', Baskerville, Georgia, TimesNewRoman, Times, serif;
	color: #24332B;
	text-decoration: none;
	border: 2px solid #9fada8;
}
#totop a:hover, #totop a:active {
	background: url(/styles/capri/img/cside.gif) -10px 0;
}

/* ------ end of content region ------------------------------------------

   ------ start of footer region ------------------------------------------ */
#foot {
	position: relative;
	height: 80px;
	padding-right: 49px;
	background: url(/styles/capri/img/foot.jpg) repeat-x;
}
#coconut {
	padding: 0;
	margin: -60px auto 0 auto;
	padding-left: 49px;
	width: 731px;
}
#coconut a, #coconut a:link, #coconut a:visited {
	display: block;
	float: left;
	width: 40px;
	height: 48px;
	background: url(/styles/capri/img/coconut.jpg);
	text-indent: -9999px;
	text-decoration: none;
	border: none;
}
#coconut a:hover, #coconut a:active {
	background-position: -40px 0;
	background-color: transparent;
}

#legal {
	height: 44px;
	width: 714px;
	margin: 0px auto;
	padding: 21px 10px 15px 60px;
	background: url(/styles/capri/img/legal.jpg) no-repeat 100% 0;
}

/* ------ end of footer region ------------------------------------------
   ------ end of layout parts ------------------------------------------

   ------ start of text styling ------------------------------------------
   ------ links of all sorts ------------------------------------------ */
a {
	color: #0C120F;
	text-decoration: underline;
}
a:visited {
	color: #777;
	text-decoration: underline;
}
a:hover {
	color: #000;
	text-decoration: none;
	border-bottom: 1px solid #000;
}
a:active {
	color: #fff;
	text-decoration: none;
	background: #6b7b73;
	border: none;
}
a img, a:visited img {
	border: none;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited {
	text-decoration: none;
	border: none;
}

/* ------ start of content region ------------------------------------------
   ------ unit box styles ------------------------------------------ */
.unit {
	padding: 0 0 30px 0;
	margin: 0 0 10px 0;
	color: #42574C;
	background: url(/styles/capri/img/unit.gif) no-repeat 50% 100%;
}
.cside .unit {
	margin: 0 490px 30px 0;
	padding: 0 0 0 0;
	color: #32473C;
	border-right: 1px solid #A1AEA8;
	/*background: url(/styles/capri/img/units.gif) no-repeat 85px 100%;*/
	background: none;
}

/* ------ global text styles ------------------------------------------ */

/* ------ headline styles ------------------------------------------ */
h1, h2, h3, h4, h5, h6 {
	margin: 0 0 2px 40px;
	padding: 10px 0 4px 0;
	font-weight: normal;
	font-family: 'Bernhard Modern Std', Baskerville, Georgia, TimesNewRoman, Times, serif;
	color: #24332B;
	background: url(/styles/capri/img/hmain.gif) repeat-x 0 100%;
}

#ctop h1 {
	position: relative;
	/*float: left;*/
	top: -20px;
	margin: 0 0 0 18px;
	padding: 4px 10px 0 10px;
	width: 180px;
	height: 22px;
	background: #dae0e3 url(/styles/capri/img/floattop.gif) repeat-x 0 100%;
	border: 2px solid #9fada8;
	text-align: center;
	z-index: 100;
}

.cside h1, .cside h2, .cside h3, .cside h4, .cside h5, .cside h6 {
	margin: 10px 0 0 0;
	padding: 4px 20px 0 20px;
	background: url(/styles/capri/img/hside.gif) repeat-y -2px 0;
	border-bottom: 1px solid #919F99;
}
.cside .links h3, .cside .archive h3 {
	margin: 0;
	color: #34433B;
	border: none;
}

/* ------ paragraph styles ------------------------------------------ */
p {
	padding: 0 3px 10px 43px;
	font-family: Baskerville, Georgia, TimesNewRoman, Times, serif;
	text-align: left;
}
p.center {
	text-align: center;
}
.excerpt p {
	margin: 0 3px 10px 43px;
	padding: 4px 8px;
	background: #C9D7D2;
	border-width: 1px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}

p.posting {
	margin-top: 2px;
	padding-left: 50px;
	padding-right: 13px;
}
p.details {
	padding: 6px 10px 0 10px;
	margin: 2px 0 10px 40px;
	background: url(/styles/capri/img/hmain.gif) repeat-x 0 0;
}
p.details a, p.details a:visited {
	text-decoration: underline;
}
p.details a:hover {
	text-decoration: none;
	border-bottom: 1px solid #000;
}
.cside p.details {
	margin: 0;
	padding: 4px 20px;
	background: url(/styles/capri/img/hside.gif) repeat-y -2px 0;
	border-top: 1px solid #919F99;
	border-bottom: none;
}

/* ------ more text styles ------------------------------------------ */
abbr, acronym {
	border-bottom: 1px dotted #53534a;
	cursor: help;
}
code {
	font-family: Monaco, Courier, 'Courier New', monospace;
	color: #9A3D49;
}
ins {
}
pre {
	margin: 0 20px 10px 63px;
	padding: 0 20px;
	font-family: Monaco, Courier, 'Courier New', monospace;
	color: #62372C;
	border-left: 1px dotted #62372C;
}
pre.codesnip {
	margin: 0 3px 10px 43px;
	padding: 6px 12px;
	font-family: Monaco, Courier, 'Courier New', monospace;
	color: #9A3D49;
	background: #D9e7e2;
	border-width: 2px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}
strike {
}
strong {
}

/* ------ image styles ------------------------------------------ */
.cmain p.img {
	margin: 4px 0;
	padding: 0 3px 10px 43px;
	text-align: center;
	border: none;
	background-color: transparent;
}

.thumbs {
	margin: 5px 3px 10px 43px;
	padding: 4px 8px;
	background: #C9D7D2;
	border-width: 1px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}
.thumbs h4 {
	margin: 0;
}
.thumbs ul, .thumbs p {
	padding: 5px 0;
	list-style: none;
}
.thumbs p.details {
	padding: 2px 0 0 0;
	margin: 5px 0;
	clear: both;
}
.thumb {
	margin: 5px 0;
	display: block;
	width: 49%;
	float: left;
	font-family: 'Lucida Grande', Arial, Helvetica, sans-serif;
	text-align: center;
}
.thumb.alt {
	float: right;
}
.thumb.none {
	float: none; clear: both;
}
.thumb img {
	border-width: 2px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}

.cmain p.img span, .thumb span {
	display: block;
}
p.img img, .thumbs img.img {
	border-width: 2px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}

img.hlimg {
	width: 470px;
	border-width: 2px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}

.float { float: right; }
.float.alt { float: left; }

p.float { padding: 10px 10px 10px 0; }
p.float.alt { padding: 10px 0 10px 10px; }

img.float { margin: 5px 0 10px 10px; }
img.float.alt { margin: 5px 10px 10px 0; }

.icon { width: 132px; }

/* ------ list styles ------------------------------------------ */
ul, ol, dl {
	padding: 0 20px 10px 63px;
	font-family: Baskerville, Georgia, TimesNewRoman, Times, serif;
}
ul {
	list-style-type: circle;
}
.cside ul, .cside ol, .cside dl {
	padding: 5px 0 5px 30px;
	background: url(/styles/capri/img/cside.gif) repeat-y -2px 0;
}
.cside ul {
}

ul ul, ul ol, ol ol, ol ul {
	padding: 0 0 0 20px;
}

dl dt {
	font-weight: bold;
}
.cside li {
}

/* ------ comments list styles ------------------------------------------ */
ol.commentlist {
	margin: 0;
	padding: 0 3px 10px 43px;
	list-style: none;
}
ol.commentlist li {
	position: relative;
	margin: 10px 0;
	padding: 6px 12px;
	background: #C9D7D2;
	border-width: 1px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}
ol.commentlist li.odd {
	background: #D1DfDa;
}
ol.commentlist li.joel {
	color: #22372C;
	background: #A9B7B2;
}

ol.commentlist li span {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	margin: 10px 0 5px 5px;
	padding: 5px;
}
ol.commentlist li.odd span {  }
ol.commentlist li.joel span {  }
ol.commentlist li span a { color: #42574C; }

ol.commentlist li h4 {
	margin: 0 0 2px 0;
	padding: 0 0 3px 0;
}
ol.commentlist li.joel h4 {
}
ol.commentlist li p {
	padding: 0 0 10px 0;
}
ol.commentlist li.joel p {
}

img.gravatar {
	margin: 0 0 5px 5px;
	float: right;
}

/* ------ feature list styles ------------------------------------------ */
.cside .feature dl {
	padding: 5px 0 5px 20px;
}
.cside .feature dl dt {
	text-align: center;
}
.cside .feature dl dt img {
	margin: 4px 0 0 0;
	width: 156px;
	border-width: 2px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
}
.cside ul li.more, .cside dl dd.more {
	list-style: inside disc;
	padding: 0 0 0 10px;
}

/* ------ calendar styles ------------------------------------------ */
div#calendar {
	padding: 5px 0 5px 20px;
	background: url(/styles/capri/img/cside.gif) repeat-y -2px 0;
}
#wp-calendar {
	width: 156px;
	text-align: center;
	background: #A1AEA8;
	border-width: 0 2px;
	border-style: solid;
	border-color: #6b7b73 #82928b #707e77 #819089;
	border-collapse: collapse;
}
#wp-calendar thead {
	border-bottom: 1px solid #919F99;
}
#wp-calendar tfoot {
	border-top: 1px solid #919F99;
	border-bottom: 2px solid #707e77;
}
#wp-calendar th {
	width: 14%;
	border-top: 2px solid #6b7b73;
}
#wp-calendar tbody a {
	display: block;
	margin: 1px;
	text-decoration: none;
	background: #899791;
}
#wp-calendar tbody a:hover {
	color: #C0CFC9;
	background: #6B7B73;
}
#wp-calendar a:hover {
	border: none;
}
#wp-calendar #today {
	font-weight: bold;
	border: 1px solid #6b7b73;
}

/* ------ search box styles ------------------------------------------ */
.cside .search p {
	padding: 5px 0 5px 20px;
	margin: 0;
	text-align: left;
	background: url(/styles/capri/img/cside.gif) repeat-y -2px 0;
	border-bottom: 1px solid #919F99;
}
.search input {
	width: 150px;
	height: 16px;
}

/* ------ snobbery list styles ------------------------------------------ */
.snobbery ul {
	margin: 0;
	padding: 5px 0;
	list-style: none;
}
.snobbery li a {
	margin: 1px 20px;
	display: block;
	width: 160px;
	text-indent: -9999px;
	border: none;
}
#snob-bh a, #snob-wp a, #snob-xhtml a, #snob-css a {
	width: 160px; height: 20px;
	background: url(/styles/capri/img/snob.gif) no-repeat;
}
#snob-bh a:hover { background-position: 0 0; }
#snob-wp a:hover { background-position: 0 -20px; }
#snob-xhtml a:hover { background-position: 0 -40px; }
#snob-css a:hover { background-position: 0 -60px; }
#snob-bh a { background-position: 0 -80px; }
#snob-wp a { background-position: 0 -100px; }
#snob-xhtml a { background-position: 0 -120px; }
#snob-css a { background-position: 0 -140px; }

/* ------ end of content region ------------------------------------------

   ------ start of footer region ------------------------------------------ */
#legal p {
	margin: 0;
	padding: 2px 3px 0 52px;
	color: #a0aa99;
	text-align: right;
}

#legal a:link {
	color: #fff;
	text-decoration: none;
}
#legal a:visited {
	color: #808877;
	text-decoration: none;
}
#legal a:hover {
	color: #fff;
	text-decoration: underline;
}
#legal a:active {
	color: #0C120F;
	text-decoration: underline;
	background: #a0aa99;
}
