/**********************************************************************************************************************
 * Default Styles for Central Html Elements
 */
* html body { margin:0; overflow-y:hidden; padding:0; }

body {
	font-size: 12px;
	font-family: "Lucida Sans", Verdana, Arial, sans-serif;
	color: #363636;
	margin: 0;
	padding: 0;
	background-image: url(../img/layout/headerBg.png);
	background-repeat: repeat-x;
	background-position: top;
	background-color: #E7E7E7;
}

body.inIFrame {
	background-image: none;
	background-color: #FFFFFF;
}

body.facebook {
	background-image: none;
	background-color: #FFFFFF;
	color: #333333;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
}

textarea {
	font-size: 12px;
}

a,a:visited {
	color: #0ec40a;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
	color: #0ec40a;
}

body.facebook a,a:visited {
	color: #385495;
}

body.facebook a:hover {
	color: #385495;
}

img {
	border: none;
}

input.text {
	border-width: 1px;
	border-style: solid;
	border-color: #C0C0C0;
	background-color: #FFFFFF;
}

table {
	border-collapse: collapse;
	border-width: 0;
	padding: 0;
	border-spacing: 0;
}

form {
	padding: 0;
	margin: 0;
}

img.borderBlack {
	border: 1px solid #CCCCCC;
}

#wrapper {
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	width: 880px;
}

body.facebook #wrapper {
	width: 728px; /* 758 for fb width - 20 for horicontal scrollbar - 10 for margin */
}

body.normal #globalStatusDiv {
	position: fixed;
	top: 0;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	left: 50%; 
	width: 100px;
	margin-left: -50px; 
	height: 21px;
	background: url(../img/mainLoadingBg.gif) no-repeat;
	padding: 2px 15px 2px 10px;
	color: #494949;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	z-index: 10000;
}

body.facebook #globalStatusDiv {
	position: fixed;
	top: 0;
	right: 0;
	background-color: #627AAD;
	border: 1px solid #1D4088;
	color: #ffffff;
	text-align: center;
	font-weight: bold;
	padding-top: 5px;
	height: 25px;
	width: 100px;
	z-index: 10000;
}

div.roundCorners {
	position: relative;
}
div.roundCorners div.roundCornerTR {
	postion: relative;
	background: url(../img/layout/roundCorner-tr.png) no-repeat;
	top: 0;
	right: 0;
	width: 6px;
	height: 6px;
	position:absolute;
}
div.roundCorners div.roundCornerTL {
	postion: relative;
	background: url(../img/layout/roundCorner-tl.png) no-repeat;
	top: 0;
	left: 0;
	width: 6px;
	height: 6px;
	position:absolute;
}
div.roundCorners div.roundCornerBR {
	postion: relative;
	background: url(../img/layout/roundCorner-br.png) no-repeat;
	bottom: 0;
	right: 0;
	width: 6px;
	height: 6px;
	position:absolute;
}
div.roundCorners div.roundCornerBL {
	postion: relative;
	background: url(../img/layout/roundCorner-bl.png) no-repeat;
	bottom: 0;
	left: 0;
	width: 6px;
	height: 6px;
	position:absolute;
}


/**********************************************************************************************************************
 * layout
 */

#contentTopSpace {
	display: block;
	background: url(../img/layout/content-green.png) center;
	background-repeat: repeat-y;
	height: 20px;
}

body.facebook #contentTopSpace {
	display: none;
}

#content {
	background: url(../img/layout/content-gray.png) center;
	background-repeat: repeat-y;
	min-height: 400px;
	padding-top: 10px;
}

body.facebook #content {
	background-image: none;
}



/**********************************************************************************************************************
 * footer
 */

#footer {
	background: url(../img/layout/bottom.png) center;
	background-repeat: no-repeat;
	background-position: top;
	height: 50px;
	padding-top: 10px;
}

body.facebook #footer {
	background-image: none;
	bottom: 0px;
	position: fixed;
	height: 20px;
	width: 100%;
	background-color: #ffffff;
}

#footer div {
	margin-left: auto;
	margin-right: auto;
	padding-top: 3px;
	padding-left: 40px;
	text-align: center;
	font-size: 10px;
}

#footer form {
	margin: 0;
}

#footer span {
	padding: 0 10px;
	padding-top: 10px;
}

#revision {
	clear: both;
	position: absolute;
	right: 0;
	bottom: 0;
	color: #C0C0C0;
}



/* error message popup ---------------------------------------------------------------------------------------------- */
#errMsgPopup {
	position: absolute;
	display: none;
	top: 200px;
	left: 50%;
	margin-left: -150px;
	background-color: #3EDA1D;
	z-index: 10000;
	width: 300px;
	border: 1px solid #000000;
	padding: 10px;
}

#errMsgPopup input.button {
	padding-left: 20px;
	padding-right: 20px;
}

#errMsgText {
	color: #FFFFFF;	
}


/**********************************************************************************************************************
 * menu 
 */

#headerSpacer {
	height: 15px;
}

body.facebook #headerSpacer {
	display: none;
}

#header {
	height: 127px;
	position: relative;
}

#header.headerBg {
	background: url(../img/layout/header.png) center;
	background-repeat: no-repeat;
}

#header.headerBgEn {
	background: url(../img/layout/header-en.png) center;
	background-repeat: no-repeat;
}

#headerPublic {
	margin-top: 15px;
	height: 127px;
	position: relative;
}

#headerPublic.headerBg {
	background: url(../img/layout/header-public.png) center;
	background-repeat: no-repeat;	
}

#headerPublic.headerBgEn {
	background: url(../img/layout/header-public-en.png) center;
	background-repeat: no-repeat;
}

#headerOWHomeLink {
	position: absolute;
	top: 30px;
	left: 52px;
	height: 30px;
	width: 150px;
}

#headerMenuFacebook li {
	background-color:	#3B5998;
	font-weight: bold;
}

#headerMenuFacebook a {
	color: #ffffff;
}

#headerMenuFacebook li li {
	background-color:	#627AAD;
}

#headerMenuFacebookContainer {
	position: fixed;
	top: 0;
	width: 100%;
	height: 40px;
	background-color: #ffffff;
}


/**********************************************************************************************************************
 * header menu public (user not logged in)
 */
#headerMenuPublic {
	height: 23px;
	position: relative;
}

#headerMenuPublic ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
}

#headerMenuPublic ul.de {
	margin-left: 463px;	
}

#headerMenuPublic ul.en {
	margin-left: 445px;
}

#headerMenuPublic li {
	float: left;
	margin: 0;
	padding: 0;
}

#headerMenuPublic ul a, #headerMenuPublic ul a:visited {
	border: none;
	display: block;
	height: 18px;
	background-repeat: no-repeat;
	background-position: 0px 2px;
}

#headerMenuPublic ul a:hover {
	
}

#headerMenuPublic ul a.startPage {
	width: 81px;
}

#headerMenuPublic ul a.startPage:hover {
	background-image: url(../img/layout/menu-public-startseite-over.png);
}

#headerMenuPublic ul a.startPageSelected {
	width: 81px;
	background-image: url(../img/layout/menu-public-startseite-over.png);
}

#headerMenuPublic ul a.startPageEn {
	width: 81px;
}

#headerMenuPublic ul a.startPageEn:hover {
	background-image: url(../img/layout/menu-public-startpage-over.png);
}

#headerMenuPublic ul a.startPageSelectedEn {
	width: 81px;
	background-image: url(../img/layout/menu-public-startpage-over.png);
}

#headerMenuPublic ul a.registerUser {
	width: 99px;
}

#headerMenuPublic ul a.registerUser:hover {
	background-image: url(../img/layout/menu-public-registrieren-over.png);
}

#headerMenuPublic ul a.registerUserSelected {
	width: 99px;
	background-image: url(../img/layout/menu-public-registrieren-over.png);
}

#headerMenuPublic ul a.registerUserEn {
	width: 115px;
}

#headerMenuPublic ul a.registerUserEn:hover {
	background-image: url(../img/layout/menu-public-createAccount-over.png);
}

#headerMenuPublic ul a.registerUserSelectedEn {
	width: 115px;
	background-image: url(../img/layout/menu-public-createAccount-over.png);
}

#headerMenuPublic ul a.tour, #headerMenuPublic ul a.tourEn {
	width: 50px;
}

#headerMenuPublic ul a.tour:hover, #headerMenuPublic ul a.tourEn:hover {
	background-image: url(../img/layout/menu-public-tour-over.png);
}

#headerMenuPublic ul a.tourSelected, #headerMenuPublic ul a.tourSelectedEn {
	width: 50px;
	background-image: url(../img/layout/menu-public-tour-over.png);
}

#headerMenuPublic ul a.faq, #headerMenuPublic ul a.faqEn {
	width: 53px;
}

#headerMenuPublic ul a.faq:hover, #headerMenuPublic ul a.faqEn:hover {
	background-image: url(../img/layout/menu-public-faq-over.png);
}

#headerMenuPublic ul a.faqSelected, #headerMenuPublic ul a.faqSelectedEn {
	width: 53px;
	background-image: url(../img/layout/menu-public-faq-over.png);
}

#headerMenuPublic ul a.feedback, #headerMenuPublic ul a.feedbackEn {
	width: 81px;
}

#headerMenuPublic ul a.feedback:hover, #headerMenuPublic ul a.feedbackEn:hover {
	background-image: url(../img/layout/menu-public-feedback-over.png);
}

#headerMenuPublic ul a.feedbackSelected, #headerMenuPublic ul a.feedbackSelectedEn {
	width: 81px;
	background-image: url(../img/layout/menu-public-feedback-over.png);
}



/**********************************************************************************************************************
 * header menu non public (user is logged in)
 */
#headerMenu {
	height: 23px;
	position: relative;
}

#headerMenu ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
}

#headerMenu ul.de {
	margin-left: 423px;	
}

#headerMenu ul.en {
	margin-left: 482px;
}

#headerMenu li {
	float: left;
	margin: 0;
	padding: 0;
}

#headerMenu ul a, #headerMenu ul a:visited {
	border: none;
	display: block;
	height: 18px;
	background-repeat: no-repeat;
	background-position: 0px 1px; 
}

#headerMenu ul a:hover {
	
}

#headerMenu ul a.myPage {
	width: 98px;
}

#headerMenu ul a.myPage:hover {
	background-image: url(../img/layout/menu-meine-seite-over.png);
}

#headerMenu ul a.myPageSelected {
	width: 98px;
	background-image: url(../img/layout/menu-meine-seite-over.png);
}

#headerMenu ul a.myPageEn {
	width: 78px;
}

#headerMenu ul a.myPageEn:hover {
	background-image: url(../img/layout/menu-my-page-over.png);
}

#headerMenu ul a.myPageSelectedEn {
	width: 78px;
	background-image: url(../img/layout/menu-my-page-over.png);
}

#headerMenu ul a.friends {
	width: 77px;
}

#headerMenu ul a.friends:hover,a.friendsSelected {
	background-image: url(../img/layout/menu-freunde-over.png);
}

#headerMenu ul a.friendsSelected {
	width: 77px;
	background-image: url(../img/layout/menu-freunde-over.png);
}

#headerMenu ul a.friendsEn {
	width: 69px;
}

#headerMenu ul a.friendsEn:hover,a.friendsSelectedEn {
	background-image: url(../img/layout/menu-friends-over.png);
}

#headerMenu ul a.friendsSelectedEn {
	width: 69px;
	background-image: url(../img/layout/menu-friends-over.png);
}

#headerMenu ul a.reminder {
	width: 110px;
}

#headerMenu ul a.reminder:hover {
	background-image: url(../img/layout/menu-erinnerungen-over.png);
}

#headerMenu ul a.reminderSelected {
	width: 110px;
	background-image: url(../img/layout/menu-erinnerungen-over.png);
}

#headerMenu ul a.reminderEn {
	width: 92px;
}

#headerMenu ul a.reminderEn:hover {
	background-image: url(../img/layout/menu-reminders-over.png);
}

#headerMenu ul a.reminderSelectedEn {
	width: 92px;
	background-image: url(../img/layout/menu-reminders-over.png);
}

#headerMenu ul a.presents {
	width: 90px;
}

#headerMenu ul a.presents:hover {
	background-image: url(../img/layout/menu-geschenke-over.png);
	background-position: -2px 1px;
}

#headerMenu ul a.presentsSelected {
	width: 90px;
	background-image: url(../img/layout/menu-geschenke-over.png);
	background-position: -2px 1px;
}

#headerMenu ul a.presentsEn {
	width: 78px;
}

#headerMenu ul a.presentsEn:hover {
	background-image: url(../img/layout/menu-presents-over.png);
}

#headerMenu ul a.presentsSelectedEn {
	width: 78px;
	background-image: url(../img/layout/menu-presents-over.png);
}



/**********************************************************************************************************************
 * Main Title
 */
#headerTitle {
	position: relativ;
	height: 120px;
}

#headerContent {
	position: absolute;
	top: 84px;
	padding-left: 48px;
}

#headerTitle {
	padding-left: 55px;
	height: 20px;
	font-size: 18px;
	color: #DAF6D9;
}

.headerTitlePaddingTop {
	padding-top: 50px;
}

.headerTitlePaddingTopPublic {
	padding-top: 50px;
}

#headerSubTitle {
	padding-left: 57px;
	padding-top: 5px;
	font-size: 14px;
	color: #D5EDCB;
}

/**********************************************************************************************************************
 * Content Layout
 */
#contentTableContent {
	background-color: #FFFFFF;
	vertical-align: top;
}

/**
 * Content table without submenu
 */
#contentBodyFull {
	margin-right: 50px;
	margin-left: 50px;
	background-color: #FFF;
}

#contentBodyFacebook {
	margin-top: 45px;
	margin-right: 0px;
	margin-left: 0px;
}

/**
 * Content table with submenu
 */
#contentBody {
	margin-right: 220px;
	margin-left: 50px;
	background-color: #FFF;
}

body.facebook #contentBody {
	margin-left: 0px;
}

/**
 * Content table right column - submenu
 */
#contentRight {
	width: 180px;
	float: right;
	position: relative;
	margin-right: 15px;
}

body.facebook #contentRight {
	margin-right: 0px;
}

/**********************************************************************************************************************
 * Sub menus
 */
#submenu {
	width: 156px;
}

.submenu-2lines {
	background: url(../img/layout/submenu-2lines.png) no-repeat scroll
		center top;
	height: 70px;
}

.submenu-3lines {
	background: url(../img/layout/submenu-3lines.png) no-repeat scroll
		center top;
	height: 94px;
}

.submenu-4lines {
	background: url(../img/layout/submenu-4lines.png) no-repeat scroll
		center top;
	height: 142px;
}

.submenu-5lines {
	background: url(../img/layout/submenu-5lines.jpg) no-repeat scroll
		center top;
	height: 145px;
}

#submenu ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	margin: 0;
	padding: 8px;
}

#submenu li {
	height: 25px;
}

#submenu .current {
	font-weight: bold;
}

#submenu a,#submenu a:visited {
	text-decoration: none;
	color: #454545;
}

#submenu a:hover {
	color: #AAAAAA;
}

/**********************************************************************************************************************
 * Progress Bar
 */
.progressBar {
	padding-top: 5px;
}

.progressBarBox {
	height: 10px;
	border: 1px inset;
	background-color: #EEEEEE;
}

.progressBarBoxContent {
	width: 0;
	height: 10px;
	border-right: 1px solid #444;
	background-color: #2DDB17;
}

/**********************************************************************************************************************
 * Panel (Non-Popup)
 */
.panel {
	
}

.panel-headline {
	height: 30px;
}

.panel-body {
	height: 100%;
}

.panel-tl {
	background: url(../img/layout/panel-tl.jpg) 0 0 no-repeat;
}

.panel-tm {
	background: url(../img/layout/panel-tm.jpg) 0 0 repeat-x;
}

.panel-tr {
	background: url(../img/layout/panel-tr.jpg) 100% 0 no-repeat;
	padding: 7px 12px 16px 12px;
}

.panel-l {
	background: url(../img/layout/panel-l.jpg) 0 0 repeat-y;
}

.panel-r {
	background: url(../img/layout/panel-r.jpg) 100% 0 repeat-y;
}

.panel-bl {
	background: url(../img/layout/panel-bl.jpg) 0 100% no-repeat;
}

.panel-bm {
	background: url(../img/layout/panel-bm.jpg) 0 100% repeat-x;
}

.panel-br {
	background: url(../img/layout/panel-br.jpg) 100% 100% no-repeat;
}

/**********************************************************************************************************************
 * Modal Panel
 */
.mpHeader {
	color: #494949;
	font-weight: bold;
	font-size: 14px;
	border-bottom: 1px solid #50E621;
	padding: 5px 7px 0 5px;
}

.mpBody {
	padding: 5px;
	vertical-align: top;
}

.mpCloseImage {
	cursor: hand;
	cursor: pointer;
	margin-left: 3px;
}


/**********************************************************************************************************************
 * Tag cloud classes
 */
 
.cloudDiv {
}

.tag0 { font-size: 0.8em; }
.tag1 { font-size: 0.9em; }
.tag2 { font-size: 1.0em; }
.tag3 { font-size: 1.1em; }
.tag4 { font-size: 1.2em; }
.tag5 { font-size: 1.3em; }
.tag6 { font-size: 1.4em; }
.tag7 { font-size: 1.5em; }
.tag8 { font-size: 1.6em; }
.tag9 { font-size: 1.7em; }


/**********************************************************************************************************************
 * news
 */

.news {
	font-size: 8px;
	width: 100%;
}
.news td:first-child {
	margin-right: 5px;
	width: 1%;
}

/**********************************************************************************************************************
 * General Styles for Re-Use
 */
.defaultText {
	line-height: 22px;
	text-align: justify;
}

.mouseOverBGColor {
	background-color: #B3FFA0;
}

.mouseOutBGColor {
	background-color: #FFFFFF;
}

.hidden {
	display: none;
}

.iconLink {
	cursor: hand;
	cursor: pointer;
}

.divBoxHeader {
	background-color: #6EE94C;
	color: #FFFFFF;
}

.loadingImgDiv {
	
}

.disabledText {
	color: #CCC;
}

.looseHeadline {
	padding-bottom: 5px;
}

.looseHeadlineInnerDiv {
	color: #494949;
	font-weight: bold;
	font-size: 14px;
	border-bottom: 1px solid #50E621;
}

.infoText {
	font-size: 10px;
	color: #999999;
}

.rowOdd {
	background-color: #F1F1F1;
}

.selectedTag {
	background-color: #FFFF75;
}

.tooltip {
	border: 1px solid #6EE94C;
	background-color: #DEFCD7;
	padding: 2px;
	font-size: 10px;
	line-height: 15px;
	display: none;
	z-index: 1200;
}

.textWithTooltip {
	color: #0ec40a;
	vertical-align:middle;
}

/**
 * Default form class - will be used in every formRegion component if no other class is given.
 */
.formRegion {
	
}

/*
.formRegion td {
	vertical-align: top;
}
*/

.formMessages {
	background-color: #9FDC8E;
	padding: 7px 10px;
	border-width: 0px;
	margin-bottom: 5px;
}

.formAjaxProcess {
	background-color: #9FDC8E;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
	margin-bottom: 10px;
}

.formRowButtons {
	bottom: 10px;
	right: 10px;
	float: right;
}

.formRowButtonsInPopup {
	position: absolute;
	bottom: 10px;
	right: 10px;
	float: right;
}

.formLabel {
	text-align: right;
	padding-right: 5px;
}

.formRowButtons .graphicButton {
	float: left;
}

.errorLabel,.errorText {
	color: red;
}

.errorInput {
	border-width: 1px;
	border-style: solid;
	border-color: red;
	background-color: #FFD7C8;
}

.birthdayInput {
	width: 90px;
}



/**********************************************************************************************************************
 * Rich Faces component styles
 */
.dataScrollerTable {
	background-color: #DEFCD7;
	color: #363636;
	border-collapse: separate;
}

.dataScrollerTable td {
	text-align: center;
}

.rich-datascr-act {
	background-color: #6EE94C;
	color: #363636;
}

.rich-datascr-inact {
	background-color: #DEFCD7;
	color: #363636;
}

.rich-datascr-button {
	background-color: #DEFCD7;
	color: #363636;
}



/**********************************************************************************************************************
 * Development Tools
 */
.devToolsButton {
	position: absolute;
	border: 1px solid black;
	background-color: #707070;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 10px;
	bottom: 10px;
}

.devToolsButton a {
	color: #C0C0C0;
}

.devToolsButton a:hover {
	color: #FFFFFF;
}



/**********************************************************************************************************************
 **********************************************************************************************************************
 * Screen Specific Styles
 -v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---v---*/
 
 
/**********************************************************************************************************************
 * StartPage about OpenWishes (index.xhtml)
 */
#titleAboutTeaser {
	width: 100%;
	margin-bottom: 10px;
}

#startPageTagBDayTable{
	width: 100%;
}

#startPageTagBDayTable td {
	vertical-align: top;
}

#startPageWishesTagCloud {
	text-align: justify;
}

#startPageNextBirthdays {
}

#latestWishesPanelStartPage {
	width: 100%
}

#latestWishesCarousel {
	width: 100%;
	height: 120px;
	position: relative;
	display: block;
	overflow: hidden;
}

.caraouselImg {
	margin: auto;
}

#latestWishesCarouselNavLeft {
	left: 5px;
}

#latestWishesCarouselNavRight {
	right: 5px;
}

.latestWishesCarouselNav {
	position: absolute;
	height: 92px;
	z-index: 10;
	background-color: #FFF;
}

.latestWishesCarouselNavEnabled {
	cursor: pointer;
	cursor: hand;
}

.latestWishesCarouselNavDisabled {
	
}

#latestWishesCarouselNavLeft table,#latestWishesCarouselNavRight table {
	width: 100%;
	height: 100%;
}

#latestWishesCarouselNavLeft td,#latestWishesCarouselNavRight td {
	text-align: center;
	vertical-align: middle;
}

#latestWishesCarouselClipRegion {
	margin: 0 auto;
	overflow: hidden;
	width: 100%;
	height: 120px;
}

#latestWishesCarousel ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
}

#latestWishesCarousel li {
	padding: 0px;
	margin: 0px 5px;
	height: 120px;
}

.latestWishesCarouselSingleWishTable {
	
}

.latestWishesCarouselSingleWishTable td {
	height: 130px;
	width: 87px;
	vertical-align: middle;
	text-align: center;
}



/**********************************************************************************************************************
 * faq.xhtml
 */
.faqHeadline {
	margin-top: 10px;
}

.faqText {
	display: none;
	padding: 0 5px;
}

.faqText ul {
	list-style-type: square;
	margin-top: 5px;
}


/**********************************************************************************************************************
 * myPage.xhtml (Birthday List)
 */
.birthdayListBox {
	border: 1px solid #C5C5C5;
	border-right: none;
	width: 316px;
}

.birthdayListTable {
	border: none;
	width: 100%;
	margin-top: 10px;
}

.birthdayListTableHeadline {
	height: 29px;
	background-image: url(../img/layout/table-header32.gif);
	border: none;
}

.birthdayListTableHeadline td {
	color: #666666;
	border: none;
}

.birthdayListTableHeadlineImage {
	width: 30px;
	text-align: left;
}

.birthdayListTableHeadlineDays {
	width: 30px;
	text-align: center;
}

.birthdayListTableHeadlineBDay {
	text-align: left;
	width: 50px;
}

.birthdayListTableHeadlineName {
	text-align: left;
}

.birthdayListTableHeadlineAge {
	text-align: center;
	width: 65px;
}

.birthdayListTableHeadlineCmd {
	width: 110px;
	padding-right: 5px;
	text-align: right;
}

.birthdayListRow {
	height: 18px;
	background-color: #FFFFFF;
}

.birthdayListRowOdd {
	height: 18px;
	background-color: #F1F1F1;
}

.myPageBirthdayListBirthdayTodaytrue {
	background-color: yellow;
}

.birthdayListBirthdayTodayImgtrue {
	background: url(../img/icons/cake.png) no-repeat scroll center;
	background-color: yellow;
}

.bithdayListTableTdImage {
	width: 30px;
	text-align: center;
}

.birthdayListTable td {
	border: none;
}

.myPageBirthdayListOwUserInfo {
	position: absolute;
	right: 0;
	font-weight: bold;
	font-size: 10px;
	color: #1BC700;
}

#myPageBirthdayListLinksDiv {
	color: #AAAAAA;
}

.myPageBirthdayListLinks {
	vertical-align: middle;
	text-align: right;
	padding-right: 10px;
}

.birthdayListDataScroller {
	
}

.birthdayListDataScroller table {
	text-align: left;
}



/**********************************************************************************************************************
 * Friend List
 */
.friendListTable {
	width: 100%;
	border: none;
	background-color: #FFFFFF;
}

.friendListTable td {
	border: none;
}

.friendListTableHeadline {
	height: 32px;
	background-image: url(../img/layout/table-header32.gif);
	border: none;
}

.friendListTableHeadline td {
	color: #666666;
	border: none;
}

.friendListTableHeadlineImage {
	width: 30px;
	text-align: left;
}

.friendListTableHeadlineDays {
	width: 30px;
	text-align: center;
}

.friendListTableHeadlineBDay {
	width: 50px;
	text-align: left;
}

.friendListTableHeadlineName {
	text-align: left;
}

.friendListTableHeadlineAge {
	width: 35px;
	text-align: center;
}

.friendListTableHeadlineCmd {
	width: 70px;
	text-align: right;
}

.friendListRow {
	height: 18px;
	background-color: #FFFFFF;
}

.friendListRowOdd {
	height: 18px;
	background-color: #F1F1F1;
}

.friendListRow td, .friendListRowOdd td {
}

/**
 * Workaround because c:if doesn't work in rich:datagrid -> always false.
 * But to print the value out does work -> so the css class name is the key
 */
.friendListTableBDayTodaytrue {
	background-color: yellow;
}

.friendListTabelBDayTodayCaketrue {
	background: url(../img/icons/cake.png) no-repeat scroll center;
	background-color: yellow;
}

.friendListTableTdImage,.friendListTableTdDays,.friendListTableTdAge,.friendListTableTdBDay {
	text-align: center;
}

.friendListTableTdName{
}

.friendListTableTdCmd {
	text-align: right;
	pading-right: 10px;
}

.friendListTableDataScroller {
	margin-top: 10px;
}


/**********************************************************************************************************************
 * Present List
 *
 * Present search result list
 */
.presentListResultColumn {
	border: none;
}


/**********************************************************************************************************************
 * Present Search entry page - presentsEntry.xhtml
 */
.presentsEntryCreateWishSelectionTable {
	width: 100%;
}

.presentsEntryCreateWishSelectionTable td {
	text-align: center;
}

.presentsEntryCreateWishSelectionImg {
	width: 33%;
	height: 30px;
	vertical-align: middle;
}

.presentsEntryCreateWishSelectionDesc {
	vertical-align: top;
}


/**********************************************************************************************************************
 * Present Search - amazon product search
 */
#presentSearchFormInput {
	width: 100%;
	height: 95px;
}

.presentSearchMaxPriceSliderDefaultInput {
	
}

.slider {
	width: 210px;
	height: 16px;
	background-image: url(../img/layout/sliderBg.gif);
	position: relative;
	top: 8px;
	border: 0px hidden #363636;
	background-repeat: no-repeat;
	background-position: 2px 0px;
}

#indicator1 {
	background-image: url(../img/layout/sliderIndicator1.gif);
	background-color: transparent;
}

.indicator {
	width: 16px;
	height: 16px;
	background-color: #FF9900;
	position: absolute;
	font-size: 1px;
	overflow: hidden;
	border: none;
}

.presentSearchResultListTable {
	width: 100%;
	border: none;
}

.presentSearchResultListTable td {
	padding: 0;
	border: none;
}

.presentSearchResultSingleItem {
	margin-bottom: 20px;
	width: 600px;
}

.presentSearchResultListItemAlreadyExisttrue {
	background-color: #6EE94C;
}


/**********************************************************************************************************************
 * Present Search add to Friend Popup
 */
.presentSearchAddToFriendInputTable {
	width: 100%;
	margin-top: 10px;
}

.presentSearchAddToFriendInputTableTdLabel {
	vertical-align: top;
	width: 90px;
}

.presentSearchAddToFriendInputTableTdInput {
	
}

.presentSearchAddToFriendInputTableTdInput input,.presentSearchAddToFriendInputTableTdInput textarea
	{
	width: 480px;
}


/**********************************************************************************************************************
 * single item detail xhtml page 
 */
.singleItemDetailTable {
	width: 100%;
	border: none;
}

.itemDetailsDescDiv, .itemDetailsDescDivfalse {
	background-color: #F4FFEF;
	padding: 7px;
}

.itemDetailsDescDivtrue {
	background-color: #FFFF75;
	padding: 7px;
}

.itemDetailsDescTitle {
	font-weight:bold;
	height:30px;	
}

.itemDetailsDescTitleLight {
	height:30px;	
}

.singleItemDetailTable a {
	color: #18B911;
}

.singleItemDetailTable a:hover {
	color: #6EE94C;
	text-decoration: underline;
}

.singleItemDetailTable a:visited {
	color: #18B911;
}

.singleItemDetailTableDivButtons {
	width: 100%;
	text-align: right;
	padding-top: 5px;
}

.singleItemDetailInputTable {
	width: 100%;
	margin-top: 10px;
}

.singleItemDetailInputTableTdLabel {
	vertical-align: top;
	width: 120px;
}

.singleItemDetailInputTableTdInput input,.singleItemDetailInputTableTdInput textarea {
	width: 480px;
}


/**********************************************************************************************************************
 * Friend Notif List
 *
 * @used-for On the friend details page in tab 'Erinnerungen' for the list of notifications.
 * @author Marc Neumann
 */
.friendNotifListBox {
	border: 1px solid #C5C5C5;
	border-right: none;
	width: 316px;
}

.friendNotifList {
	border: none;
}

.friendNotifListHeadline {
	height: 25px;
	background-image: none;
}

.friendNotifListHeadline td {
	text-align: left;
	color: #666666;
}

.friendNotifListRow {
	height: 25px;
}

.friendNotifList td {
	border: none;
}

.friendNotifListDataScroller {
	
}

.friendNotifListDataScroller table {
	text-align: left;
}

/**********************************************************************************************************************
 * Friend Wish List
 *
 * @used-for On the friend details page in tab 'Erinnerungen' for the list of notifications.
 * @author Marc Neumann
 */
.friendWishListBox {
	width: 100%;
}

.friendWishList {
	border: none;
}

.friendWishListHeadline {
	height: 25px;
	background-image: none;
}

.friendWishListHeadline td {
	color: #666666;
	border: none
}

.friendWishListRow {
	height: 25px;
}

.friendWishList td {
	border: none;
}

.friendWishListTdTitleHd {
	text-align: left;
}

.friendWishListTdDateHd {
	width: 80px;
	text-align: center;
}

.friendWishListTdDate {
	text-align: center;
}

.friendWishListDataScroller {
	
}

.friendWishListDataScroller table {
	text-align: left;
}

/**********************************************************************************************************************
 * Friend Search List
 */
.friendSearchList_table {
	width: 100%;
	border: none;
}

.friendSearchList_resultTable {
	width: 100%;
	border: none;
}

.friendSearchList_resultTableCol {
	border: none;
}

.friendSearchList_resultTable a {
	color: #18B911;
}

.friendSearchList_resultTable a:hover {
	color: #6EE94C;
	text-decoration: underline;
}

.friendSearchList_resultTable a:visited {
	color: #18B911;
}

/**********************************************************************************************************************
 * User Search List
 */
.userSearchList_table {
	width: 100%;
	border: none;
}

.userSearchList_resultTable {
	width: 100%;
	border: none;
}

.userSearchList_resultTableCol {
	border: none;
}

.userSearchList_resultTable a {
	color: #18B911;
}

.userSearchList_resultTable a:hover {
	color: #6EE94C;
	text-decoration: underline;
}

.userSearchList_resultTable a:visited {
	color: #18B911;
}


/**********************************************************************************************************************
 * Reminders List
 *
 * @used-for On the page 'Erinnerungen' for the list of all notifs.
 * @author Marc Neumann
 */
.notifListBox {
	border: 1px solid #C5C5C5;
	width: 600px;
}

.notifList {
	border: none;
}

.notifListHeadline {
	height: 25px;
	background-image: none;
}

.notifListHeadline td {
	text-align: left;
	color: #666666;
}

.notifListRow {
	height: 40px;
}

.notifList td {
	border: none;
}

.notifListDataScroller {
	
}

.notifListDataScroller table {
	text-align: left;
}

/**********************************************************************************************************************
 * Friend Present Idea List
 *
 * @used-for On the page 'Geschenkideen' for the list of present ideas for the friend.
 * @author Marc Neumann
 */
.friendPresentIdeaListBox {
	border: 1px solid #C5C5C5;
	width: 600px;
}

.friendPresentIdeaList {
	border: none;
}

.friendPresentIdeaListHeadline {
	height: 25px;
	background-image: none;
}

.friendPresentIdeaListHeadline td {
	text-align: left;
	color: #666666;
}

.friendPresentIdeaListRow {
	height: 25px;
}

.friendPresentIdeaList td {
	border: none;
}

.friendPresentIdeaListDataScroller {
	
}

.friendPresentIdeaListDataScroller table {
	text-align: left;
}

/**********************************************************************************************************************
 * My Wishes
 */
.wishListWishesTable {
	width: 100%;
	border: none;
}

.wishListWishesTable td {
	border: none;
}

.wishListWishesTdDate {
	width: 65px;
	text-align: center;
}

.wishListWishesTdActions {
	width: 160px;
	text-align: right;
}

/**********************************************************************************************************************
 * Public wishlist configuration - wishListConfig.xhtml
 */
.wishListConfigShowPrivateDataInfo {
	width: 350px;
	text-align: justify;
	padding-right: 5px;
}

/**********************************************************************************************************************
 * Public wishlist
 */
#publicWishlistUserDetails {
	width: 100%;
	position: relative;
}

#publicWishListUserImage {
	margin-right: 20px;
}

.publicWishListUserBDay {
	position: absolute;
	right: 0;
	bottom: -10px;
	color:#8FED8C;
	font-size:30px;
	font-weight: bold;
}

.publicWishListOwnWishListInfo {
	margin-bottom: 20px;	
}

.publicWishListWishesTable {
	width: 100%;
	border: none;
	margin-top: 20px;
	border: none;
}

.publicWishListWishesTable td {
	padding: 0;
	border: none;
}

.publicWishListSingleResultDiv {
	width: 100%;
	border-top: 1px solid #F1F1F1;
	margin-bottom: 25px;
}

.publicWishListWishTitle{
	background-color: #D4FFBF;
	color: #494949;
	font-weight: bold;
	font-size: 14px;
	vertical-align: top;
	padding: 2px 5px;
}

.publicWishListWishTitleReserved {
	color: #9F9F9F;	
	background-color: #FFFFAF;
}

.publicWishListWishTitleReservedByMe {
	background-color: yellow;
}

.publicWishListWishTitleLabel {
	width: 70px;
}

.publicWishListWishDesc{
	padding:7px 5px 5px 5px;
}

.publicWishListWishItem {
	margin-top: 5px;	
}

/**********************************************************************************************************************
 * User Email List
 *
 * @used-for On the page 'Mein Profil' for the list of user emails.
 * @author Marc Neumann
 */
.userEmailListBox {
	border: 1px solid #C5C5C5;
	width: 600px;
}

.userEmailList {
	border: none;
}

.userEmailListHeadline {
	height: 25px;
	background-image: none;
}

.userEmailListHeadline td {
	text-align: left;
	color: #666666;
}

.userEmailListRow {
	height: 25px;
}

.userEmailList td {
	border: none;
}

/**********************************************************************************************************************
 * Tooltop
 */
.tooltipPopup {
	display: none;
}

.tooltipPopupContent {
	margin: 7px 10px
}

.tooltipPopupHeader {
	font-weight: bold;
	height: 35px;
}

.tooltipPopupBody {
	margin-top: 4px;
}

#tmpTooltipPopupDivWrapper {
	background-color: #FFFFFF;
}

#tmpTooltipPopupDiv {
	display: none;
	width: 205px;
	height: 130px;
	background: url(../img/layout/toolTipPopup200x110.gif) no-repeat scroll
		center top;
}

/**********************************************************************************************************************
 * statisticPanel.xhtml
 */
.statisticPanel div {
	height: 20px;
}

/**********************************************************************************************************************
 * voting.xhtml
 */
.votingDiv {
	width: 100%;
	border: 1px dashed black;
	padding: 5px 0px;
}

/**********************************************************************************************************************
 * itemsByTag.xhtml
 */
.itemsByTagInfo {
	width: 300px;
	text-align: justify;
	font-weight: normal;
	padding-right: 5px;
}

.itemsByTagTable {
	width: 100%;
}

.itemsByTagTd {
	border: none;
	width: 140px;
	height: 140px;
	padding: 4px;
	vertical-align: middle;
	text-align: center;
}

.itemsByTagTd .thickbox a:hover {
	text-decoration: none;
}

.itemByTagDiv {
	border: 1px solid #CCCCCC;
	overflow: hidden;
	width: 140px;
	height: 140px;
}

.itemByTagDiv img {
	width: 125px;
}

/**********************************************************************************************************************
 * eventCalendar.xhtml
 */
.eventCalendarYear {
	position: relative;
	width: 595px;
	height: 536px;
	overflow: hidden;
	background-color: #C3D9FF;
	padding-top: 5px;
	padding-bottom: 10px;
	padding-left: 5px;
	padding-right: 5px;
	-moz-border-radius-bottomleft:3px;
	-moz-border-radius-bottomright:3px;
	-moz-border-radius-topleft:3px;
	-moz-border-radius-topright:3px;
}

.eventCalendarYear .monthsContainer {
	position: absolute;
	top: 0;
	left: 25px; 
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: no-wrap;
	width: 570px;
	height: 536px;
}

.eventCalendarYear .monthsTable {
	table-layout: fixed; 
	/*
	position: absolute; 
	left: 0; 
	top: 0;
	*/
	width: 2280px; 
	height: 20px;
	color: #112ABB;
	background-color: #C3D9FF;
}

.eventCalendarYear .monthsTableColDay {
	width: 25px;
}

.eventCalendarYear .monthsTableColContent {
	border-left: 1px solid #FFFFFF;
	font-weight: normal;
}

.eventCalendarYear .daysLegend {
	position: absolute;
	left: 0;
	top: 20px;
	height: 496px;
	width: 25px;
}

.eventCalendarYear .daysLegend div {
	text-align: right;
	padding-right: 2px;
	background-color: #C3D9FF;
	border-top: 1px solid #FFFFFF;
	width: 23px;
	height: 15px; 
}

.eventCalendarYear .daysContainer {
	position:absolute; 
	left: 0; 
	top: 20px; 
	bottom: 0;
	width: 2280px; 
	height: 516px;
	overflow: hidden;
	overflow-x: hidden;
	overflow-y: hidden;
	background-color: #FFFFFF;
}

.eventCalendarYear .daysRow {
	border-top: 1px solid #C3D9FF;
	position: absolute; 
	left: 0; 
	width: 100%;
	height: 15px; 
}

.eventCalendarYear .daysRowOdd {
	background-color: #E8EEF7;
}

.eventCalendarYear .daysRowTable {
	table-layout:fixed; 
	position:absolute; 
	left: 0; 
	top: 0; 
	width: 2280px;
	height: 100%; 
}

.eventCalendarYear .dayCell {
	padding-left: 2px;
	border-left: 1px solid #C3D9FF;
}

.eventCalendarYear .dayCellToday {
	background-color: #FFFFAA;
}

.eventCalendarYear .dayContainer {
	position: relative;
	width: 100%;
	height: 15px;
	overflow: hidden;
}

.eventCalendarYear .dayCell .dayName {
	position: absolute;
	left: 0;
	top: 0;
	width: 23px;
	padding-left: 2px;
}

.eventCalendarYear .dayCell .numEvents {
	font-size: 8px;
}

.eventCalendarYear .dayCell .dayEvents {
	position: absolute;
	top: 0;
	left: 27px;
	white-space: nowrap;
}

/*
.eventCalendarYear .month {
	border-left: 1px solid #000000;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	width: 150px;
	margin-left: 3px;
	vertical-align: top;
}

.eventCalendarYear .monthLabel {
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
	background-color: #AFAFAF;
	padding-left: 3px;
	padding-top: 2px;
	padding-bottom: 2px;
}

.eventCalendarYear .monthLabel .monthLabelName {
}

.eventCalendarYear .monthLabel .monthLabelYear {
}

.eventCalendarYear .day {
	border-top: 1px solid #EFEFEF;
}

.eventCalendarYear .dayOdd .dayOfMonth {
	background-color: #EFEFEF;
}

.eventCalendarYear .dayOdd .weekDay {
	background-color: #EFEFEF;
}

.eventCalendarYear .dayOfMonth {
	text-align: right;
	width: 20px;
	padding-top: 2px;
	vertical-align: top;
}

.eventCalendarYear .weekDay {
	width: 25px;
	padding-top: 2px;
	vertical-align: top;
}

.eventCalendarYear .events {
	width: 105px;
}

.eventCalendarYear .event {
	border: 1px dashed #000000;
	margin-top: 2px;
	margin-bottom: 2px;
	margin-left: 3px;
	margin-right: 3px;
}
*/

.dr-table {
	border: none !important;
}

.dr-table-cell {
	border: none !important;
}

.dr-table-headercell {
	color:#363636 !important;
	border-right: none !important;
}

.dr-table-footercell {
	color:#363636 !important;
}

.dr-table-subfootercell {
	color:#363636 !important;
}

.dr-subtable-headercell {
	color:#363636 !important;
}

/**
 * panel and modal panel div style class
 */
.dr-pnl, .dr-mpnl-pnl {
	padding: 0 !important;
}

/**
 * modal panel header div
 */
.rich-mpnl-header-cell {
	border-top: 1px solid black !important;
	border-left: 1px solid black !important;	
	border-right: 1px solid black !important;
}

.dr-mpnl-pnl-h {
	height: 16px !important;
	background-image: none !important;
	background-color: #EEEEEE !important;
	font-size: 12px !important;
}

/**
 * modal panel content div
 */
.rich-mpnl-body {
	border-left: 1px solid black !important;	
	border-right: 1px solid black !important;
	border-bottom: 1px solid black !important;
}

/**
 * panel header div
 */
.dr-pnl-h {
	border: none !important;
	height: 15px !important;
	padding-top: 5px !important;
	padding-left: 7px !important;
}

.dr-tbpnl-tb-sel {
	border-color: #6EE94C !important;
	cursor: hand !important;
	cursor: pointer !important;
}

/**
 * Tabbed pane active tab header
 */
.dr-tbpnl-tb-act {
	background-color: #6EE94C !important;
	border: 1px solid #EEEEEE !important;
}

/*
 * "South St" Theme for jQuery UI Datepicker
 * Generated by Theme Roller ( http://ui.jquery.com/themeroller/ )
 * Authors: 
 *		Filament Group ( http://www.filamentgroup.com )
 * 		Marc Grabanski ( http://marcgrabanski.com/ )
*/
#ui-datepicker-div,
#ui-datepicker-div table,
.ui-datepicker-div,
.ui-datepicker-div table,
.ui-datepicker-inline,
.ui-datepicker-inline table {
	font-size: 12px !important;
}
.ui-datepicker-div, .ui-datepicker-inline, #ui-datepicker-div {
	/*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none;
	font-family: segoe ui, Arial, sans-serif;
	background: #ffffff;
	font-size: 1.2em;
	border: 4px solid #E4E5E3;
	width: 15.5em;
	padding: 2.5em .5em .5em .5em;
	position: relative;
}
#ui-datepicker-div {
	z-index: 9999; /*must have*/
	display: none;
	background: #ffffff;
}
.ui-datepicker-inline {
	float: left;
	display: block;
}
.ui-datepicker-control {
	display: none;
}
.ui-datepicker-current {
	display: none;
}
.ui-datepicker-next, .ui-datepicker-prev {
	position: absolute;
	left: .5em;
	top: .5em;
	background: #327E04 url(images/327E04_40x100_textures_03_highlight_soft_25.png) 0 50% repeat-x;
}
.ui-datepicker-next {
	left: 14.6em;
}
.ui-datepicker-next:hover, .ui-datepicker-prev:hover {
	background: #5A9D1A url(images/5A9D1A_40x100_textures_03_highlight_soft_25.png) 0 50% repeat-x;
}
.ui-datepicker-next a, .ui-datepicker-prev a {
	text-indent: -999999px;
	width: 1.3em;
	height: 1.4em;
	display: block;
	font-size: 1em;
	background: url(images/eeeeee_7x7_arrow_left.gif) 50% 50% no-repeat;
	border: 1px solid #E4E5E3;
	cursor: pointer;
}
.ui-datepicker-next a {
	background: url(images/eeeeee_7x7_arrow_right.gif) 50% 50% no-repeat;
}
.ui-datepicker-prev a:hover {
	background: url(images/ffd40f_7x7_arrow_left.gif) 50% 50% no-repeat;
}
.ui-datepicker-next a:hover {
	background: url(images/ffd40f_7x7_arrow_right.gif) 50% 50% no-repeat;
}
.ui-datepicker-prev a:active {
	background: url(images/8DC262_7x7_arrow_left.gif) 50% 50% no-repeat;
}
.ui-datepicker-next a:active {
	background: url(images/8DC262_7x7_arrow_right.gif) 50% 50% no-repeat;
}
.ui-datepicker-header select {
	border: 1px solid #E4E5E3;
	color: #eeeeee;
	background: #327E04;
	font-size: 1em;
	line-height: 1.4em;
	position: absolute;
	top: .5em;
	margin: 0 !important;
	
}
.ui-datepicker-header select.ui-datepicker-new-month {
width: 7em;
left: 2.2em;
}
.ui-datepicker-header select.ui-datepicker-new-year {
width: 5em;
left: 9.4em;
}
table.ui-datepicker {
	width: 15.5em;
	text-align: right;
}
table.ui-datepicker td a {
	padding: .1em .3em .1em 0;
	display: block;
	color: #eeeeee;
	background-color: #24B123;
	cursor: pointer;
	border: 1px solid #ffffff;
}
table.ui-datepicker td a:hover {
	border: 1px solid #444444;
	color: #ffffff;
	background-color: #6EE94C;
}
table.ui-datepicker td a:active {
	border: 1px solid #c4c5c3;
	color: #403D38;
	background: #red;
}
table.ui-datepicker .ui-datepicker-title-row td {
	padding: .3em 0;
	text-align: center;
	font-size: .9em;
	color: #222222;
	text-transform: uppercase;
	/*border-bottom: 1px solid #E4E5E3;*/
}

table.ui-datepicker .ui-datepicker-title-row td a {
	color: #222222;
}

/* ___________ IE6 IFRAME FIX ________ */
.ui-datepicker-cover {
   display: none; /*sorry for IE5*/
   display/**/: block; /*sorry for IE5*/
   position: absolute; /*must have*/
   z-index: -1; /*must have*/
   filter: mask(); /*must have*/
   top: -4px; /*must have*/
   left: -4px; /*must have*/
   width: 200px; /*must have*/
   height: 200px; /*must have*/
}

img.ui-datepicker-trigger {
	margin: 2px;
	vertical-align: middle;
	position: relative; left: -21px; top: -1px; 
}
/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 75px;
    height: 75px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}
.smp {
	display: none;
	
	position: fixed;
	top: 5%;
	left: 50%;
	
	margin-left: -315px;
	width: 630px;

	
	background-color: #FFF;
	color: #333;
	border: 1px solid black;
}

/* Fixed posistioning emulation for IE6
     Star selector used to hide definition from browsers other than IE6
     For valid CSS, use a conditional include instead */
* html .smp {
     position: absolute;
     top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}

.smpshow {
	display: block;
	z-index: 1100;
}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
/* *{padding: 0; margin: 0;} */

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
	font: 12px Arial, Helvetica, sans-serif;
	color: #333333;
}

#TB_secondLine {
	font: 10px Arial, Helvetica, sans-serif;
	color:#666666;
}

#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
	position: fixed;
	z-index:1150;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
	position: fixed;
	background: #ffffff;
	z-index:1152;
	color:#000000;
	display:none;
	border: 4px solid #525252;
	text-align:left;
	top:50%;
	left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
}

#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#e8e8e8;
	height:27px;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:1153;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
	z-index:1149;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
}
#popup_container {
	font-family: Arial, sans-serif;
	font-size: 12px;
	min-width: 300px; /* Dialog will be no smaller than this */
	max-width: 600px; /* Dialog will wrap after this width */
	background: #FFF;
	border: solid 5px #999;
	color: #000;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

#popup_title {
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	line-height: 1.75em;
	color: #666;
	background: #CCC url(jquery-alerts/title.gif) top repeat-x;
	border: solid 1px #FFF;
	border-bottom: solid 1px #999;
	cursor: default;
	padding: 0em;
	margin: 0em;
}

#popup_content {
	background: 16px 16px no-repeat url(imagesjquery-alerts/if);
	padding: 1em 1.75em;
	margin: 0em;
}

#popup_content.alert {
	background-image: url(jquery-alerts/info.gif);
}

#popup_content.confirm {
	background-image: url(jquery-alerts/important.gif);
}

#popup_content.prompt {
	background-image: url(jquery-alerts/help.gif);
}

#popup_message {
	padding-left: 48px;
}

#popup_panel {
	text-align: center;
	margin: 1em 0em 0em 1em;
}

#popup_prompt {
	margin: .5em 0em;
}

/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
}
.sf-menu a {
	border-left:	1px solid #fff;
	border-top:		1px solid #CFDEFF;
	padding: 		.75em 1em;
	text-decoration:none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#13a;
}
.sf-menu li {
	background:		#BDD2FF;
}
.sf-menu li li {
	background:		#AABDE6;
}
.sf-menu li li li {
	background:		#9AAEDB;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#CFDEFF;
	outline:		0;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}

/*** adding the class sf-navbar in addition to sf-menu creates an all-horizontal nav-bar menu ***/
.sf-navbar {
	background:		#BDD2FF;
	height:			2.5em;
	padding-bottom:	2.5em;
	position:		relative;
}
.sf-navbar li {
	background:		#AABDE6;
	position:		static;
}
.sf-navbar a {
	border-top:		none;
}
.sf-navbar li ul {
	width:			44em; /*IE6 soils itself without this*/
}
.sf-navbar li li {
	background:		#BDD2FF;
	position:		relative;
}
.sf-navbar li li ul {
	width:			13em;
}
.sf-navbar li li li {
	width:			100%;
}
.sf-navbar ul li {
	width:			auto;
	float:			left;
}
.sf-navbar a, .sf-navbar a:visited {
	border:			none;
}
.sf-navbar li.current {
	background:		#BDD2FF;
}
.sf-navbar li:hover,
.sf-navbar li.sfHover,
.sf-navbar li li.current,
.sf-navbar a:focus, .sf-navbar a:hover, .sf-navbar a:active {
	background:		#BDD2FF;
}
.sf-navbar ul li:hover,
.sf-navbar ul li.sfHover,
ul.sf-navbar ul li:hover li,
ul.sf-navbar ul li.sfHover li,
.sf-navbar ul a:focus, .sf-navbar ul a:hover, .sf-navbar ul a:active {
	background:		#D1DFFF;
}
ul.sf-navbar li li li:hover,
ul.sf-navbar li li li.sfHover,
.sf-navbar li li.current li.current,
.sf-navbar ul li li a:focus, .sf-navbar ul li li a:hover, .sf-navbar ul li li a:active {
	background:		#E6EEFF;
}
ul.sf-navbar .current ul,
ul.sf-navbar ul li:hover ul,
ul.sf-navbar ul li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
}
ul.sf-navbar .current ul ul {
	top: 			-999em;
}

.sf-navbar li li.current > a {
	font-weight:	bold;
}

/*** point all arrows down ***/
/* point right for anchors in subs */
.sf-navbar ul .sf-sub-indicator { background-position: -10px -100px; }
.sf-navbar ul a > .sf-sub-indicator { background-position: 0 -100px; }
/* apply hovers to modern browsers */
.sf-navbar ul a:focus > .sf-sub-indicator,
.sf-navbar ul a:hover > .sf-sub-indicator,
.sf-navbar ul a:active > .sf-sub-indicator,
.sf-navbar ul li:hover > a > .sf-sub-indicator,
.sf-navbar ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/*** remove shadow on first submenu ***/
.sf-navbar > li > ul {
	background: transparent;
	padding: 0;
	-moz-border-radius-bottomleft: 0;
	-moz-border-radius-topright: 0;
	-webkit-border-top-right-radius: 0;
	-webkit-border-bottom-left-radius: 0;
}