
/*
File: Framework.css
Description: Contains specifications for framework-related layout only.
*/



/* Common framework properties and measurements */
body
{
	background-color: #8dd8f5;
}
#header,
#top-menu,
#subheader,
#main,
#footer,
#pre-footer
{
	clear: both;
}
div.framework-centered,
#sub-menu
{
	width: 960px;
	margin: 0 auto;
}



/* Header section of page */
#header
{
	border-bottom: 1px solid #b4b4b4;
	height: 140px;
	background-position: center top;
	background-repeat: repeat-x;
	position:relative;
	z-index: 99;
}
#header div.framework-centered
{
	position: relative;
}
body.brand-id-1 #header
{
	background-image: url(/TipsCommunity/Includes/Images/Framework/1/header-background.jpg);	
}
body.brand-id-2 #header
{
	background-image: url(/TipsCommunity/Includes/Images/Framework/2/header-background.jpg);	
}
body.brand-id-4 #header
{
	background-image: url(/TipsCommunity/Includes/Images/Framework/4/header-background.jpg);	
}
body.brand-id-17 #header
{
	background-image: url(/TipsCommunity/Includes/Images/Framework/17/header-background.jpg);	
}
#logo-link
{
	position:absolute;
}
body.brand-id-1 #logo-link
{
	left:244px;
	top:54px;
}
body.brand-id-2 #logo-link
{
	left:245px;
	top:62px;
}
body.brand-id-4 #logo-link
{
	left:234px;
	top:62px;
}
body.brand-id-17 #logo-link
{
	left:203px;
	top:63px;
}
body.brand-id-1 #logo-link img
{
	width:300px;
	height:60px;
}
body.brand-id-2 #logo-link img
{
	width:321px;
	height:60px;
}
body.brand-id-4 #logo-link img
{
	width:332px;
	height:60px;
}
body.brand-id-17 #logo-link img
{
	height:52px;
	width:363px;
}
#membership-command-panel
{
	position: absolute;
	right: 0;
}
#membership-command-panel div.inner .item
{
	background: url(/TipsCommunity/Includes/Images/Framework/membership-command-panel-background.gif) repeat-x;
	height: 20px;
	float: right;
	padding: 6px 12px 3px;
	color: #fff;
	border-right: solid 1px #3798D4;
}
#membership-command-panel div.inner .first
{
	padding-left: 8px;
}
#membership-command-panel div.inner .last
{
	padding-right: 8px;
	border-right: none;
}
#membership-command-panel div.inner div.start,
#membership-command-panel div.inner div.end
{
	padding-left: 0;
	padding-right: 0;
	border: 0;
	width: 6px;
}
#membership-command-panel div.inner div.start
{
	background: url(/TipsCommunity/Includes/Images/Framework/membership-command-panel-left-background.gif) no-repeat top right;
}
#membership-command-panel div.inner div.end
{
	background: url(/TipsCommunity/Includes/Images/Framework/membership-command-panel-right-background.gif) no-repeat top right;
}
#deep-links-container
{
	bottom: 6px;
	position:absolute;
	right:0pt;
}
body.has-submenu #deep-links-container
{
	bottom: -31px;
}
#deep-links-container a
{
	margin-left: 10px;
}



/* Top menu section */
#top-menu,
#top-menu ul,
#top-menu ul li
{
    height: 25px;
    line-height: 25px;
}
#top-menu
{
    background: black url(/TipsCommunity/Includes/Images/Framework/top-menu-and-footer-background.gif) repeat-x top left;
}
#top-menu ul#left-menu
{
	float: left;
}
#top-menu ul#right-menu
{
	float: right;
}
#top-menu ul
{
    border-right: solid 1px #b5b5b5;
    list-style-type: none;
}
#top-menu ul li
{
    float: left;
    padding-right: 1px;
    background: transparent url(/TipsCommunity/Includes/Images/Framework/top-menu-and-footer-right-background.gif) no-repeat top right;
}
#top-menu ul li a
{
	position: relative;
	top: -2px;
    background: url(/TipsCommunity/Includes/Images/Framework/top-menu-and-footer-background.gif) repeat-x;
    font-size: 1.1em;
    color: #333;
    text-decoration: none;
    height: 14px;
    padding: 4px 8px 7px 10px;
    overflow: hidden;
    border-left: solid 1px #b5b5b5;
}
#top-menu ul li.selected
{
	padding-right: 0;
	background: none;
}
#top-menu ul li.selected a
{
    background: #cee7fb none;
}
#top-menu ul#right-menu
{
	width: 400px;
}
#top-menu ul#right-menu li
{
	float: right;
    background: transparent url(/TipsCommunity/Includes/Images/Framework/top-menu-and-footer-right-special-background.gif) no-repeat top right;
}
#top-menu ul#right-menu li a
{
    background: url(/TipsCommunity/Includes/Images/Framework/top-menu-and-footer-special-background.gif) repeat-x;
}



/* Special subheader section */
#subheader
{
	background: #39b2e7 url(/TipsCommunity/Includes/Images/Framework/subheader-background.jpg) repeat-x;
}
#subheader div.framework-centered
{
	position: relative;
	padding: 15px 0;
}
#subheader .white
{
	color: #fff;
}
#subheader h1
{
	margin-top: 0;
}
#subheader h1.profile-heading
{
	padding:10px 0;
}
#subheader h1 img
{
	margin-left: 10px;
	vertical-align: middle;
	position: relative;
	width: 32px;
	height: 32px;
	top: -2px;
}
#subheader p a
{
	color: #fff;
}
#subheader p span.usp
{
	margin-right: 1.6em;
}
#breadcrumbs
{
	margin-bottom: 1em;	
}
#sub-menu
{
	clear: both;
}
#sub-menu ul.tabs-large {list-style:none; margin-left:-14px;}
#sub-menu ul.tabs-large li {float:left; margin:0; min-width:84px; margin-right:-16px;}
#sub-menu ul.tabs-large li.selected {margin:0 -27px 0 0;}
#sub-menu ul.tabs-large a, ul.tabs-large a span {display:block; padding:0 17px 0 32px; background:url(/TipsCommunity/Includes/Images/SubMenu/tabs.png) no-repeat;}
#sub-menu ul.tabs-large a {position:relative; z-index:2; padding-left:0; color:#000; font-size:12px; font-weight:bold; line-height:1.2em; text-align:center; text-decoration:none; white-space:nowrap; outline:0; background-position:100% -168px;}
#sub-menu ul.tabs-large li.selected a {background-position:100% -126px; color:#FFF; z-index:3; padding-right:37px; }
#sub-menu ul.tabs-large a span {background-position:0 -84px; width:64px; min-width:64px; height:25px; min-height:25px; padding-top:17px; padding-right:0; cursor:pointer;}
#sub-menu ul.tabs-large li.selected a span {background-position:0 -42px; padding-top:16px; padding-left:36px; height:26px; min-height:26px;}
*> #sub-menu ul.tabs-large a span {width:auto; height:auto;}
#sub-menu ul.tabs-large li.selected a.first span {background-position:0 0;}



/* Special options section between sub menu and main */
#special-options
{
	color: #fff;
	background-color: #004066;
	display: none;
	border-top: solid 4px #fff;
}
body.has-submenu #special-options
{
	border-top-style: none;
}
#special-options div.framework-centered
{
	padding: 9px 0;
}

#special-options div.left,
#special-options div.right
{
	line-height: 15px;
}
#special-options ul,
#special-options ul li
{
	display: inline;
}
#special-options ul li
{
	background: transparent url(/TipsCommunity/Includes/Images/Misc/separator.gif) no-repeat left center;
	margin-left:10px;
	padding-left:10px;
}
#special-options ul li.first
{
	background: none;
	padding-left: 0;
}
#special-options a
{
	color: #fff;
}
#special-options a.active
{
	text-decoration: none;
	cursor: default;
	font-weight: bold;
}


/* Main section of page */
#main
{
	background: #e8f7fc url(/TipsCommunity/Includes/Images/Framework/main-background.jpg) repeat-x;
	border-top: solid 4px #fff;
	border-bottom: solid 4px #004066;
}
body.has-submenu #main
{
	border-top-color: #004066;
}
body.has-special-options #main
{
	border-top-color: #fff;
}
#main div.framework-centered
{
	padding: 20px 0;
}



/* Pre footer section containing TUI offers */
#pre-footer
{
	background: #c8d7dc url(/TipsCommunity/Includes/Images/Framework/pre-footer-background.jpg) repeat-x;
}
#pre-footer div.framework-centered
{
	padding: 15px 0;
}
#pre-footer h2,
#pre-footer div.column-310-left,
#pre-footer div.column-310-right
{
	margin-top: 0;
}
#pre-footer h2 span.tui
{
	padding-right: 28px;
	background: transparent url(/TipsCommunity/Includes/Images/Misc/tui-smile.png) no-repeat center right;
}
#pre-footer h2 span.tema
{
	padding-right: 28px;
	background: transparent url(/TipsCommunity/Includes/Images/Misc/tema.gif) no-repeat center right;
}
#pre-footer div.price-info img
{
	float: left;
	margin-right: 12px;
}
#pre-footer div.price-info div
{
	padding-top: 7px;
	width: 254px;
	float: left;
}
#pre-footer div.price-info div p
{
	display: none;
}



/* Footer section of page */
#footer
{
	height: 25px;
	border-top: solid 1px #b4b4b4;
	background: url(/TipsCommunity/Includes/Images/Framework/top-menu-and-footer-background.gif) repeat-x;
}
#footer ul
{
	text-align: center;
}
#footer ul li
{
	display: inline;
	margin-right: 0.9em;
}
#footer ul li a
{
	font-size: 1.1em;
	color: #333;
	text-decoration: none;
	line-height: 24px;
	overflow: hidden;
}



/* Special email template page framework modifications
Caution! Special Lotus e-mail client styling going on here. */
body.tipscommunity-emailpage #header,
body.tipscommunity-emailpage #top-menu,
body.tipscommunity-emailpage #subheader,
body.tipscommunity-emailpage #main,
body.tipscommunity-emailpage #footer,
body.tipscommunity-emailpage #pre-footer
{
	text-align: center;
}
body.tipscommunity-emailpage div.framework-centered
{
	width: 600px;
	text-align: left;
}