/* BASIS CSS */

body, html {
	margin: 0;
	/* background-color: #ff0000;*/ 
	font-family: Verdana, Arial;
	font-size: 12px;
	color: #000;
	/* word-spacing: 0.5em;*/
	line-height: 1.6em;
}

img {
	border: none;
}

.container {
	position: relative;
	z-index: 2;
	left: 50%;
	width: 980px;       
	text-align: left;
	margin: 0 0 0 -490px;
	height: 100%;
}

/* Divs, absolute */
.balk {
	position: absolute;
	z-index: 2;
	top: 148px;
	left: 0px;
	width: 100%;
	height: 41px;
	background-repeat: repeat-x;
}

.header {
	position: relative;
	z-index: 3;
	top: 10px;
	left: 3px;
	width: 100%;
	height: 115px;
	background-repeat: no-repeat;
	background-position: top left;
	text-align: center;
	color: #fff;	
	/*padding-top: 40px;*/
}

.headerLogo {
	position: absolute;
	right: 40px;
	top: 17px;
	width: 215px;
	height: 100px;
	background-repeat: no-repeat;
	z-index: 5;
}

.headerTekst {
	position: absolute;
	width: 200px;
	height: 40px;
	background-repeat: no-repeat;
	left: 40px;
	bottom: 0px;
	background-position: bottom left;
	z-index: 5;
}

.headerMenu {
	position: absolute;
	float: left;
	width: 100%;
	height: 41px;
	top: 125px;
	left: 3px;
	background-position: top left;
	background-repeat: no-repeat;
	z-index: 3;
}

.headerButtons {
	position: absolute;
	width: 100%;
	height: 41px;
	top: 126px;
	left: 0px;
	z-index: 99;
}

h1 .titel {
	font-weight: bold;
	font-size:24pt;
}

div.titel_pagina {
	/* font-weight: bold; */
	font-size:54pt;
}

.bodyContainer {
	background-repeat: repeat-y;
	width: 980px;
	position: relative;
	top: 51px;

}

.bodyBackground {
	background-repeat:no-repeat; 	
	padding-bottom: 25px;
}

.menuContainer {
	background-repeat: repeat-y;
	width: 155px;
	position: relative;
	float: left;
	padding-top: 10px;
	line-height:16px;
	text-align: right;
	padding-left: 10px;
	padding-right: 10px;
	min-height: 500px;
}

.contentContainer {
	width: 750px;
	background-repeat: repeat-y;
	float: left;
	padding: 15px;
	padding-left: 18px;
}

.footerContainer {
	width: 980px;
	height: 52px;
	position: relative;
	float: left;
	top: 51px;	
	left: 2px;
	padding-top: 4px;
}

.languageContainer {
	float: left;
	position: relative;
	width: 150px;
	height: 100%;
	padding-left: 30px;
}

.joinContainer {
	float: left;
	position: relative;
	width: 715px;
	height: 100%;
	text-align: center;
}

.counterContainer {
	float: left;
	position: relative;
	width: 30px;
	height: 100%;
}

.favoritesContainer {
	float: left;
	position: relative;
	width: 30px;
	height: 100%;
}

.helpPopup {
	padding-left: 10px;
	position: relative;
	width: 30px;
	height: 30px;
	background-repeat: no-repeat;
	cursor: pointer;
	float: left;
}

.hint {
	position: absolute;
	/* margin-left: 20px; */
	margin-left: 0px;
	margin-top: 110px;
	display: none;
	width: 600px;
	/*background-color: #ffffff;*/
	padding: 5px;
	z-index: 1000;
	text-align: left;
}

.terugLink {
	vertical-align: middle;
	margin-right: 5px;
}

.submit {
	color: #fff;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	border-right: 1px solid #777;
	border-bottom: 1px solid #777;
	font-weight: bold;

}

.titel {
	font-size: 42pt;
}

table.berichten {
	width: 75%;
}

.contentTitel {
	font-size: 16px;
	text-align: center;
}

.meer {
	font-family: Verdana, Arial;
	font-size: 12px;	
}

#iSM {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 15px; PADDING-TOP: 0px; HEIGHT: 20px
}
#iSM UL {
	BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 4px 0px 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none; TEXT-ALIGN: center; BORDER-RIGHT-WIDTH: 0px
}
#iSM UL LI {
	PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 1px; HEIGHT: 20px; TEXT-ALIGN: center
}
#iWeak {
	PADDING-RIGHT: 2px; DISPLAY: block; PADDING-LEFT: 2px; FONT-SIZE: 0.7em; PADDING-BOTTOM: 2px; WIDTH: 84px; COLOR: #adadad; PADDING-TOP: 2px; BACKGROUND-COLOR: #f1f1f1; TEXT-ALIGN: center
}
#iMedium {
	PADDING-RIGHT: 2px; DISPLAY: block; PADDING-LEFT: 2px; FONT-SIZE: 0.7em; PADDING-BOTTOM: 2px; WIDTH: 84px; COLOR: #adadad; PADDING-TOP: 2px; BACKGROUND-COLOR: #f1f1f1; TEXT-ALIGN: center
}
#iStrong {
	PADDING-RIGHT: 2px; DISPLAY: block; PADDING-LEFT: 2px; FONT-SIZE: 0.7em; PADDING-BOTTOM: 2px; WIDTH: 84px; COLOR: #adadad; PADDING-TOP: 2px; BACKGROUND-COLOR: #f1f1f1; TEXT-ALIGN: center
}
#iWeak {
	BORDER-RIGHT: #dedede 1px solid
}
#iMedium {
	BORDER-RIGHT: #dedede 1px solid
}
#iMedium {
	WIDTH: 84px
}
#iMedium {
	BORDER-LEFT-WIDTH: 0px
}
#iStrong {
	BORDER-LEFT-WIDTH: 0px
}

#gratisaccount
{
	position: absolute;
	width: 170px;
	height: 171px;
	margin-left: 20px;
	margin-top: 10px;
   	background: transparent url('../images/proaccount.png') left top no-repeat;
	z-index: 100;	
}

#addrechts
{
	position: absolute;
	width: 105px;
	height: 139px;
	margin-left: 985px;
	margin-top: 15px;
   	background: transparent url('http://dy.testnet.nl/serv/i/980/16799/14894/0/414/182030_cover_visionbeachparty_105.jpg') left top no-repeat;
	z-index: 1;	
}

#addrechts1
{
	position: absolute;
	width: 120px;
	height: 600px;
	margin-left: 985px;
	margin-top: 15px;
   	background: transparent url('http://dy.testnet.nl/serv/i/1356/16799/14893/0/56/182135_europcar_gifbanner_120_600.gif') left top no-repeat;
	z-index: 1;	
}

#addrechts2
{
	position: absolute;
	width: 120px;
	height: 600px;
	margin-left: 985px;
	margin-top: 15px;
   	background: transparent url('http://dy.testnet.nl/serv/i/1353/16799/14883/0/56/181664_sns_vakantiegeld_120_600.gif') left top no-repeat;
	z-index: 1;	
}

#addrechts3
{
	position: absolute;
	width: 120px;
	height: 600px;
	margin-left: 985px;
	margin-top: 15px;
   	background: transparent url('http://ad-emea.doubleclick.net/ad/N2571.Testnet/B5100617.4;sz=120x600;ord=') left top no-repeat;
	z-index: 1;	
}

#sintDivLinks
{
	position: absolute;
	width: 94px;
	height: 246px;
	margin-left: -83px;
	margin-top: 250px;
   	background: transparent url('../images/sint_hoekje_links.gif') left top no-repeat;
	z-index: 1;	
}

#sintDivRechts
{
	position: absolute;
	width: 180px;
	height: 174px;
	margin-left: 970px;
	margin-top: 250px;
   	background: transparent url('../images/sint_hoekje_rechts.gif') left top no-repeat;
	z-index: 1;	
}

#kerstDivLinks
{
	position: absolute;
	width: 94px;
	height: 246px;
	margin-left: -84px;
	margin-top: 200px;
   	background: transparent url('../images/kerstman_hoekje_links.gif') left top no-repeat;
	z-index: 1;	
}

#kerstDivRechts
{
	position: absolute;
	width: 145px;
	height: 246px;;
	margin-left: 969px;
	margin-top: 200px;
   	background: transparent url('../images/kerstman_hoekje_rechts.gif') left top no-repeat;
	z-index: 1;	
}

#halloweenDivLinks
{
	position: absolute;
	width: 150px;;
	height: 130px;
	margin-left: -139px;
	margin-top: 250px;
   	background: transparent url('../images/spook_hoekje_links.gif') left top no-repeat;
	z-index: 1;	
}

#halloweenDivRechts
{
	position: absolute;
	width: 150px;
	height: 130px;
	margin-left: 970px;
	margin-top: 250px;
   	background: transparent url('../images/spook_hoekje_rechts.gif') left top no-repeat;
	z-index: 1;	
}

.siteButton {
	width: 30px;
	height: 30px;
}

.bericht_header {
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 39px; 
	width: 703px; 
	float: left;
}

.bericht_body {
	text-align: left; 
	background-position: top left; 
	background-repeat: repeat-y; 
	width: 583px; 
	float:left; 
	padding-left: 60px; 
	padding-right: 60px;
}

.bericht_footer {
	text-align: left;
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 56px; 
	width: 703px; 
	float: left;
}

.bericht_header_off {
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 39px; 
	width: 703px; 
	float: left;
}

.bericht_body_off {
	text-align: left; 
	background-position: top left; 
	background-repeat: repeat-y; 
	width: 583px; 
	float:left; 
	padding-left: 60px; 
	padding-right: 60px;
}

.bericht_footer_off {
	text-align: left;
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 56px; 
	width: 703px; 
	float: left;
}

.bericht_header_small {
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 24px; 
	width: 353px; 
	float: left;
	margin-top: 5px;
}

.bericht_body_small {
	text-align: left; 
	background-position: top left; 
	background-repeat: repeat-y; 
	width: 293px; 
	float:left; 
	padding-top: -5px;
	padding-left: 25px; 
	padding-right: 35px;
}

.bericht_footer_small {
	text-align: left;
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 42px; 
	width: 353px; 
	float: left;
}

.tableContent {
	width: 580px;
}

.terug {
	position: absolute;
	width: 50px;
	text-align: left;
	margin-left: 25px; 
	margin-top: 0px;	
}
	
.midden {
	position: absolute;
	width: 550px;
	text-align: center;
	margin-left: 75px;
}

.rechts {
	position: absolute;
	width: 50px;
	text-align: left;
	margin-left: 650px; 
	margin-top: 0px;	
}

.sort {
	position:absolute;
	right: 0px;
	margin-right: 90px;
	margin-top: -13px;
}

.bericht_header_antwoord {
	margin-top: -15px; 
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 39px; 
	width: 603px; 
	float:left;
}

.bericht_body_antwoord {
	background-position: top left; 
	background-repeat: repeat-y; 
	width: 483px; 
	float:left; 
	padding-left: 60px; 
	padding-right: 60px;
}

.bericht_footer_antwoord {
	background-position: top left; 
	background-repeat: no-repeat; 
	height: 56px; 
	width: 603px; 
	float: left;
}

.midden_antwoord {
	position: absolute;
	width: 450px;
	text-align: center;
	margin-left: 75px;
}

.gratiscd {
	position: absolute;
	z-index: 100;
	width: 98px;
	height: 98px;
	top: 10px;
	right: 30px;
	cursor: pointer;
}

.vanaf {
	position: absolute;
	z-index: 100;
	width: 220px;
	height: 221px;
	top: 0px;
	right: 0px;
	cursor: pointer;
background: transparent url('../images/sint_hoekje_links.gif') left top no-repeat;

}

#chatarea {
	position: fixed;
	width: 425px; 
	z-index: 1002; 
	left: 375px; 
	top: 73px;
	/*border: 3px solid white;	
	background-color: #cccccc;*/
}

#chat {
	width: 390px; 
	height: 240px; 
	border: 0; 
	overflow: hidden; 
	font-family: Verdana;
	font-size: 12px;
	padding: 4px;
}

#typing {
	width: 390px;
	height: 20px;	
	border: 0; 
	font-family: Verdana;
	font-size: 12px;
	font-style: italic;
	color:#bbbbbb;
}

#chat a {
	color: #0000ff;
	text-decoration: underline;
	font-weight: bold;	
}

#chat-header {
	border-bottom:1px solid #DDDDDD; 
	height: 16px;	
}

#chat-header ul {
	margin:0pt; 
	top: -3px; 
	padding:0pt; 
	text-align:right; 
	list-style: none;
}

#chat-content {
	position: absolute; 
	z-index: 1002; 
	padding: 12px;
}

#addchat {
	font-family: Verdana;
	font-size: 12px;
	width: 390px; 
	height: 30px;
}

.chat-move {
	cursor:move;
	/*display:block;*/
	height:16px;
	position:absolute;
	right:24px;
	top:10px;
	width:390px;
	z-index:1;
	text-align: left;
}

.chat-move a {
	cursor:move;
	background-image:url(../images/chat/move.png);
	display:block;
	height:16px;
	width:16px;
}

.chat-move a:hover {
	background-position: bottom center;
}

.chat-move span {
	display:none;
}

.chat-close {
	float:right;
	padding:0pt;
	position:relative;
	z-index:2;
}

.chat-close a {
	background-image:url(../images/chat/closeX.png);
	display:block;
	height:16px;
	width:16px;
}

.chat-close a:hover {
	background-position: bottom center;
}

.chat-close span {
	display:none;
}

.ads {
	position: absolute;
	top: 33px;
	left: 210px;
}

input.edittitel {
	width: 520px;
}

input.titel {
	font-size: 10pt;
	width: 480px;
}

#overlay {
	display:none;
	filter: alpha(opacity=60); 
	-moz-opacity: .6; 
	position: absolute;
	width: 100%;
	height: 2000px;
	top: 0px;
	left: 0px;
	z-index: 500;
	background-color: #000000; 
}

#fonts {
	background-color:#FFFFFF;
	border:1px solid #333333;
	display:none;
	left:50%;
	margin-left:-350px;
	padding:20px;
	position:absolute;
	top:50px;
	width:615px;
	z-index:501;
}

.track {
   background-color: #fff;
   border: 1px solid #b3b3b3;
   position: relative;
   height: 0.5em; width: 10em;
   cursor: pointer; z-index: 0;
}

.handle {
   background-color: red;
   position: absolute;
   height: 1em; width: 0.25em; top: -0.25em;
   cursor: move; z-index: 2;
}

.handle2 {
   background-color: green;
   position: absolute;
   height: 1em; width: 0.25em; top: -0.25em;
   cursor: move; z-index: 2;
}

#bgImg {
	width: 100%;
	height: 100%;
	position: absolute; 
	z-index:0;	
} 

body > #bgImg { position: fixed; }

* html #bgImg { /*\*/position: absolute; top: expression(((ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop)) + 'px'); right: expression(((ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft)) + 'px');/**/ }

.livechat {
	position: absolute;
	z-index: 100;
	width: 105px;
	height: 105px;
	top: 15px;
	right: 50px;
	cursor: pointer;
}

#sortlist {   
    width: 600px;   
    margin: 0 auto;   
   	text-align:center;   

    }  
#sortlist img.sorting {   
    float: left;   
    margin: 4px;   
    padding: 4px;   
    border: 1px solid #ccc;   
    }  
      
#sortlist img.sorting:hover {    
    float: left;   
    margin: 4px;   
    padding: 4px;   
    border: 1px solid #666;    
    cursor: move;   
}  

.helpAntwoord {
	visibility: hidden;
	display: none;
	padding: 5px;
	width: 570px;
}

#joinus { border: 0;position: fixed;  top: 100px; right:0;}


/* ------------------------------------------
CSS3 FACEBOOK-STYLE BUTTONS (Nicolas Gallagher)
Licensed under Unlicense
http://github.com/necolas/css3-facebook-buttons
------------------------------------------ */


/* ------------------------------------------------------------------------------------------------------------- BUTTON */

.uibutton { 
    position: relative; 
    z-index: 1;
    overflow: visible; 
    display: inline-block; 
    padding: 0.3em 0.6em 0.375em; 
    border: 1px solid #999; 
    border-bottom-color: #888;
    margin: 0;
	top: -3px;
    text-decoration: none; 
    text-align: center;
    font: bold 11px/normal 'lucida grande', tahoma, verdana, arial, sans-serif; 
    white-space: nowrap; 
    cursor: pointer; 
    /* outline: none; */
    color: #333; 
    background-color: #eee;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f6f6), to(#e4e4e3));
    background-image: -moz-linear-gradient(#f5f6f6, #e4e4e3);
    background-image: -o-linear-gradient(#f5f6f6, #e4e4e3);
    background-image: linear-gradient(#f5f6f6, #e4e4e3);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f6f6', EndColorStr='#e4e4e3'); /* for IE 6 - 9 */
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff;
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff;
    /* IE hacks */
    zoom: 1; 
    *display: inline; 
}

.uibutton:hover,
.uibutton:focus,
.uibutton:active {
    border-color: #777 #777 #666;
}

.uibutton:active {
    border-color: #aaa;
    background: #ddd;
    filter: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

/* overrides extra padding on button elements in Firefox */
.uibutton::-moz-focus-inner {
    padding: 0;
    border: 0;
}

/* ............................................................................................................. Icons */

.uibutton.icon:before {
    content: "";
    position: relative; 
    top: 3px; 
    float:left;
    width: 10px; 
    height: 12px; 
    margin: 0 0.5em 0 0; 
    background: url(/classes/account/images/fb-icons.png) 99px 99px no-repeat;
}

.uibutton.edit:before  { background-position: 0 0; }
.uibutton.add:before  { background-position: -10px 0; }
.uibutton.secure:before  { background-position: -20px 0; }
.uibutton.prev:before  { background-position: -30px 0; }
.uibutton.check:before  { background-position: -59px 0; }
.uibutton.next:before  { float:right; margin: 0 -0.25em 0 0.5em; background-position: -40px 0; }
.uibutton.setup:before  { float:right; margin: 0 0.1em 0 -0.2em; background-position: -49px 0; }

/* ------------------------------------------------------------------------------------------------------------- BUTTON EXTENSIONS */

/* ............................................................................................................. Large */

.uibutton.large {
    font-size:13px;
}

/* ............................................................................................................. Submit, etc */

.uibutton.confirm {
    border-color: #29447E #29447E #1A356E;
    color: #fff;
    background-color: #5B74A8;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#637bad), to(#5872a7));
    background-image: -moz-linear-gradient(#637bad, #5872a7);
    background-image: -o-linear-gradient(#637bad, #5872a7);
    background-image: linear-gradient(#637bad, #5872a7);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#637bad', EndColorStr='#5872a7'); /* for IE 6 - 9 */
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2;
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2;
}

.uibutton.confirm:active {
    border-color: #29447E;
    background: #4F6AA3;
    filter: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

/* ............................................................................................................. Special */

.uibutton.special {
    border-color: #3b6e22 #3b6e22 #2c5115;
    color: #fff;
    background-color: #69A74E;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#75ae5c), to(#67a54b));
    background-image: -moz-linear-gradient(#75ae5c, #67a54b);
    background-image: -o-linear-gradient(#75ae5c, #67a54b);
    background-image: linear-gradient(#75ae5c, #67a54b);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#75ae5c', EndColorStr='#67a54b'); /* for IE 6 - 9 */
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #98c286;
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #98c286;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #98c286;
}

.uibutton.special:active {
    border-color: #3B6E22;
    background: #609946;
    filter: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}


/* ------------------------------------------------------------------------------------------------------------- BUTTON GROUPS */

.uibutton-group {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0;
    /* IE hacks */
    zoom: 1; 
    *display: inline; 
}

.uibutton + .uibutton,
.uibutton + .uibutton-group,
.uibutton-group + .uibutton,
.uibutton-group + .uibutton-group {
    margin-left: 3px;
}

.uibutton-group li {
    float: left;
    padding: 0;
    margin: 0;
}

.uibutton-group .uibutton {
    float: left;
    margin-left: -1px; 
}

.uibutton-group .uibutton:hover,
.uibutton-group .uibutton:focus,
.uibutton-group .uibutton:active {
    z-index:2;
}

.uibutton-group > .uibutton:first-child,
.uibutton-group li:first-child .uibutton { 
    margin-left: 0; 
}

/* ------------------------------------------------------------------------------------------------------------- BUTTON CONTAINER */
/* For mixing buttons and button groups, e.g., in a navigation bar */

.uibutton-toolbar {
    padding: 6px;
    border-top: 1px solid #ccc;
    background: #f2f2f2;
}

.uibutton-toolbar .uibutton,
.uibutton-toolbar .uibutton-group {
    vertical-align: bottom;
}

/* star rating code - use lists because its more semantic */
/* No javascript required */
/* all the stars are contained in one matrix to solve rollover problems with delay */
/* the background position is just shifted to reveal the correct image. */
/* the images are 16px by 16px and the background position will be shifted in negative 16px increments */
/*  key:  B=Blank : O=Orange : G = Green * /
/*..... The Matrix ....... */
/* colours ....Background position */
/* B B B B B - (0 0)*/
/* G B B B B - (0 -16px)*/
/* G G B B B - (0 -32px)*/
/* G G G B B - (0 -48px)*/
/* G G G G B - (0 -64px)*/
/* G G G G G - (0 -80px)*/
/* O B B B B - (0 -96px)*/
/* O O B B B - (0 -112px)*/
/* O O O B B - (0 -128px)*/
/* O O O O B - (0 -144px)*/
/* O O O O O - (0 -160px)*/


/* the default rating is placed as a background image in the ul */
/* use the background position according to the table above to display the required images*/
.rating{
	width:16px;
	height:16px;
	margin:0 0 20px 0;
	padding:0;
	list-style:none;
	clear:both;
	position:relative;
	background: url(../images/star-matrix.gif) no-repeat 0 0;
}
/* add these classes to the ul to effect the change to the correct number of stars */
.nostar {background-position:0 0}
.onestar {background-position:0 -96px}
.twostar {background-position:0 -32px}
.threestar {background-position:0 -48px}
.fourstar {background-position:0 -64px}
.fivestar {background-position:0 -80px}
ul.rating li {
	cursor: pointer;
 /*ie5 mac doesn't like it if the list is floated\*/
	float:left;
	/* end hide*/
	text-indent:-999em;
}
ul.rating li a {
	position:absolute;
	left:0;
	top:0;
	width:16px;
	height:16px;
	text-decoration:none;
	z-index: 200;
}
ul.rating li.one a {left:0}
ul.rating li.two a {left:16px;}
ul.rating li.three a {left:32px;}
ul.rating li.four a {left:48px;}
ul.rating li.five a {left:64px;}
ul.rating li a:hover {
	z-index:2;
	width:16px;
	height:16px;
	overflow:hidden;
	left:0;	
	background: url(../images/star-matrix.gif) no-repeat 0 0
}
ul.rating li.one a:hover {background-position:0 -96px;}
ul.rating li.two a:hover {background-position:0 -112px;}
ul.rating li.three a:hover {background-position:0 -128px}
ul.rating li.four a:hover {background-position:0 -144px}
ul.rating li.five a:hover {background-position:0 -160px}
/* end rating code */
h3{margin:0 0 2px 0;font-size:110%}

/* Artfully masterminded by ZURB */
body {
  position: relative;
}

#joyRideTipContent { display: none; }

/* Default styles for the container */
.joyride-tip-guide {
  position: absolute;
  background: #000;
  background: rgba(0,0,0,0.8);
  display: none;
  color: #fff;
  width: 300px;
  z-index: 101;
  top: 0; /* keeps the page from scrolling when calculating position */
  left: 0;
  font-family: "HelveticaNeue", "Helvetica Neue", "Helvetica", Helvetica, Arial, Lucida, sans-serif;
  font-weight: normal;
     -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
          border-radius: 4px;
}

.joyride-content-wrapper {
  padding: 10px 10px 15px 15px;
}

/* Mobile */
@media only screen and (max-width: 767px) {
  .joyride-tip-guide {
    width: 95% !important;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    left: 2.5% !important;
  }
  .joyride-tip-guide-wrapper {
    width: 100%;
  }
}


/* Add a little css triangle pip, older browser just miss out on the fanciness of it */
.joyride-tip-guide span.joyride-nub {
  display: block;
  position: absolute;
  left: 22px;
  width: 0;
  height: 0;
  border: solid 14px;
  border: solid 14px;
}

.joyride-tip-guide span.joyride-nub.top {
  /*
  IE7/IE8 Don't support rgba so we set the fallback
  border color here. However, IE7/IE8 are also buggy
  in that the fallback color doesn't work for
  border-bottom-color so here we set the border-color
  and override the top,left,right colors below.
  */
  border-color: #000;
  border-color: rgba(0,0,0,0.8);
  border-top-color: transparent !important;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
  top: -28px;
  bottom: none;
}

.joyride-tip-guide span.joyride-nub.bottom {
  /*
  IE7/IE8 Don't support rgba so we set the fallback
  border color here. However, IE7/IE8 are also buggy
  in that the fallback color doesn't work for
  border-top-color so here we set the border-color
  and override the bottom,left,right colors below.
  */
  border-color: #000;
  border-color: rgba(0,0,0,0.8) !important;
  border-bottom-color: transparent !important;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
  bottom: -28px;
  bottom: none;
}

.joyride-tip-guide span.joyride-nub.right {
  border-color: #000;
  border-color: rgba(0,0,0,0.8) !important;
  border-top-color: transparent !important;
  border-right-color: transparent !important;
  border-bottom-color: transparent !important;
  top: 22px;
  bottom: none;
  left: auto;
  right: -28px;
}

.joyride-tip-guide span.joyride-nub.left {
  border-color: #000;
  border-color: rgba(0,0,0,0.8) !important;
  border-top-color: transparent !important;
  border-left-color: transparent !important;
  border-bottom-color: transparent !important;
  top: 22px;
  left: -28px;
  right: auto;
  bottom: none;
}

/* Typography */
.joyride-tip-guide h1,.joyride-tip-guide h2,.joyride-tip-guide h3,.joyride-tip-guide h4,.joyride-tip-guide h5,.joyride-tip-guide h6 {
  line-height: 1.25;
  margin: 0;
  font-weight: bold;
  color: #fff;
}
.joyride-tip-guide h1 { font-size: 30px; }
.joyride-tip-guide h2 { font-size: 26px; }
.joyride-tip-guide h3 { font-size: 22px; }
.joyride-tip-guide h4 { font-size: 18px; }
.joyride-tip-guide h5 { font-size: 16px; }
.joyride-tip-guide h6 { font-size: 14px; }
.joyride-tip-guide p {
  margin: 0 0 18px 0;
  font-size: 14px;
  line-height: 18px;
}
.joyride-tip-guide a {
  color: rgb(255,255,255);
  text-decoration: none;
  border-bottom: dotted 1px rgba(255,255,255,0.6);
}
.joyride-tip-guide a:hover {
  color: rgba(255,255,255,0.8);
  border-bottom: none;
}

/* Button Style */
.joyride-tip-guide .joyride-next-tip {
  width: auto;
  padding: 6px 18px 4px;
  font-size: 13px;
  text-decoration: none;
  color: rgb(255,255,255);
  border: solid 1px rgb(0,60,180);
  background: rgb(0,99,255);
  background: -moz-linear-gradient(top, rgb(0,99,255) 0%, rgb(0,85,214) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(0,99,255)), color-stop(100%,rgb(0,85,214)));
  background: -webkit-linear-gradient(top, rgb(0,99,255) 0%,rgb(0,85,214) 100%);
  background: -o-linear-gradient(top, rgb(0,99,255) 0%,rgb(0,85,214) 100%);
  background: -ms-linear-gradient(top, rgb(0,99,255) 0%,rgb(0,85,214) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0063ff', endColorstr='#0055d6',GradientType=0 );
  background: linear-gradient(top, rgb(0,99,255) 0%,rgb(0,85,214) 100%);
  text-shadow: 0 -1px 0 rgba(0,0,0,0.5);
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.3) inset;
     -moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.3) inset;
          box-shadow: 0px 1px 0px rgba(255,255,255,0.3) inset;
}

.joyride-next-tip:hover {
  color: rgb(255,255,255) !important;
  border: solid 1px rgb(0,60,180) !important;
  background: rgb(43,128,255);
  background: -moz-linear-gradient(top, rgb(43,128,255) 0%, rgb(29,102,211) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(43,128,255)), color-stop(100%,rgb(29,102,211)));
  background: -webkit-linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%);
  background: -o-linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%);
  background: -ms-linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b80ff', endColorstr='#1d66d3',GradientType=0 );
  background: linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%);
}

.joyride-timer-indicator-wrap {
  width: 50px;
  height: 3px;
  border: solid 1px rgba(255,255,255,0.1);
  position: absolute;
  right: 17px;
  bottom: 16px;
}
.joyride-timer-indicator {
  display: block;
  width: 0;
  height: inherit;
  background: rgba(255,255,255,0.25);
}

.joyride-close-tip {
  position: absolute;
  right: 10px;
  top: 10px;
  color: rgba(255,255,255,0.4) !important;
  text-decoration: none;
  font-family: Verdana, sans-serif;
  font-size: 10px;
  font-weight: bold;
  border-bottom: none !important;
}

.joyride-close-tip:hover {
  color: rgba(255,255,255,0.9) !important;
}

.joyride-modal-bg {
  position: fixed;
  height: 100%;
  width: 100%;
  background: rgb(0,0,0);
  background: transparent;
  background: rgba(0,0,0, 0.5);
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  opacity: 0.5;
  z-index: 100;
  display: none;
  top: 0;
  left: 0;
  cursor: pointer;
}

#banner-left {
	position: absolute;
	width: 600px;
	height: 600px;
	right: 980px;
	top: -40px;
	text-align: right;
}

#banner-right {
	position: absolute;
	width: 600px;
	height: 600px;
	left: 980px;
	top: -40px;
}