/* ipop */
/* a complex skin created by alison. For requests of other colour schemes for this skin, please email alison at ezboardcorp.com */
/* for help with editing this skin, please visit skins.yuku.com */

/* last edited Feb 27 2009 - Az */



/* ---------------------------------- */
/* default set up */

/* -------------------- font module and basic settings --------------- */
body { font-size: 62.5%; font-family: "Trebuchet MS", "Tahoma", Arial, sans-serif; }
html>body { font-size: 10px; }

h1 { font-size: 1.6em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.4em; font-family: "arial", sans-serif;}
h4 { font-size: 1.2em; }
h5 { font-size: 1.1em; }
h6 { font-size: 1em; }
p { font-size: 1em; }

p, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0}
p { margin-bottom: 8px; }

.category-box p { margin-bottom: 0px; }


/* ----------------- common elements ----------------- */
table { padding: 0; border-collapse: collapse; }
td { padding: 0; }

table {empty-cells: show}

/* ----------------- forms ------------------- */
form { margin: 0; padding: 0;}

input { 
border: 1px solid #9BC2C6; 
background: #D1E4E5; 
color: #666; 
}

.kudos input { border: none; background: none ;
}
.kudos form {
position: relative;
top: -3px;}

label { margin-right: 10px; }

/* ---------------- link colours and details ---------------- */
a { color: #666; text-decoration: none; }
.category-box td a { color: #666;}

.post-content a { font-weight: bold; color: #368F8F;}


/* ------------------ generic layout module --------------------- */
body { background: #fff; color: #666;  }

/* add a bit of layout... */
#wrapper { margin: 10px auto;  width: 780px; }

/* there are boxes, and then there are boxes. Some boxes are special and hold the page content. Those ones are .forum-box, .category-box, .discussion-box  */
.box { 
background: #fff url(http://static.yuku.com/domainskins/bypass/img/ipop/header-tile.gif) repeat-x 0 0; 
margin-bottom: 10px;
border: 1px solid #9AC6CE;
border-top: 0px;
color: #666;
}

/* not all boxes have the boxheading, so those ones use the boxbody instead */
.boxheading, .control-box .boxbody, .announcement-box .boxbody, .whosonline-box .boxbody { 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/header-left.gif) no-repeat top left;
position: relative; 
top: -1px; 
left: 0px;  
padding-top: 5px;
}

.announcement-box .boxbody { padding-top: 20px; }

.onionskin1 { 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/header-right.gif) no-repeat top right; 
position: relative; 
top: 0; 
right: -1px;
}

.onionskin2 { 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/footer-right.gif) no-repeat bottom right; 
position: relative;
top:1px;
left: 0;
}

.onionskin3 {
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/footer-left.gif) no-repeat bottom left; 
position: relative;
top: 0; 
left: -2px;
padding-bottom: 13px;
}

.boxbody { 
padding: 5px 10px 0px 10px;
}

.discussion-box .boxbody, .category-box .boxbody, .forum-box .boxbody { padding: 1px; top: 0; left: 1}

/* ----------------- end generic layout module  --------------------------- */

/* ----------------- heading module ---------------------- */

/* headings all over the place */
.boxheading { 
position: relative; 
color: #9BC2C6;
text-align: center;
}

.boxheading h2, .boxheading h1 { 
width: 100%;
text-align: center; 
margin: auto;
padding: 8px 0 0 0;
font-size: 1.3em;
}

.tool-box .boxheading { text-align: left; }

.boxheading h1 {
text-align: left;
padding-left: 10px;
width: 80%;
}

/* heading in topics has extra bits */
a.collapse-button { 
position: absolute; 
top: 0px; 
right: 8px; 
font-size: .9em ;
color: #9BC2C6;
}

.collapse-button { 
top: -10px;
font-size: .7em
 }

.discussion-box .collapse-button { position: relative; top: -2px; }

/* --------------------- end  heading module ------------------------- */

/* ------------------ inner layout module - this is for inside the content areas, to give the 3D look -- */ 
/* ------------------ You can omit this is you don't want it -- */

/* generic td styles */
thead td, th { 
font-size: .9em; padding: 0 4px;
font-size: 10px;
}

tbody td { 
color: #666;
padding: 4px;
font-size: 12px;
}
 
th.latest, th.forum { text-align: left;}

.discussion-box table { margin: 0 0 0 0; }

/* specific td styles */
/* getting the curves inside the forum table space - these styles are only for the discussion, forum and category-box boxes. */

/* across the top */
.category-box th, .forum-box th, .discussion-box th { background: #fff url(http://static.yuku.com/domainskins/bypass/img/ipop/body-tile.gif) repeat-x top left; }
.category-box th.firstcol, .forum-box th.firstcol, .discussion-box th.firstcol { background: #fff url(http://static.yuku.com/domainskins/bypass/img/ipop/body-left.gif) no-repeat top left;}
.category-box th.lastcol, .forum-box th.lastcol, .discussion-box th.lastcol { background: #fff url(http://static.yuku.com/domainskins/bypass/img/ipop/body-right.gif) no-repeat top right; border-right: 0px; }

th.toggle { padding-right: 10px; }
th { padding: 12px 0px 2px 0px; }
.firstcol { padding-left: 20px; }  
.lastcol { padding-right: 10px; }

.discussion-box .collapse-button { padding-right: 5px; }

/* down the sides */
td.firstcol, th.firstcol { background: url(http://static.yuku.com/domainskins/bypass/img/ipop/left.gif) repeat-y; padding-left: 20px}
ul.thread, td.lastcol { background: url(http://static.yuku.com/domainskins/bypass/img/ipop/right.gif) top right repeat-y; padding-right: 10px; border-right: 0px;}
td.firstcol, th.firstcol {border-left: 0;}
td.lastcol, th.lastcol { border-right: 0}

/* footer */
tr.last td { background: #fff url(http://static.yuku.com/domainskins/bypass/img/ipop/footer-forum-tile.gif) repeat-x bottom left; padding-bottom: 17px;}
tr.last td.firstcol, .lastpost .poster-interact, tr.last .status { background: url(http://static.yuku.com/domainskins/bypass/img/ipop/footer-forum-left.gif) no-repeat bottom left; padding-bottom: 20px;}
tr.last td.lastcol, .lastpost .post-tools, tr.last td.lastcol { background: url(http://static.yuku.com/domainskins/bypass/img/ipop/footer-forum-right.gif) no-repeat bottom right; border-right: 0px; padding-bottom: 20px;}

.last td.poster-detail { background: url(http://static.yuku.com/domainskins/bypass/img/ipop/left.gif) repeat-y top left; }
.last td.post-content { background: url(http://static.yuku.com/domainskins/bypass/img/ipop/right.gif) repeat-y top right; }

.poster-interact, .post-tools { border-bottom: 1px solid #E7F8F8; }
.lastpost .poster-interact, .lastpost .post-tools { border-bottom: 0px solid #E7F8F8; }

/* horizontal borders */
td { border-right: 1px solid #E7F8F8;}


/* and some bits need extra padding because of the images */
.post-content, .post-tools, .post-subject, th.toggle { padding-right: 20px; padding-left: 5px;}
.post-body { padding-bottom: 10px; }

/* --------------------- end  inner layout module ---------------------- */



/* --------------- extra bits ------------------ */

/* --------------- common classes ----------------*/

p.user-name { text-align: left; white-space: nowrap; } 


/* --------------- forum page ----------------*/

p.moderators { margin-top: 0;}

p.description { font-size: 1.1em; }
p.moderators { font-size: 1em; }


.forum-box td p { margin: 0; padding: 0;}
.topics { vertical-align: middle; }


/* -------------------- topics ------------------- */

/* the thread is made up of a ul and li tags, with a table in each li tag */
ul.thread { margin: 0; padding: 0;}
ul.thread li { margin: 0px; }

/* ---------------- posts -------------------- */

p.user-avatar, p.user-avatar img { width: 100px; height: 100px; text-align: left;}

.poster-name { padding-top: 10px; }
.poster-name .user-name { margin: 0;}
h2.post-title { text-align: left; }

.post-number {margin-right: 10px;} 

.post-content { vertical-align: top; font-size: 12px;}

.edit-info { text-align: right; padding-bottom: 10px; font-style: italic; font-size: .9em; }

blockquote { border: 2px solid #9BC2C6; border-width: 2px 1px; background: #eee; padding: 5px; margin: 5px 0px;}


/* user section */
.user-avatar { width: 80px; height: 80px; border: 1px solid #fff;}
.avatar-block p { font-size: 10px; padding: 0; margin: 0 0 0 0 }

.date { 
opacity: .7;
filter: opacity: 70;
}




/* in-post buttons - reply, quote, edit, report, delete, etc. They can be images, or just css. */
.post-controls a.button {
padding: 1px 3px;
margin: 2px 5px;
}

.reply-tools {
padding-right: 10px;
}

.post-controls .reply, .post-controls .quote  {
float: right;
margin-top: 5px;
}

.post-controls .edit, .post-controls .delete { margin-top: 5px;}

/* reply area */
.reply-body textarea { 
color: #fff; 
border: 1px solid #C9E2E2; 
background: #fff;
}

.form-buttons-holder input {
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/searchbutton.gif) no-repeat;
height: 22px;
width: 90px;
padding: 0;
font-size: .95em; 
border: 0 ;
margin: 5px 0px 5px 0px;
}

.form-buttons-holder .quick-reply-button { width: 64px; height: 13px; }

/* ---------------------- common boxes -------------------- */

/* -------------------- .tool-box top - this holds the search box, subscription links, invite friend ------------ */

/* bread crumbs */

ul.bread-crumbs { text-align: left; font-size: 1.1em;}

ul.bread-crumbs { margin: 10px 0 0 10px; width: 80%;}
.bread-crumbs li { margin: 0 10px 0 0; }
.bread-crumbs li  { font-size: 12px; font-weight: bold;}
.bread-crumbs li.last { float: left; font-size: 1.6em; }

#forum_view .tool-box .boxbody { clear: left; }


/* search */

.search input { 
border: 0; 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/searchbox.gif) no-repeat;
width: 130px; 
height: 16px;
padding: 3px;
}

.search input.button { 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/searchbutton.gif) no-repeat;
width: 90px;
padding: 0;
height: 22px;
font-size: .95em; 
}

.search input:focus { 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/searchboxfocus.gif) no-repeat;
}

.subscription-links { margin-right: 15px; 
margin-top: 10px; }

/* --------------------- control box (on topic page and forum page) has topic pager, buttons, forum tools */

.control-box .boxbody { padding-top: 15px; }

/* ---------------------- pager module ---------------------- */
.pager-holder { margin: 0; padding: 0;}

#pager-bottom { width: auto;  margin-left: 0;  }

.pager-jump { display: none;}

.pager-list { margin-left: 10px;}

.pager {
font-size: 10px;
color: #666;
}

.pager a {
text-decoration: none;
color: #666;
}
	
.pager a:hover, .pager a:active { color: #000; }

.pager-total {
border: 1px solid #D1E4E5;
padding: 2px;
}


.pager-list span {
border: 1px solid #D1E4E5;
padding: 2px 3px;
}

.current {
background: #D1E4E5;
color: #000;
}



/* --------------- legend box ----------------- */

.legend li { margin-right: 8px; padding-left: 0}

/* -------------------- domain stats - users online, user stats, domain stats ---------------- */


.users-online, .domain-stats { border-top: 1px solid #E7F8F8; }
.users-online { padding: 5px 0px; }

ul.visitors { margin-top: 13px; color: #666; }

.active-users { padding: 0px;} /* this is to override a default */

.active-users li, .daily li.first {
	border-right: 1px solid #ccc; /* this is to override a default */
}

.daily-stats li { display: inline; margin-right: 10px; }

.total-stats li { display: inline; margin-right: 10px; }


/* -------------------- button module ---------------------- */

.new-topic-button, .reply-button { float: right;}

.forum-tools p { 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/topictools.gif) no-repeat 0 0 ; 
width: 65px; 
height: 13px;
text-indent: -1000px;
}

.recent-topic p { 
background: url(http://static.yuku.com/domainskins/bypass/img/ipop/recenttopics.gif) no-repeat 0 0 ; 
width: 77px; 
height: 25px;
text-indent: -1000px;
}

/* tool pop ups - this is used by lots of buttons */

.dropdown h3 { cursor: pointer; text-indent: -10000px; white-space: nowrap; }
.dropdown h3 span { display: none; }

.dropdown ul{ list-style: none; margin: 0; padding: 0}

.dropdown li { 
border: 1px solid #fff; 
white-space: nowrap; 
margin: 0 0 1px 0;
background: #D1E4E5;
padding: 0 8px;
}
.dropdown li a, .dropdown li input {
display: block;
padding: 2px 0px; 
font-size: 10px;
font-family: "Trebuchet MS", sans-serif;
color: #000;
width: 100%;
text-align: left;
background: #D1E4E5;
}

.dropdown li a { padding: 2px 3px}

/* this is disabled because it doesn't work in the input parts
.dropdown li a:before {
content: "» ";
}
*/

.dropdown li a { color: #000; }

.dropdown li:hover, .dropdown li a:hover, .dropdown li input:hover { background: #9AC6CE; }


/* --------------------- end button module --------------------------- */


.status img.icon-mba {
position:relative;
z-index: 40;
top: 22px;
left: 4px;
}


/* hacks for IE. */

* html #wrapper { margin-top: 20px; }
.boxheading h2, .boxheading h1 { margin: 0; }

/* copyleft, alison harrison and yuku. It's all good. If you want the original illustrator and/or photoshop files to edit, just ask! alison at ezboardcorp.com */