/***

Customized CSS for KEC Website
setup by Andrew Chow 090123
purpose: to cascade onto the original style.css file, so to avoid touching the original css.

***/

body{
background: #ffffff;
margin: 0 0 50px 0;
}

/* body of homepage */
body.home {}

/* body of subpages */
body.page {}

#site-wrapper {
position: relative;
width: 1000px;
margin: 0 auto;
border-left: 20px solid #ffffff;
border-right: 20px solid #ffffff;
}

/* common clean up */
#head, #navbar, #top, #middle, #page, #inner, #front-popular, #footer {
margin: 0;
padding: 0;
border: 0;
border-left: 0;
border-right: 0;
width: auto;
background: none;
}

a img {
border: 0;
}

a:link {
color: #658c29;
text-decoration:none;
}
a:visited {
color:#999966;
text-decoration:none;
}
a:hover, a:active {
color: #658c29;
text-decoration:underline;
}


/* #head contains logo */
body.home #head {
position: absolute;
float: left;
right: 0;
z-index: 200;
width: 337px;
height: 108px;
}
#logo {
background: none;
width: auto;
height: auto
}

body.home #logo img {
width: 337px;
height: 106px;
}
body.home #logo a {
display: block;
width: 337px;
height: 108px;
/* background: url(../../../_images/logo-site.gif) no-repeat; */
background: url(../../../_images/homepage_logo_090519.jpg) no-repeat;

}
body.page #logo img {
width: 200px;
height: 57px;
}
body.page #logo a {
display: block;
width: 200px;
height: 57px;
background: url(../../../_images/logo-site-small.gif) no-repeat;
}

#head .ad {
display: none;
}

body.home #head {
position: absolute;
float: left;
right: 0;
z-index: 200;
width: 337px;
height: 108px;
}

body.page #head {
margin-left: 799px;
height: 57px;
}

body.home #navbar {
position: absolute;
z-index: 100;
width: 663px;
height: 55px;
-moz-opacity:.75; filter:alpha(opacity=75);
opacity: .75;
background: #000000;
}

body.page #navbar {
position: absolute;
top: 0;
width: 799px;
height: 57px;
background: #719530 url(../../../_images/page-header-bg.gif) repeat-x;
}

#page-bar {
margin: 14px 0 0 18px;
padding: 0;
border: 0;
list-style-type: none;
}
#page-bar li, #page-bar li:hover {
margin: 0 10px 0 0;
padding: 0;
border: 0;
float: left;
background: url(../../../_images/page-bar-bullet.gif) no-repeat;
}
#page-bar a, #page-bar a:visited {
color: #ffffff;
display: block;
font-weight: bold;
margin: 0;
padding: 7px 12px;
}
#page-bar a:hover {
background-color: transparent;
}

/* for chinese title on top bar
#page-bar li.page-item-757 a {
font-size: 10pt;
font-weight: normal;
padding-top: 4px;
padding-bottom: 4px;
}
*/

#searchform {
margin: 13px 0 0 0;
}
body.home #searchform {
margin-right: 18px;
}
#searchform input#s{
width: 123px;
}
#searchform input.submit {
display: none;
}

#headline {
margin: 0;
padding: 0;
width: 663px;
}

#headline div.label,
#headline div.title,
#headline div.meta,
#headline div.excerpt,
#headline div.more-link {
display: none;
}

#headline #keyvisual img {
width: 663px;
height: 480px;
}

#headline a img {
margin: 0;
border: 0;
}

#top {}

#featured {
margin-top: 128px;
width: 327px;
height: 276px;
background: #e9eddf url(../../../_images/featured-bg.gif) repeat-x;
overflow: hidden;
}
div.arthemia-carousel {}
#featured div.nav-buttons {
text-align: center;
height: 15px;
padding: 8px 0 0 0;
}

/**/
#featured div.label {
display: none;
}

#featured a, #featured a:link, #featured a:visit { color: inherit; }
#featured a img { margin-top: 0; }
#featured ul a { margin-top: 5px; }
#featured ul a.no-image { background-repeat: no-repeat; background-position: 2px 2px; }
#featured ul a.no-image.cat-3 { background-image: url('../../../_images/featured-cat-logos.jpg'); }
#featured ul a.no-image.cat-4 { background-image: url('../../../_images/featured-cat-kosmos.jpg'); }
#featured ul a.no-image.cat-5 { background-image: url('../../../_images/featured-cat-karpos.jpg'); }
#featured ul a.no-image.cat-6 { background-image: url('../../../_images/featured-cat-koinonia.jpg'); }
#featured ul a.no-image.cat-14 { background-image: url('../../../_images/featured-cat-ecclesia.jpg'); }

#featured .arthemia-carousel {
width:290px;
margin-left: 17px;
}

/* features title color */
/*koinonia: div#featured a.title.cat-6 { color: #7A7E03; }*/
/*logos:    div#featured a.title.cat-3 { color: #7A1C1D; }*/
/*karpos:   div#featured a.title.cat-5 { color: #CBCB6B; }*/
/*kosmos:   div#featured a.title.cat-4 { color: #CF9831; }*/
/*ecclesia: div#featured a.title.cat-14 { color: #2F9B9B; }*/


div#shortcuts {}
div#shortcuts div.rss {
width: 135px;
height: 61px;
float: left;
padding: 15px 0 0 0;
text-align: center;
}
div#shortcuts div.donate {
width: 190px;
height: 66px;
float: left;
padding: 10px 0 0 0;
text-align: center;
}

#middle {
border-top: 1px solid #ffffff;
background: url(../../../_images/site-menu-border.gif) repeat-x 0 100%;
}

#middle div.category {
width: 199px;
height: 54px;
margin: 0 1px 0 0;
padding: 14px 0;
text-align: center;
}
.category {
background: none;
}
/*
#middle div.category.active {
background: #e6e6e6;
}
*/
#middle div.category span.cat_title {
text-transform: uppercase;
font-size: 19pt;
font-weight: bold;
color: #000000;
}
#middle div.category p.cat_subtitle {
font-size: 14pt;
}
#middle div.category.active p.cat_subtitle {
color: #ffffff;
}


div#editor-pick {
margin: 0 0 10px 0;
}
/* editor-pick bar color */
/*koinonia*/ #cat-6  { border-top: 8px solid #7A7E03; } #cat-6.active  { background: url(../../../_images/menu-cat-bg-6.gif) repeat-x; }
/*logos*/    #cat-3  { border-top: 8px solid #7A1C1D; } #cat-3.active  { background: url(../../../_images/menu-cat-bg-3.gif) repeat-x; }
/*karpos*/   #cat-5  { border-top: 8px solid #CBCB6B; } #cat-5.active  { background: url(../../../_images/menu-cat-bg-5.gif) repeat-x; }
/*kosmos*/   #cat-4  { border-top: 8px solid #CF9831; } #cat-4.active  { background: url(../../../_images/menu-cat-bg-4.gif) repeat-x; }
/*ecclesia*/ #cat-14 { border-top: 8px solid #2F9B9B; } #cat-14.active { background: url(../../../_images/menu-cat-bg-14.gif) repeat-x; }

/* editor-pick subtitle color */
/*koinonia*/ #cat-6 p.cat_subtitle  { color: #7A7E03; }
/*logos*/    #cat-3 p.cat_subtitle  { color: #7A1C1D; }
/*karpos*/   #cat-5 p.cat_subtitle  { color: #CBCB6B; }
/*kosmos*/   #cat-4 p.cat_subtitle  { color: #CF9831; }
/*ecclesia*/ #cat-14 p.cat_subtitle { color: #2F9B9B; }



div#editor-pick div.editor-pick-inner {
float: left;
width: 326px;
margin-right: 7px;
}

div#editor-pick div.editor-pick-inner div.excerpt-picture {
width: 326px;
height: 243px;
}
div#editor-pick div.editor-pick-inner div.excerpt-picture img {
width: 326px;
height: 243px;
}
div#editor-pick div.editor-pick-inner div.title {
height: 39px;
overflow: hidden;
padding: 7px 5px 0 20px;
}
div#editor-pick div.editor-pick-inner div.title a {
color: #ffffff;
font-size: 12pt;
display: block;
background: url(../../../_images/editor-pick-bullet.gif) 0 2px no-repeat;
padding: 0 0 0 20px;
}
div#editor-pick div.editor-pick-inner div.excerpt {
margin: 10px 10px 0 42px;
}
div#editor-pick div.editor-pick-inner div.excerpt p {
margin: 0 0 10px 0;
}

/* editor's pick title bar color */
div#editor-pick div.title { background: #7A7E03 url(../../../_images/editor-pick-bar-corner.gif) 0 26px no-repeat; }
/*koinonia*/ div#editor-pick div.title.cat-6 { background-color: #7A7E03; }
/*logos*/    div#editor-pick div.title.cat-3 { background-color: #7A1C1D; }
/*karpos*/   div#editor-pick div.title.cat-5 { background-color: #CBCB6B; }
/*kosmos*/   div#editor-pick div.title.cat-4 { background-color: #CF9831; }
/*ecclesia*/ div#editor-pick div.title.cat-14 { background-color: #2F9B9B; }

div#page {
margin: 0 0 10px 0;
}
div#page div.column-alpha {
float: left;
width: 662px;
}
div#page div.column-beta {
margin-left: 672px;
background: #000000;
height: 568px;
color: #ffffff;
padding: 10px;
}

div#page div#content {
width: 660px;
border: 0;
}
div#page div#sidebar {
font-size: 9pt;
margin-bottom: 10px;
}

div#attention {
margin: 0 0 0 30px;
}
div#attention div.title {
margin: 0 0 10px 35px;
}
div#attention div.attention-inner {
margin: 0 0 10px 0;
}
div#attention div.attention-inner div.title {
margin: 0;
}
div#attention div.attention-inner div.title a {
color: #ffffff;
}


div#watch {
position: relative;
background: #cccccc url(../../../_images/watch-bg.gif) repeat-x;
height: 320px;
padding: 0 0 10px 100px;
margin: 0 0 8px 0;
}
div#watch div.title-icon {
position: absolute;
top: 0;
left: 22px;
width: 60px;
height: 85px;
background: url(../../../_images/icon-watch.png) no-repeat;
}
div#watch div.more-link {
margin: 0;
}
div#watch div.more-link a {
position: absolute;
bottom: 10px;
right: 15px;
display: block;
width: 94px;
height: 28px;
background: url(../../../_images/button-more-watch.png) no-repeat;
}

div#watch #player_container {
margin: 0 0 3px 0;
}
div#watch #player_title_link {
font-size: 11pt;
font-weight: bold;
}


div#watch div.watch-inner-embed {
float: left;
width: 280px;
margin: 3px 0 0 0;
}
div#watch div.watch-inner-embed embed {}
div#watch div#watch-thumbnail-container {
margin-left: 220px;
}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail {
float: left;
width: 120px;
height: 137px;
margin: 0 0 0 3px;
white-space: nowrap;
overflow: hidden;
}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail a.post_link.first {
line-height: 14px;
}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail a.post_link.second,
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail a.watch_link {
font-size: 8pt;
}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail a.watch_link {
color: #658c29;
}

div#watch div#watch-thumbnail-container div#watch-1 {}
div#watch div#watch-thumbnail-container div#watch-2 {}
div#watch div#watch-thumbnail-container div#watch-3 {}
div#watch div#watch-thumbnail-container div#watch-4 {}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail {
padding: 3px 5px 5px 5px;
}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail.active {
background: #999966;
}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail.active a {
color: #ffffff;
}
div#watch div#watch-thumbnail-container div.watch-inner-thumbnail img {
display: block;
margin: 0 0 3px 0;
}

div#watch div.watch-thumbnail-with-button {
position: relative;
}
div#watch div.watch-thumbnail-with-button div.video-play-button-small {
position: absolute;
top: 34px;
left: 43px;
width: 31px;
height: 26px;
background: url(../../../_images/video_badge_small.png) no-repeat;
}


div#watch div.deco,
div#listen div.deco {
position: absolute;
width: 20px;
height: 20px;
left: 0;
bottom: 0;
background: url(../../../_images/deco-section-corner.gif) no-repeat;
}


div#listen {
position: relative;
background: #cccccc url(../../../_images/watch-bg.gif) repeat-x;
height: 210px;
padding: 20px 0 20px 100px;
margin: 0;
}
div#listen div.title-icon {
position: absolute;
top: 15px;
left: 25px;
width: 60px;
height: 85px;
background: url(../../../_images/icon-listen.png) no-repeat;
}
div#listen div.more-link {
margin: 0;
}
div#listen div.more-link a {
position: absolute;
bottom: 10px;
right: 15px;
display: block;
width: 94px;
height: 28px;
background: url(../../../_images/button-more-listen.png) no-repeat;
}

div#listen div.row {
clear: both;
margin: 0 0 15px 0;
}
div#listen br.clear-for-ie {
display: none;
}
div#listen br.clear-for-ie, {
display: block;
}
div#listen div.listen-inner {
float: left;
width: 265px;
margin: 0 10px 0 0;
}
a.mp3_link {
display: block;
padding: 25px 0 10px 70px;
background: #eeeebb url(../../../_images/icon-listen.png) no-repeat 15px 10px;
margin: 10px 0;
height: 45px;
font-size: 15pt;
}


div#common-body {
clear: both;
}

div#footer {
position: relative;
padding: 15px 0 15px 40px;
background: #eeeeee;
color: #333333;
border-left: 0;
border-right: 0;
font-size: 9pt;
}

div#footer div.title {
margin: 0 0 5px 0;
color: #000000;
font-size: 10pt;
font-weight: bold;
}

div#footer div#aboutus {}
div#footer div#copyright {
position: absolute;
bottom: 0;
margin-bottom: 20px;
width: 260px;
font-size: 8pt;
color: #999999;
}
div#footer div#footer-navigation {
margin: 0 0 10px 0;
}
div#footer div#contactinfo {}
div#footer div#simple-hit-counter {
position: absolute;
bottom: 15px;
left: 680px;
font-size: 10pt;
color: #333333;
}

div#footer div.column-alpha,
div#footer div.column-beta,
div#footer div.column-gamma {
width: 280px;
float: left;
padding: 0 20px 0 20px;
}

div#footer div.column-alpha {
padding: 0 20px 0 0;
}
div#footer div.column-beta {
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
}
div#footer div.column-gamma {
width: 260px;
padding: 0 0 0 20px;
}


/* overwrite style.css */
#recentpost ul li a, #mostcommented ul li a, #recent_comments ul li a {
display: inline;
padding: 0;
text-decoration: none;
}
#recentpost ul li a:hover, #mostcommented ul li a:hover, #recent_comments ul li a:hover {
background: none;
color: #658c29;
text-decoration: underline;
}


div#recentpost,
div#mostcommented,
div#recent_comments {
margin: 0;
padding: 0;
border-right: 0;
float: none;
width: auto;
}
div#recentpost h3,
div#mostcommented h3,
div#recent_comments h3 {
color: #000000;
font-size: 10pt;
margin: 0 0 5px 0;
}
div#recentpost ul,
div#mostcommented ul,
div#recent_comments ul {
list-style-type: none;
margin: 0 0 5px 0;
padding: 0;
border: 0;
}
div#recentpost ul li,
div#mostcommented ul li,
div#recent_comments ul li {
margin: 0 0 5px 0;
padding: 0;
border: 0;
background: none;
}
div#recentpost ul li a,
div#mostcommented ul li a,
div#recent_comments ul li a {
margin: 0;
padding: 0;
border: 0;
display: inline;
color: #666666;
}


/****************/
/* CONTENT PAGE */
/****************/
#map {
font-size: 10pt;
font-weight: bold;
}
#content {
border-top: 0;
padding: 10px 0 0 0;
}
#content h2.title {
margin: 5px 0 0 0;
padding: 0;
border-top: 0;
border-bottom: 0;
color: #B8862D;
}
#stats {
margin: 0;
padding: 0;
border-top: 0;
border-bottom: 0;
font-weight: normal;
color: #999999;
}
div.entry {}
/* to overwrite style.css */
.post .clearfloat {
border-bottom: 0;
}

div.post p {
margin: 0;
}

p#comment-usable-tags {
display: none;
}
p#comment-gravatar {
display: none;
}


/* VERSIONING FOR <p> SPACING, cos the imported post from blogspot.com need old formating */
div.post.year-2007 div.entry p,
div.post.year-2008.month-02 div.entry p,
div.post.year-2008.month-03 div.entry p,
div.post.year-2008.month-04 div.entry p,
div.post.year-2008.month-05 div.entry p {
	margin: 15px 0 0;
}


#sidebar {
margin: 15px 0 0 0;
width: 328px;
/* background: #eeeeee url(../../../_images/sidebar-bg.gif) repeat-x; */
}
#sidebar h3 {
background: url(../../../_images/sidebar-title-bg.gif) repeat-x;
color: #ffffff;
font-size: 12pt;
margin: 10px 0 5px 0;
}
#sidebar li {
background: none;
border-bottom: none;
}
#sidebar a.ara_ca_year_handle {
font-weight: bold;
}
#sidebar-top, #sidebar-middle, #sidebar-bottom, #sidebar-left, #sidebar-right {
border-top: 0;
background: none;
padding: 0;
margin: 0;
}
#sidebar-left, #sidebar-right {
width: 157px;
}
#sidebar-middle {
width: 328px;
}
#sidebar-middle h3 {
margin-top: 0;
}
#sidebar-bottom {
margin: 10px 0 0 0;
width: 328px;
}
#sidebar-top {
display: none;
}


body.cat-3 #comments {
display: none;
}
body.cat-3 #stats span.right {
display: none;
}

span#map {
font-size: 10pt;
}

/****************/
/* LISTEN POPUP */
/****************/

body#listen-popup {
	margin: 10px;
	font-size: 10pt;
}

#listen_popup_player { margin: 10px 0; }
#listen_popup_player iframe {}



/****************/
/* KARPOS POST  */
/****************/

div.karpos-post {}
div.karpos-post div.banner {
	color: #ffffff;
	width: 500px;
	height: 133px;
	background: url('/_images/karpos-post-banner.gif') no-repeat;
}
div.karpos-post div.banner img {
	border: 0;
}
div.karpos-post h2 {
	margin: 1em 0 0.2em 0;
	font-weight: bold;
	font-size: 18px;
	color: rgb(0, 148, 69);
}
div.karpos-post h3 {
	margin: 0;
	font-weight: normal;
	font-size: inherit;
	color: rgb(0, 148, 69);
}
div.karpos-post p {
	margin: 0 0 1em 0;
	line-height: 1.5em;
}

