/*
  Theme Name: Peggy-Siegal
  Theme URL: http://www.j3studio.net/portfolio/
  Description: Peggy-Siegal Theme is an event gallery theme created for Peggy Siegal. Graphics by Scott Garber, coded and developed by Jarot Syahputro
  Author: Jarot Syahputro
  Author URI: http://www.djarot.com
  Version: 1.0

  The CSS, XHTML and design is released under GPL:
  http://www.opensource.org/licenses/gpl-license.php

  Changelog:
  v1.0 - 09.01.09
  First Release of Peggy-Siegal Theme theme.
*/

body {
  width:880px;
  background:#fff;
  color:#202020;
  font-size:12px;
  font-family:Arial;
  margin:0 auto;
  padding:0;
}
	
#wrap {
  background:#fff;
  margin:0 auto;
  padding:0;
}
	
/************************************************
  Global  *
************************************************/
small { font-size:10px; }
.clear, #cbot, .c0de { clear:both }
.down20 {margin:20px 0;}
#nav a, #header h1 a, .evbox li a, #more a, #dlprint a { text-indent:-9000px; }
#nav li, #header h1, .evbox li, #more, #docprint, #dlprint { overflow:hidden; }
label {width:150px; float:left;}

/************************************************
  Hyperlinks  & COLORS *
************************************************/
a, a:visited { color:#1a1a1a; text-decoration:none; }
a:hover, label { color:#7f7d7d; }
a img {border:0;}
.rd {color:#900;}
.gr {color:#390;}

/************************************************
  Header
************************************************/
#header {
  width:880px;
  height:204px;
  margin:28px auto 0;
  background:#fff url(images/hdr-bg.gif) 0 0 repeat-x;
}
#header h1, #header h1 a {
  width:880px;
  height:153px;
  float:left;
  margin:0;
}
#header h1 { background:url(images/hdr.png) 8px 36px no-repeat; }
#nav {
  padding:0;
  margin:0 0 0 30px;
  background:url(images/nav.png) 0 0 no-repeat;
  /*width:544px; *//*Use this width when the article page is a go.*/
  width:446px;
  height:50px;
  float:left;
}
#nav li, #nav a { height:50px; display:block; text-align:center; } 
#nav li { list-style:none; display:inline; float:left; }
#hom {width:88px;}
#pre {width:135px;}
#abo {width:100px;}
#con {width:123px;}


#hom a:hover, #hom.this a {background:url(images/nav.png) 0 -50px no-repeat; }
#pre a:hover, #pre.this a {background:url(images/nav.png) -88px -50px no-repeat;}
#abo a:hover, #abo.this a {background:url(images/nav.png) -223px -50px no-repeat;}
#con a:hover, #con.this a {background:url(images/nav.png) -323px -50px no-repeat;}
#art a:hover, #art.this a {background:url(images/nav.png) -446px -50px no-repeat;}


/************************************************
*  Content  * 
************************************************/
#content {
  width:880px;
  margin:0;
  padding:0;
}
#contentleft {
  float:left;
  width:679px;
  margin:0;
  padding:0;
  background:#fff url(images/bodybg.gif) 0 0 repeat-y;
  position:relative;
}
#ctop {
  width:679px;
  height:14px;
  margin:0;
  padding:0;
  background:url(images/ctop.png) 0 0 no-repeat;
}
#cbot {
  width:679px;
  height:18px;
  background:url(images/cbot.png) no-repeat;
  position:bottom;
}
/* Home Gallery */
#hgal {
  width:678px;
  height:193px;
  background:#FFF url(images/hgal_bg.png) 0 0 no-repeat;
  padding:9px 0 0 0;
  margin:0;
  position:relative;
  overflow:hidden;
  
}
#hgal span {
  width:653px;
  height:159px;
  background:url(images/hgal_bg-frame.png) 0 0 no-repeat;
  position:absolute;
  top:9px;
  left:9px;
  z-index:1;
}
#hgal div#dimg {position:absolute; top:9px; left:0; width:678px; height:193px; z-index:2;}
#hgal img, #hgal p {width:197px; }
#hgal p {float:left;margin:7px 10px 50px 15px; padding:0; height:145px; overflow:hidden;}
#event-label {background:url(images/event-label.png) 0 0 no-repeat;width:88px; height:64px; position:absolute; top:190px; left:-24px;}
#hev {display:none;}
/* Single Post */
.single {
  width:600px;
  margin:10px 0 15px 28px;
  padding:10px 10px;
  background:#fff;
  -moz-border-radius:5px;
  -khtml-border-radius:5px;
  -webkit-border-radius:5px;
}
.single h2 {margin:0; padding:0;}
#content h1 { margin:0 0 2px 0; padding:0; color:#303232; font-family:Georgia;}
#content h1.title {padding:0 0 0 30px; margin:0;}
.date { font-weight:bold; color:#7f7d7d; padding:10px 0 0; margin-bottom: 10px;}
.liner { background:url(images/liner.gif) center 0 no-repeat;}

#content h3 {
  margin:5px 0;
  color:#303232;
  font-size:18px;
}

/* Home */
.evbox {
  width:187px;
  height:231px;
  background:url(images/evbox.png) 0 0 no-repeat;
  margin:15px 0 0 30px;
  float:left;
  position:relative;
}
.evbox h2 {
  font-size:14px;
  font-family:Arial;
  font-weight:bold;
  margin:5px 10px 0 11px;
  padding:0;
}
.evbox h4 {
  color:#757272;
  margin:3px 0 0 12px;
  font-size:11px;
  font-weight:normal;
  float:left;
}
.evbox p {
  width:158px;
  height:130px;
  margin:10px 0 0 11px;
  padding:0;
  font-size:10px;
  background:#e4dfdf url(images/tmb.gif) 0 0 no-repeat;
  overflow:hidden;
}
.evbox p img {width:158px;}
.evbox ul {
  margin:17px 10px 0 0;
  padding:0;
  width:60px;
  position:absolute;
  right:0; bottom:13px;
  list-style:none;
}
.evbox li  { display:inline; }
.evbox li, .evbox li a  {
  width:18px;
  height:16px;
  float:right;
}
#more {
  width:141px;
  height:24px;
  border:0px solid #999;
  float:right;
  background:url(images/morebg.png) 0 0 no-repeat;
  margin:0 28px 0 0;
}
#more a {
  width:141px;
  height:24px;
  float:right;
}
#docprint {height:0; padding:0; margin:0; }
#dlprint, #dlprint a {float:right; padding:0; margin:0; height:34px;}
#dlprint a {width:37px;}
#doPrint {background:url(images/ico.gif) -37px 0 no-repeat;}
#dl0ad {background:url(images/ico.gif) 0 0 no-repeat;}

#doPrint:hover {background:url(images/ico.gif) -37px -45px no-repeat;}
#dl0ad:hover {background:url(images/ico.gif) 0 -45px no-repeat;}

/************************************************
*  Sidebar  *
************************************************/
#sidebar {
  float:right;
  width:190px;
  margin:0;
  padding:0;
  line-height:20px;
  border:0px solid #f00;
}
#sidebar h2 {
  background:#f00;
  color:#fff;
  font-size:11px;
  font-family:Arial, Tahoma, Verdana;
  font-weight:bold;
  text-transform:uppercase;
  margin:0 0 5px 0;
  padding:5px 0 3px 10px;
}
#sidebar ul {
  list-style:none;
  margin:0;
  padding:0 0 5px 0;
}
#sidebar p {
  padding:0;
  margin:0;
  line-height:20px;
}
#archives h2 {
  background:#000 url(images/evcal.png) 0 0 no-repeat;
  text-indent:-9000px;
}
#archives ul {
  list-style:none;
  margin:0 0 10px 0;
  padding:0 0 50px 0;
  font-family:Tahoma;
  font-size:12px;
  font-weight:bold;
  color:#4b4c4d;
  background:url(images/dash.png) no-repeat bottom;
}
#archives li {
  padding:0 0 0 15px;
  margin:0;
}
#archives ul li a {
  padding:0 0 0 15px;
  text-decoration:none;
  background:url(images/dot.gif) 0 3px no-repeat;
}
#archives ul li a:hover {
  padding:0 0 0 15px;
  text-decoration:none;
  background:url(images/dot2.gif) 1px 3px no-repeat;
  color:#3acfea;
}
#subscribe h2 {
  background:#000 url(images/subs.png) 0 0 no-repeat;
  text-indent:-9000px;
  margin:40px 0 0 0;
}
#subscribe {
  padding:0 0 40px 0;
  background:url(images/dash.png) no-repeat bottom;
}
#subscribe p {
  margin:10px 0 0 6px;
  font-size:10px;
  border:0px solid #999;
  line-height:11px;
}
#subscribe form {
  background:url(images/subs.gif) 0 0 no-repeat;
  padding:0; margin:15px 0 0 0;
}
#subscribe input { width:147px; border:0; font-size:14px; padding:8px 5px 8px 3px; color:#5B5B5B; background:transparent;}
#subscribe input.sbmt {width:23px; height:25px; margin:2px; padding:0; vertical-align:top;}
#contact h2 {
  background:#000 url(images/cont.png) 0 0 no-repeat;
  text-indent:-9000px;
  /*margin:40px 0 0 0;*/
  margin:0;
  padding:0 0 5px 0;
}
#contact h4 {
  padding:0 0 0 18px;
  font-size:12px;
  font-family:Tahoma;
  font-weight:bold;
}
#contact p {
  padding:0 0 0 18px;
  width:140px;
  line-height:14px;
  font-family:Verdana;
  font-size:10px;
}

/************************************************
*  Footer  *
************************************************/
#footer {
  background:#fff;
  width:880px;
  height:10px;
  margin:0 auto;
  padding:0;
}

/************************************************
*  CONTACT FORM  *
************************************************/
#exA { width:460px;}
#exA label {}
#exA input, #exA textarea, #commentblock input, #commentblock textarea {
  width:280px;
  font-size:12px;
  font-family:Arial;
  padding:2px;
  border:0;
  margin:1px 0;
  background:#e9e8e8;
  -moz-border-radius:4px;
  -khtml-border-radius:4px;
  -webkit-border-radius:4px;
  float:left;
}
#exA input#security_code {font-size:20px; font-weight:bold; width:100px;}
#exA .fValidator-msg {text-indent:-9000px; background:url(images/x.gif) 3px 3px no-repeat; width:13px; float:left;}
#exA_Emailrequired_msg, #exA_Phonerequired_msg, #security_coderequired_msg {display:none;}
#exA .c0de {color:#666; padding:5px 0 0; margin-left:150px; font-size:10px;}
#exA label {padding:2px 0; float:left; width:150px;}
#exA label.b {background:url(images/sec.gif) 0 0 no-repeat; padding:2px 0 2px 2px; width:148px; }
#exA input.sbmt {
  border:1px solid #d2d2d2;
  cursor:pointer; 
  margin:10px 0;
  width:100px;
  font-weight:bold;
  background:#FFF;
  -moz-border-radius:13px;
  -khtml-border-radius:13px;
  -webkit-border-radius:13px;
  float:left;
}


/************************************************
*  Comments  *
************************************************/
#commentblock {
  float:left;
  padding:0;
  margin:0;
}
#commentblock ol {
  list-style:none;
  margin:0;
  padding:0;
}
#commentblock li {
  margin:5px 0; 
  padding:10px 10px 5px;
  -moz-border-radius:4px;
  -khtml-border-radius:4px;
  -webkit-border-radius:4px;
}
.alt {background:#f1eded;}
.commentdate { font-size:12px; }
#commentlist li p {
  margin-bottom:0;
  padding:0;
}
.commentname { margin:0; padding:0; font-weight:bold; font-family:Georgia; }
.commentinfo{
  clear:both;
}
.commenttext {
  clear:both;
  margin:0;
  padding:0 10px;
  font-family:Tahoma;
}
.commenttext-admin {
  clear:both;
  margin:3px 0 10px 0;
  padding:10px 10px 5px 10px;
}
/*********************************
*  Cool-Navi                     *
*********************************/
.coolnavigate {
  margin:0 30px 15px 30px; 
  padding:5px; 
  text-align:center; 
  font-family:Tahoma;
  font-weight:bold;
  background:#FFF;
  -moz-border-radius: 13px;
  -khtml-border-radius: 13px;
  -webkit-border-radius: 13px;
  border-radius: 13px;  
}
.coolnavigate a, .coolnavigate a:link,.coolnavigate a:visited,.coolnavigate a:active,
.coolnavigate span.pages, .coolnavigate a:hover,.coolnavigate span.current,.coolnavigate span.extend {
  padding: 2px 6px;
  margin: 1px;
  text-decoration: none;
  background-color: #e4dfdf;	
    -moz-border-radius: 13px;
  -khtml-border-radius: 13px;
  -webkit-border-radius: 13px;
  border-radius: 13px; 
}
.coolnavigate span.pages,.coolnavigate span.current,.coolnavigate span.extend { color: #303232;}
.coolnavigate a { color: #303232; }
.coolnavigate a:hover { color: #3acfea; background:#303232; }
.coolnavigate span.current { color:#303232; font-weight: bold; background-color: #FFF;	}
.navi-only {float:right;padding:10px 10px 0 0; font-weight:bold; font-family:Tahoma; font-size:10px;}

/************************
  MEDIABOX
************************/
#mbOverlay {
	position: absolute;
	z-index: 9997;
	left: 0;
	width: 100%;
	background-color: #000;
	cursor: pointer;
}
#mbOverlay.mbOverlayFF { background: transparent url(images/lb-80.png) repeat;}
#mbOverlay.mbOverlayIE { background: transparent url(images/lb-50.gif) repeat;}
#mbCenter, #mbBottomContainer {
	position: absolute;
	z-index: 9998;
	left: 50%;
	overflow: hidden;
	background-color: #e4dfdf;
   	-moz-border-radius: 7px;
	-khtml-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;

}
#mbBottomContainer {overflow: visible;}
.mbLoading { background: url(images/lb-loading.gif) no-repeat center; }
#mbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #e4dfdf;
	background-repeat: no-repeat;
/* Sets the style for inline content, if no style is given	*/
	font-family: Arial;
	line-height: 19px;
	font-size: 12px;
	color: #000;
	text-align: left;
	-moz-border-radius: 7px 7px 0 0;
	-webkit-border-top-left-radius: 7px;
	-webkit-border-top-right-radius: 7px;
	-khtml-border-top-left-radius: 7px;
	-khtml-border-top-right-radius: 7px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;

}
#mbImage a, #mbImage a:link, #mbImage a:visited { color: #ddd; } /*	Sets the style for inline content, if no style is given	*/
#mbImage a:hover, #mbImage a:active { color: #fff; } /*	Sets the style for inline content, if no style is given	*/

#mbBottom {
	font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
	line-height: 19px;
	font-size: 12px;
	color: #666;
	text-align: left;
	border: 10px solid #e4dfdf;
	border-top-style: none;
	-moz-border-radius: 0 0 7px 7px;
	-webkit-border-bottom-left-radius: 7px;
	-webkit-border-bottom-right-radius: 7px;
	-khtml-border-bottom-left-radius: 7px;
	-khtml-border-bottom-right-radius: 7px;
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 7px;
  position:relative;
}
#mbBottom a#mbNextLink, #mbBottom a#mbPrevLink {overflow:hidden;}
#mbTitle {
	display: inline;
	color: #000;
	font-weight: bold;
	line-height: 20px;
	font-size: 12px;
}
#mbNumber {
	display: inline;
	color: #666;
	line-height: 14px;
	font-size: 10px;
  float:right;
  margin-top:3px;
  clear:both;
}

#mbCaption {
	display: block;
	color: #666;
	line-height: 14px;
	font-size: 10px;
  
}

#mbCloseLink {
	display: block;
	float: right;
	height: 20px;
	margin: 0;
	outline: none;
  width: 65px; background: transparent url(images/lb-close.gif) no-repeat center;
}
#mbPrevLink, #mbNextLink {
  display: block; 
  height: 22px; 
  width:50%;
  position:absolute;
  top:-32px;
	z-index: 9999;
  overflow:hidden;
}
#mbPrevLink { left:0; background: transparent url(images/lb-prev.png) 0 no-repeat; }
#mbNextLink { left:50%; background: transparent url(images/lb-next.png) right no-repeat; }

#mbError {
	position: relative;
	top: 30%;
	font-family: Arial;
	line-height: 19px;
	font-size: 12px;
	color: #000;
	text-align: center;
	border: 10px solid #700;
	padding: 20px 10px 30px;
	margin: auto;
}
/************************************************
*  SLIMBOX  *
************************************************/
#lbOverlay {
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	cursor: pointer;
}
#lbCenter, #lbBottomContainer {
	position: absolute;
	z-index: 9999;
	overflow: hidden;
	background-color: #e4dfdf;
 	-moz-border-radius: 8px;
	-khtml-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}
.lbLoading {background: #e4dfdf url(images/lb-loading.gif) no-repeat center; }
#lbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #e4dfdf;
	background-repeat: no-repeat;
	-moz-border-radius: 7px 7px 0 0;
	-webkit-border-top-left-radius: 7px;
	-webkit-border-top-right-radius: 7px;
	-khtml-border-top-left-radius: 7px;
	-khtml-border-top-right-radius: 7px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
}
#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	outline: none;
	width: 50%;
}
#lbPrevLink { left:0; background: transparent url(images/lb-prev.png) no-repeat 0 100%;}
#lbNextLink { left: 50%; background: transparent url(images/lb-next.png) no-repeat 100% 100%;}

#lbPrevLink:hover { background: transparent url(images/lb-prev.png) no-repeat -1px 100%; }
#lbNextLink:hover { background: transparent url(images/lb-next.png) no-repeat 100.5% 100%; }

#lbBottom {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 10px solid #e4dfdf;
	border-top-style: none;
  	-moz-border-radius: 0 0 7px 7px;
	-webkit-border-bottom-left-radius: 7px;
	-webkit-border-bottom-right-radius: 7px;
	-khtml-border-bottom-left-radius: 7px;
	-khtml-border-bottom-right-radius: 7px;
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 7px;
}
#lbCloseLink {
	display: block;
	float: right;
	width: 66px;
	height: 22px;
	background: transparent url(images/lb-close.gif) right 0 no-repeat;
	margin: 5px 0;
	outline: none;
}
#lbCaption, #lbNumber { margin-right: 71px;}
#lbCaption { font-weight: bold; color:#333;}
