﻿/* This is the generic CSS Document for the Kingsbury Barn Website*/
/* this stylesheet contains styles that apply to the whole website */
/* Alison Fox */
/* March 2010 */


/***************************************/
/* Style definitions for HTML elements */
/***************************************/

html {
	background-color:#D3CCC6;
	font-size:100.01%;   /*IE Hack */
	margin-top:0;
	margin-bottom:0;
	overflow:scroll;
}



body {
	font-family: Arial, Helvetica, sans-serif;
	background-color:#D3CCC6;
	font-size:100.01%;
	text-align:center;
	height:100%;
	margin-top:0;
	margin-bottom:0;
}

p {
  font-size:0.75em;
}

a img {
  border-style:none;
}

a {
  color:black;
  text-decoration:none;
}

td {
  vertical-align:top;
}

/******************************************/
/* Style definitions for reusable classes */
/******************************************/


.skiplink {
	position:absolute;
	left:-1000px;
	width:990px;
	font-size:1px;
	line-height:1;
	color:#000000;
}

/****************************/
/*Styles for drilldown boxes*/
/****************************/

.drilldowns {
  margin-top:13px;
  
}

.drilldown-box {
  float:left;
  width:218px;
  min-height:218px;
  height:13.635em; 
  margin-right:7px;
  margin-bottom: 7px;
}

.drilldown-box-last {
  width:218px;
  height:13.635em;
  min-height: 218px;
  float:right;
  margin-bottom:7px;
}

/********************************/
/* Styles for drilldown content */
/********************************/

.drilldown-box ul, .drilldown-box-last ul {
  font-size:0.75em;
  padding-left:13px;
  margin-left:0px;
}

.drilldown-box h2, .drilldown-box-last h2 {
  margin-bottom:0px;
}

.drilldown-content-top {
  padding: 13px;
}


.image-box .drilldown-content-top {
  position:absolute;
  top:0;
  left:0;
}

.drilldown-content-bottom {
  position:absolute;
  bottom:13px;
  left:13px;
  width:192px;
  text-align:left;
}

.drilldown-content-bottom-no-margin {
  position:absolute;
  bottom:0px;
  left:0px;
}

.drilldown-content-bottom p {
  margin:0;
}

/************/
/*Box styles*/
/************/

.white-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#FFFFFF;
}

.white-box ul {
  list-style-image:url(../images/logos/bullet_white.jpg);
}

.brown-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#221006;
}

.brown-box ul {
  list-style-image:url(../images/logos/bullet_brown.jpg);
}

.v-light-grey-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#ECEBE9;
}

.med-grey-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#86786B;
}

.med-grey-box ul {
  list-style-image:url(../images/logos/bullet_med_grey.jpg);
}

.dark-grey-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#232220;
}

.olive-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#927A30;
}

.olive-box ul {
  list-style-image:url(../images/logos/bullet_olive.jpg);
}

.purple-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#573A70;
}

.purple-box ul {
  list-style-image:url(../images/logos/bullet_purple.jpg);
}

.image-box {
  position:relative;
}

/*.image-box a:hover img {
  filter: alpha(opacity=70); 
	-moz-opacity:0.7;
	-khtml-opacity: 0.7; 
	opacity: 0.7;
} */

.red-box {
  position:relative;
  width:100%;
  height:100%;
  background-color:#B10229;
}

/*******************************
/* Specific link hover styles */
/******************************/

.brown-box li a:hover {
  color: #A8A4A5;
}

.olive-box li a:hover {
  color:white;
}

.olive-box li.current a {
  color:white;
}

.med-grey-box li a:hover {
  color:white;
}

.med-grey-box li a:hover .red-text{
  color:white;
}

.purple-box li a:hover .white-text {
  color:#A8A4A5;
}

.purple-box li.white-text a:hover {
  color:#A8A4A5;
}

.purple-box .olive-text a:hover {
  color:white;
}

.brown-box a:hover {
  color:#CCC105;
}

.dark-grey-box a:hover{
  color:#A8A4A5;
}

.image-box a:hover {
  color:white;
}

.image-box .white-text a:hover {
  color:#A8A4A5;
}

.page-menu-item-purple a:hover{
  color:#A8A4A5;
}

.white-box li a:hover {
  color:#927A30;
}

.white-box li.current a {
  color:#927A30;
}

.white-box .drilldown-menu {
  color:#86786B;
}

/******************/
/* Date box styles*/
/******************/

.datebox {
  background-color: #573A70;
  width:44px;
  height:44px;
  text-align:center;
  font-size:1.25em;
}


.date-top-left{
  position:absolute;
  top:0;
  right:0;
}

.date-bottom-middle-right {
  position:absolute;
  bottom:0;
  right:174px;
}

.date-top-middle-left {
  position:absolute;
  top:0;
  left:180px;
}

.date-top-right {
  position:absolute;
  top:0;
  right:0px;
}

.month {
  font-size:12px;
  line-height: 18px;
  color: white;
}

.date {
  font-size: 16px;
  line-height:20px;
  color:#A8A4A5;
}

/******************/
/* Spacer styles */
/*****************/

.spacer-vertical-100 {
clear:both;
height:100px;
background-color:white;
}

.spacer-box {
  position:relative;
  width:100%;
  height:100%;
}

/*****************/
/* Column styles */
/*****************/

.column-218-left {
  float:left;
  width:218px;
  margin-right:7px;
}
/* We don't need the right margins if the drilldown box is inside a column */
/* Solves a problem with IE6 */
.column-218-left .drilldown-box, .column-218-right .drillldown-box {
  margin-right:0px;
}

.column-218-right {
  float:right;
  width:218px;
}



.column-442-left {
  float:left;
  width:442px;
  margin-right:7px;
}

.column-668-right {
  float:right;
  width:668px;
}

/********************/
/* Page menu styles */
/********************/

.page-menu {
  width:218px;
  margin-bottom:7px;
  
}

.page-menu-content {
  padding: 13px;
  padding-top:14px; 
  padding-bottom:14px;
  
}

.page-menu-item-purple {
  position:relative;
  border-top: 2px dotted #86786B;
  padding-top:10px;
  padding-bottom: 14px;
  background-image: url(../images/logos/bullet_purple.jpg);
  background-color: #573A70;
  background-repeat:no-repeat;
  background-position: 185px 16px;*/
}

.page-menu-item-detail a {
  display:block;
  width:100%;
  height:100%;
  text-decoration:none;
}

.page-menu-item-detail {
  width:100%;
}


/********************/
/* News box styles */
/********************/

.news-box {
  width:442px;
  margin-bottom: 14px;
  border-bottom:2px dotted #86786B;
  background-color: #ECEBE9;
}

.news-box-banner-text-image {
  position:relative;
  width:442px;
  height:218px;
  margin-bottom:8px;
}

.news-box-banner-text{
  width:224px;
  height:218px;
  background-color: #221006;
  float:left;
  color:#927A30;

}

.news-box-banner-image {
  float:right;
}

.news-box-banner-textbox {
  padding:16px;
  font-size:16px;
}

.news-box-banner-textbox .csc-default p {
  margin-top:12px;
  margin-bottom:12px;
}

.news-box-text {
  width:442px;
}

.news-box-textbox {
  padding-top:10px;
  padding-left:10px;
  padding-right:10px;
  padding-bottom:24px;
}

.news-box-textbox p {
  font-size:0.875em;
  line-height:1.375em;
}

.news-box-text .toplink {
  font-size:0.625em;
  position:absolute;
  bottom:10px;
  right:16px;
}

.page-content-box .toplink {
  width:100%;
  font-size:0.625em;
  text-align:right;
}

.news-box-textbox tbody {
  font-size: 0.875em;
}

.news-box-textbox .black-text a:hover, .news-box-textbox .default a:hover{
  color: #86786B;
}

/************************************/
/* Ordinary page content box styles */
/************************************/

.page-content-box {
  width:100%;
  margin-bottom:7px;
}

.page-content-box .v-light-grey-box
{
  border-bottom:2px dotted #86786B;
}

.page-content-textbox {
  padding-top:14px;
  padding-left:7px;
  padding-right:7px;
  padding-bottom: 14px;
}



.page-content-textbox p, .page-content-textbox li{
  font-size:0.875em;
  line-height:1.375em;
}



/******************************************************************/
/* Style definitions for specific unique items placed on the page */
/******************************************************************/

/* This style defines the page within which all the page items will be placed */
#page {	
	text-align:left;
	width:935px;
	height:100%;
	margin-top:0;
	margin-bottom:0;
	margin-left:auto;
	margin-right:auto;
	background-color: #FFFFFF;
}

/* This style defines the content area where all the page content will be placed */
#content {
	text-align:left;
	width:935px;
	position:absolute;
	top:0;
	color:#000000;
	background-color:#FFFFFF;
}

/* Styles for header area */
#header {
	margin-left:21px;
	margin-right:21px;
	height:155px;
	background-color:white;
}

#kblogo {
  position:absolute;
	top:25px;	
	left:788px;
	width:105px;
	height:105px;
	background-image: url(../images/logos/kb_logo.jpg);
	float:right;
}


/* Menu styles */
#menu {
 position: absolute;
 top:21px;
 width:1000px;
 height:20px;
 font-size:0.75em;
}

#menu ul {
  padding:0px;
  margin:0px;
}

#menu li {
  display:inline;
  list-style:none;
  float:left;
  width: auto;
  border-left:1px solid black;
  padding: 0 10px 0 10px;
  line-height:12px;
}

#menu li.first {
  border-style:none;
  padding-left:0px;
}

#menu li.current a {
  color:#B10229 ! important;
}

#menu li a {
  color:black;
  text-decoration:none;
}

#menu li a:hover {
  color:#B10229;
}



#contentarea {
  	margin-left:21px;
    margin-right:21px;
    
}

/* Banner styles */
	
#banner {
  width: 893px;
  height:319px;
}

#banner-image {
  float:left;
}

#banner-text {
  width:376px;
  height:319px;
  background-color: #221006;
  float:right;
  color:white;
}

#banner-textbox {
  padding:31px;
}

#banner-textbox h1 {
  font-size: 28px;
}

#banner-textbox h3 {
  font-size: 20px;
}





/********************************/
/* Page content sub-menu styles */
/********************************/

#page-content-sub-menu {
  padding-bottom:24px;
  padding-left:7px;
  padding-right:7px;
  font-size: 0.75em;
}

#page-content-sub-menu ul {
  padding:0px;
  margin:0px;
}

#page-content-sub-menu li {
  display:inline;
  list-style:none;
  float:left;
  width: auto;
  border-left:1px solid black;
  padding: 0 5px 0 5px;
  line-height:12px;
}

#page-content-sub-menu li.first {
  border-style:none;
  padding-left:0px;
}

#page-content-sub-menu li.current a {
  color:#927A30 ! important;
}

#page-content-sub-menu li a {
  color:black;
  text-decoration:none;
}

#page-content-sub-menu li a:hover {
  color:#927A30;
}

#page-content-sub-menu #prefix {
  float:left; 
  padding-right:5px;
  line-height:1em;
}







/**********************************/
/*Overriding TYPO3 Content Styling*/
/**********************************/

.drilldown-box .csc-default, .drilldown-box-last .csc-default {
  position:relative;
  width:100%;
  height:100%;
}

.page-content-box .csc-textpic-image img{
  padding-bottom:3px;
}

.page-content-textbox .csc-textpic-caption {
  font-size:0.65em;
  font-style:italic;
  color:#86786B;
}

.page-content-textbox .csc-textpic-text ol {
  padding-left: 21px;
}

.page-content-textbox .csc-default ul {
  padding-left:14px;
}
