/* CSS Document */

body {
	text-align:center; /* Center #page */
	background-color: #CCCCCC;
	margin:0; 
	padding:0; 
}
body div {
	text-align:left; /* Center #page */
}

.whitebox {
	background-color: #FFFFFF; 
	margin-left: 20px; 
	margin-right: 20px; 
	text-align:center;
}

.header {
	margin-left:0; 
	margin-right:0; 
	border-bottom: solid 2px #8D8D8D;
}

.headermenu {
	margin-left:0; 
	margin-right:0; 
	padding: 0 0 4px 10px; 
	border-bottom: solid 1px #8D8D8D;
}

.box {
	/*border: #F57F1D solid 3px; */
	/*background-color:#F57F1D;*/
}

.carpresentation {
	margin:0; 
	background-color: #990000;
	color: #000; 
	padding: 7px 10px 7px 10px;
}
	
	.cartitle {
		font-size:16px;
		color: #FFF;
	}

.carmenu {
	margin-left:0; margin-right:0; 
	border-top: #990000 2px solid; /* F57F1D = Nice orange color */
}
	.carmenu div {
		margin-left:0; margin-right:0; 
		border: solid #FFF; border-width: 0px 0 0px 0;
		background-color: #AFAFAF /* #FFD699; */
	}

.content {
	border: #990000 solid 2px; 
	padding:20px 10px 0 10px; 
	background-color:#FFFFFF;
}

/* Comments ------------------------------------------------------------------------------------------------------------------*/
.commentsbox {
	text-align: left;
	padding: 20px;
}

.CommentsTitle{
	margin: 0;
	padding: 5px 10px 5px 10px;
	background-color: #990000;
	color: #FFF;
	font-weight: bold;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.CommentsName{
	margin: 0;
	background-color: #CCCCCC;
	padding: 5px 10px 5px 10px;
	font-weight: bold;
}
.CommentsComment{
	margin: 0;
	background-color: #EBEBEB;
	padding: 5px 10px 5px 10px;
}

/* Power and torque rate -------------------------------------------------------------------------------------------------------*/
.PowerValueBox {
	margin-top: 34px; /* Margin between the box and the overview image. */
	width: 140px;
	height: 310px;
	background-image:url(/gif/powervalue/meterbackground.jpg);
	background-position:left;
	/*border-top: 5px dashed #FFA064;
	border-bottom: 5px dashed #FFA064;
	border-left: 5px dashed #FFA064;*/
	margin-left: 7px; /* Margin between box with power value and the rest of the content in the performance graph popup. */
	/*line-height: 120px;*/
}
.PowerValueBoxPadding {
	margin: 0 3px 0 35px; /* Spacing between the box borders and the content in the power value box */
	/*text-align:center;*/
	/*border: red 1px solid;*/
}
/*
.Meter {
	margin: 5px 10px 4px 13px;
	background-image:url(/gif/powervalue/meter.gif);
	background-repeat:no-repeat;
	background-position: center;
	width:45px;
	height:72px;
	vertical-align:bottom;
	text-align:center;
}*/
.ValueBarPositioner {
	margin: 0;
	width:45px;
	height:98px;	
}
.ValueBar {
	margin-bottom: 4px;
	margin-left: 52px; /*24px;*/
	width: 19px;
	height: 40px;
	background-image:url(/gif/powervalue/valuebar.gif); 
	/*border: blue 1px solid;
	vertical-align:bottom;*/
}
.CenterText {
	margin:0; 
	text-align:center;
}


/*  Övrigt ---------------------------------------------------------------------------------------------------------------------*/
.rowunderline {
	border-bottom: #000000 solid 1px;
}
.rowspacer {
	font-size: 1px;
	height: 3px;
}
.rowunderlinespacer {
	border-bottom: #000000 solid 1px;
	font-size: 1px;
	height: 3px;
}

.input {
	border: 2px gray solid;
}

.button {
	background-color: #FFD699;  /* FFD699 = Nice orange highlight color */
	display:block; 
	margin:0; 
	height: 25px; 
	padding: 0 10px 0 10px; 
	line-height: 22px; 
	text-align:center;
}
.button:hover {
	background-color:#FFD699;
	display:block; 
	margin:0; 
	height: 25px; 
	padding: 0 10px 0 10px; 
	line-height: 22px;
	text-align:center; 
}

.currentbutton {
	margin:0; 
	background-color: #990000; 
	height: 25px; 
	padding: 0 10px 0 10px; 
	text-align:center;
}
.emptybutton {
	margin:0; 
	background-color: #990000; 
	height: 25px; 
}

.borderright {
	border-right: #FFFFFF solid 3px;
}
.noborder {
	border: 0px white solid;
	margin:0;
}

/* dotstyles styles ------------------------------------------------------------------------------ */
.td {
border-bottom: #CCCCCC dotted 1px;
}
.tdbold {
	border-bottom: #CCCCCC dotted 1px;
	font-weight:bold;
}
.tdfat {
	border-bottom: #CCCCCC dotted 2px;
}
.tdfatbold {
	border-bottom: #CCCCCC dashed 2px;
	font-weight:bold;
}
/* Infosquare ----------------------------------------------------------------------------------------*/
.InfoSquare {
	position:absolute; 
	/*left:30px; 
	top:236px; */
	margin-left: 30px;
	/*background-color:#FFC7A3; 
	border: 5px solid #FFA064; 
	padding: 10px; */
	width: 270px; 
	/*height: 100px;*/
	display: none;
}
/* CSS Document */

.CalloutTop {
	background-image:url(/gif/callout/callouttop.gif);
	width: 270px;
	height: 35px;
}
.CalloutMiddle {
	background-image:url(/gif/callout/calloutmiddle.gif);
	background-repeat: repeat-y;
	width: 270px;
	height: 42px;
}
.CalloutBottom {
	background-image:url(/gif/callout/calloutbottom.gif);
	width: 270px;
	height: 59px;
}