
.box {
	background-color:#F4F0D5;
	border:1px solid #555555;
	padding:3px; 
	margin-bottom:5px;
}

.boxTop {margin:0; }

#msg {
	position:absolute;
	top:0;
	left:0;
	width:200px;
	height:50px;
	background:#ffffff;
	z-index:99999;
	display:none;
}


#map { 
	 margin:0;
	 padding:0;
	 width:100% ;
	height:100%;

		
	
}
			 
#sidebar2 {   		
	  display:block; 
	  font-size: 11px;		  
	  border: 1px solid #999999;
	  height:100%;
	  margin-left:10px;
	  padding-left: 0.5em;
	  padding-right: 0.5em;
	  font-family: Helvetica, Arial, sans-serif;
}

.controls { margin: 0; padding: 0; font-size: 11px; text-align: left;  width: 100%;}
.controls button { font-size: 11px;	margin:0px;	padding:0px;	border:1px solid darkred; background-color: #eee;}
* html .controls button { margin: 0 2px 0 0px;  line-height: 12px; }

.info img { float: left; }
#zselect { padding-top: 1em; }
v\:* {
	  behavior:url(#default#VML);
}
     
div.markerTooltip, div.markerDetail {
	  color: black;
	  font-weight: bold;
	  background-color: white;
	  white-space: nowrap;
	  margin: 0;
	  padding: 2px 4px;
	  border: 1px solid black;
}


#placeDetails.fullSize a:link, #placeDetails.fullSize a:visited, #placeDetails.fullSize a:active
{ 

border: 1px solid #B4B4B4;
/*color: #F0F0F0;*/

/*display: block;
background-color: #2C2C2C;
font-size: 11px;
*/
margin: 0;
padding: 2px 2px 2px 4px;
text-decoration: none;
}

#placeDetails.fullSize a.btn.default:link, #placeDetails.fullSize a.btn.default:visited, #placeDetails.fullSize a.btn.default:active {
    color:#333333;
}

#placeDetails.normalSize a:link, #placeDetails.normalSize a:visited, #placeDetails.normalSize a:active
{
    color: #777777;
    font-size: 11px;
    margin: 0;
    padding: 2px 2px 2px 4px;
    text-decoration: none;
}

#placeDetails.normalSize a.btn
{
    color: #f0f0f0;
}

#animControl a:link, #animControl a:visited, #animControl a:active {
	display:inline;
	background:none;
	padding:0;
	color:#d0d0d0;
	border:0;
	
}

#animControl { margin-bottom:8px; }
#animControl img {
	vertical-align: middle;
}
#animControl button {
	font-size: 14px;
	font-weight: bold;
	height: 22px;
	margin-top: 0;
}

#placeDetails label {
	font-size:12px;
}

fieldset.legendBox  h3 {
    font-size:13px;
}

fieldset.legendBox  * {
    font-size:14px;
}

fieldset.legendBox  { 
	height:auto;
	
	border-style: solid; 
	border-right-width: 1px; border-bottom-width: 1px; border-top-width: 1px; border-left-width: 1px;
	border-right-color: #999999; border-bottom-color: #999999; border-top-color: #E5E5E5; border-left-color: #E5E5E5;

	border:none;
	display:block;
	float:right;
	clear:both;

	padding:0;
	padding-left:1px; 	
	padding-bottom:4px;
	
	margin-bottom:0.5em;
	margin-right:0px;
	margin-left:2px;
	text-align:left;
	background-color:#FFFFFA;
	
	background:none;

	width:100%;
}


.legendBox legend {
	border:1px outset #E2E2E2;
	
	padding:0.13em 0.95em 0.13em 0.95em;
	margin:0;
	color:#000000;
	font-weight:normal;
	font-size:10px;
	background-color:#EDEAD3;

	background:#ffffff;
	border:none;
}

.imgBox {
	width:auto;
	display:block;
	float:right;
	clear:both;
	background-color:#F5F7F9;
	padding:3px;
	margin:3px;
}
.shadowBox {
	border-right-width: 2px; border-bottom-width: 2px; border-top-width: 1px; border-left-width: 1px;
	border-right-style: solid; border-bottom-style: solid; border-top-style: solid; border-left-style: solid;
	border-right-color: #999999; border-bottom-color: #999999; border-top-color: #E2E2E2; border-left-color: #E2E2E2;
}


#placeDetails {  
    /* Place the div off the bottom right of the map */  
    position: absolute;  
    width: 150px;  
    height:auto;
    

    right: 0px;

    padding-left: 9px;  
    padding-right: 5px;  
    /* Semi-transparent background */
    background-color: #505050; 
    background-color: rgba(0,0,0,0.6);  
    color: white;  
    font-size: 80%;  
    /* Rounded top left corner */  
    border-top-left-radius: 10px;  
    -moz-border-radius-topleft: 10px;  
    -webkit-border-top-left-radius: 10px;  
 }

#placeDetails.fullSize {

    background-color: rgba(0, 0, 0, 0.6);
    border-top-left-radius: 4px;
    color: #FFFFFF;
    font-size: 80%;
    height: auto;
    padding-top: 4px;
    position: absolute;
    right: 5px;
    top: 50px;
    width: 190px;
    z-index: 99999;


    /* Rounded top left corner */
    border-top-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
}

#placeDetails.fullSize h3 {
    color:#ffffff;
}

#placeDetails.normalSize , #replay.normalSize {
    background-color: #FFFFFF;

    border-top-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-left-radius: 0px;

    color: #353535;
    float: right;
    font-size: 70%;
    height: 100%;
    margin-right: 0;
    padding-left: 9px;
    padding-right: 5px;
    position: relative;
    width: 140px;
}

#placeDetails.normalSizeX {
    position: absolute;
    width: 150px;

    padding-left: 9px;
    padding-right: 5px;

    height: 100%;
    margin-right: -166px;
    top: 15px;

    background-color: #C9C9C9;
    color: #353535;
    font-size: 80%;

    border-top-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-left-radius: 0px;

    float:right;
}

#viewTrackMenu {
    display: none;
    font-size: 11px;
    height: auto;
    overflow: visible;
    padding-bottom: 10px;
    padding-left: 0;
    padding-top: 13px;
    text-align: right;
    width: 100%;
}

#gmapsContainer{
    display: block;
    background-color: white;

   /* width:745px;
    width:866px;*/
    z-index: 9999;
   /* position:relative;*/

    margin: 0;
    padding: 0;

}

.gmapsContainerNormal {
    position:relative;
  /*  width:866px;*/
    height: 100%;
    margin-bottom:10px;
}

.gmapsContainerFull {
    position:absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}


#chartDiv {
    float:none;

    right:120px;
    right:175px;
	height:100%;

    position: absolute;
    left: 0;

  /*  margin-top: 15px;
    margin-bottom: 20px;
    */
}

#replayDiv {
    float: right;
    position: absolute;
    right: 8px;
    width: 130px;
}



#replayDiv  .legendBox{
    margin-bottom:0;
    padding-bottom: 0;
}

#replayDiv h3 {
    margin-top:0px;
}

#chartOptionsDiv {
    background-color: #FFFFFF;
    color: #353535;
    float: none;
    font-size: 80%;
    margin-right: 0px;
    padding-left: 2px;
    padding-right: 2px;

    top: 14px;
    position: absolute;
    right: 140px;
    width: 50px;

}

#ChartContainer {
    position: relative;
    float:left;
    width:745px;
    width:870px;
    height:140px;
    margin-top: 15px;
    margin-bottom: 20px;
}

#ChartContainer.ChartContainerFull {
    bottom: 0;
    position: fixed;
    width:100%;
    height: 135px;
    margin-bottom: 0px;
    margin-top: 0px;
}

#chart {
  	width:100%;
    height:100%;
  	background-color: rgba(255,255,255,0.5);
}

#chart2 {
    width:100%;
    height:50%;
    background-color: rgba(255,255,255,0.5);
}


.axis1 {font-weight: bold; color:#3388BE; }
.axis2 {font-weight: bold; color: #9b82ca; }
.axis3 {font-weight: bold; color:#00c500; }
.axis4 {font-weight: bold; color:#AB7224; }

	
  #mapDiv {
   float:left;
    width: 100%;  

    min-height: 150px !important;
  }

#mapDiv.mapDivFull {
    bottom: 150px;
    min-height: 150px !important;
    position: fixed;
    top: 0;
}

#mapDiv.mapDivNormal {

    width: 100%;
    height:400px;
}



  #thermalControls img {  
  	padding-left: 3px;
    vertical-align: middle;
  }
  #thermalControls label { cursor:pointer; }  
  
.legendBox label { cursor:pointer; }  

/* track info display */

 
 
#trackInfoTpl{
	display:none;	
}

.infoDisplay {
	position:relative;
	color:#FFFFFF;
	font-size:11px;
}

.infoDisplay * {
	color:#FFFFFF;
	font-size:11px;
}

.normalSize .infoDisplay * {
    color:#454545;
}

.infoDisplay{
	position:relative;
	 width:100% ;
}

.infoDisplayItem {
	position:relative;
	 width:100% ;
	 float: left;
}

.infoDisplayText { 
	float:left;
	width:60px;
}

.infoString{
	float:right;
	clear:right;
	
	color:#FFFFFF;
	font-size:11px;
	font-weight:bold;
}

.normalSize .infoString * {
    color:#454545;
}

#trackCompareFinder {
    /* Place the div off the bottom right of the map */  
    position: relative;  
	float:left;
	width: auto;
    height:auto;

	padding:5px;
    padding-left: 9px;  
    padding-right: 5px;
	
    padding:0px;
	margin-left:-4px;
  
    /* Semi-transparent background */
    background-color: #505050;  
    background-color: rgba(0,0,0,0.6);
    background:none;
    color: white;  
    font-size: 80%;  
    /* Rounded top left corner */  
    border-top-right-radius: 10px;  
    -moz-border-radius-topright: 10px;  
    -webkit-border-top-right-radius: 10px;  

    border-bottom-right-radius: 10px;  
    -moz-border-radius-bottomright: 10px;  
    -webkit-border-bottom-right-radius: 10px;

    display:block;
}  

#trackCompareFinder div {
	padding:2px;
}

#trackFinderTplMulti {
	display:none;
}


/* wide for multiple tracks
*/
#trackDetails {  
    /* Place the div off the bottom right of the map */  
    position: absolute;  

	width: 400px;
    height:auto;
    bottom:20px;

	padding:5px;
    padding-left: 9px;  
    padding-right: 5px;
    
    /* Semi-transparent background */
    background-color: #505050;  
    background-color: rgba(0,0,0,0.6);  
    color: white;  
    font-size: 80%;  
    /* Rounded top left corner */  
    border-top-right-radius: 10px;  
    -moz-border-radius-topright: 10px;  
    -webkit-border-top-right-radius: 10px;  

    border-bottom-right-radius: 10px;  
    -moz-border-radius-bottomright: 10px;  
    -webkit-border-bottom-right-radius: 10px;  
}  

#trackInfoTplMulti {
	display:none;
}

.trackDisplayItem {
	position:relative;
	

	float: left;
	border-bottom:1px solid  rgba(40,40,40,0.8);  
}

.trackDisplayItem .color	{
	width:14px;
	height:14px;
	margin-right:3px;

	border-radius: 2px;  
    -moz-border-radius: 2px;  
    -webkit-border-top: 2px;  
}

#trackCompareFinderHeader, #trackCompareFinderHeaderAct , 
#trackCompareFinderHeaderClose, #trackCompareFinderHeaderMore  {
 	font-size:14px;
	font-weight:bold;
	text-align:center;
	cursor:pointer;
}


#trackCompareFinderHeaderExpand { 
	display:none;
	width:380px;
	overflow:hidden;
}

div#trackCompareFinderHeaderAct {
	padding-left:20px;
	padding-right:20px;
}
#trackCompareFinderHeaderAct {
	float:right;
	background: none repeat scroll 0 0 #175196;
	border: 1px solid #E3E3E3;
	border-radius: 5px;  
    -moz-border-radius: 5px;  
    -webkit-border-top: 5px; 
}

#trackCompareFinderHeaderMore
{
    background: none repeat scroll 0 0 #EEC132;
	border: 1px solid #E3E3E3;	
	float: right;
	clear:both;
	font-size: 11px;
	width: auto;
	padding-left:10px;
	padding-right:10px;
	border-radius: 5px;  
    -moz-border-radius: 5px;  
    -webkit-border-top: 5px;
	display:none;

}

#trackCompareFinderHeaderClose {
    background: none repeat scroll 0 0 #373737;
	border: 1px solid #E3E3E3;
	
	float: left;
	font-size: 11px;
	width: 70px;
	border-radius: 5px;  
    -moz-border-radius: 5px;  
    -webkit-border-top: 5px;

}

#trackCompareFinderHeader 	 {display: block;float:left; width:400px;}
#trackCompareFinderList		 {display: none; clear:both; float:left; width:400px;}


.trackDisplayItem .date		{
background: none repeat scroll 0 0 #967D7D;
background: none;
text-align: left;
width: 70px;
}
.trackDisplayItem .score	{
background: none repeat scroll 0 0 rgba(144, 139, 164, 0.57);
background: none;
text-align: right;
width: 55px;}
.trackDisplayItem .info		{width:36px;}
.trackDisplayItem .glider	{width:50px; ;text-align:center;}
#trackCompareFinder .trackDisplayItem .name 	{width:115px;text-align:left;}
.trackDisplayItem .tick		{width:20px;text-align:center;}

.trackDisplayItem .tick	input { width:23px; height:23px; cursor:pointer;}

.trackDisplayItem .name		{width:150px;}
.trackDisplayItem .alt		{width:55px;}
.trackDisplayItem .speed	{width:70px;}
.trackDisplayItem .vario 	{width:75px;}


.trackStr, .trackListStr {
	float:left;
	clear:none;
	display:inline;
 	width:80px;
	color:#FFFFFF;
	font-size:10px;
	font-weight:bold;
	text-align:right;
	border:1px solid #000000;
	border:none;
	padding:2px;
}

#timeDiv {
	font-size:15px;
	font-weight:bold;
	text-align:center;
}

/* some fancy checkboxes */
.label_check input,
.label_radio input  { margin-right: 5px; }

.has-js .label_check,
.has-js .label_radio    { padding-left: 34px; }
.has-js .label_radio    { background: url(img/radio-off.png) no-repeat; }
.has-js .label_check    { background: url(img/check-off.png) no-repeat; }
.has-js label.c_on      { background: url(img/check-on.png) no-repeat; }
.has-js label.r_on      { background: url(img/radio-on.png) no-repeat; }
.has-js .label_check input,
.has-js .label_radio input  { position: absolute; left: -9999px; }

 /* google maps control button styling */
.controlButton {
	-moz-user-select: none;
	background: none repeat scroll 0 0 #CDD8FF;
	border: 1px solid #717B87;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
	color: #000000;
	cursor: pointer;
	direction: ltr;
	font-family: Arial,sans-serif;
	font-size: 13px;
	font-weight: normal;
	margin-top: 5px;
	min-width: 29px;
	overflow: hidden;
	padding: 1px 7px;
	text-align: center;
}

.skywaysButton {
	margin-right: 15px;
	background: none repeat scroll 0 0 #F7DC59;	
}

.skywaysButtonPressed {
	background: none repeat scroll 0 0 #D9AC1D;
	color:white;
}

.trackToprow {
    margin-top:-20px;
}
.trackTopLineA {
    float:left;
    border-top: 1px solid #EFEFEF;
    background: linear-gradient(to bottom, #F6F6F6 0%, #FFFFFF 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    padding:4px;
}

.trackTopLine {
    float:left;
    background: linear-gradient(to bottom, #F6F6F6 0%, #FFFFFF 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);

    margin-left:0px;
    padding-left:5px;
    width:882px;
}

.trackTopLineC {
    float:left;
    margin-left:0px;
    padding-left:5px;
    width:882px;
    background: #FFFFFF;
    border-top: none;
    height: auto;
}

.trackTopLine {
    border-bottom: 1px solid #EFEFEF;
    border-top: 1px solid #EFEFEF;
    border-bottom: 1px solid #E9E9E9;
    height: auto;
}





.trackSegLine {
    background: linear-gradient(to bottom, #F6F6F6 0%, #FFFFFF 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: left;
    margin-bottom: 15px;
    margin-left: 0;
    padding-left: 0;
    width: 100%;
    border-top: 1px solid #EFEFEF;
    height: auto;
}


.trackSegLineShortXX:hover {
    background: #f8fdff;
    border-top:2px solid #b5df21;
    pointer:cursor;
}


.trackSegLineShort {
    background: linear-gradient(to bottom, #F6F6F6 0%, #FFFFFF 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: left;
    margin-bottom: 5px;
    margin-left: 0;
    padding-left: 0;
    width: 100%;
    border-top: 1px solid #EFEFEF;
    height: 50px;
    pointer:cursor;
}

.trackSegLineShortActive {
    background: #ebffe5;
    border-top:2px solid #b5df21;
}

.trackSegItem:first-child {
    background-position: 3px 20px;
    padding-left: 5px;
}
.trackSegItem {
    background-position: 0 20px;
    background-repeat: no-repeat;
    border-right: 1px solid #EFEFEF;
    min-height: 55px !important;
    padding: 0 0 5px 5px;
}

.trackSegItem h3 {
    font-size: 11px;
    text-transform: uppercase;
    color:#555555;
    margin-top:4px;
    margin-bottom:2px;
}


.trackSegLineShort .trackSegItem {
    min-height: 25px !important;
}

.trackSegLineShort .trackSegItem h3 {
    font-size: 14px;
    text-transform: uppercase;
    min-height: 25px !important;
}



.trackSegItem h5 {
    color: #555555;
    font-size: 9px;
    height: 27px;
    margin-bottom: 2px;
    margin-top: 4px;
    text-transform: uppercase;
}
.trackSegItem h1 {
    margin-top:5px;
    margin-bottom:2px;
}
.trackSegItem h1 .value {
    color: #444444;
    float: right;
    font-size: 12px;
    font-weight: normal;
    padding: 3px 4px 0 0;
}




#totalDistance.trackTopItem {
    background-image: url("/img/icon_route_36.png");
}
#totalDuration.trackTopItem {
    background-image: url("/img/icon_stopwatch_36.png");
}

.row-fluid [class*="span"] {
    -moz-box-sizing: border-box;
    display: block;
    float: left;
    margin-left: 2.12766%;
    min-height: 28px;
    width: 100%;
}

.row-fluid .span3 {
    width: 23.4043%;
    margin-bottom:0;
    margin-top:4px;
    margin-left:6px;
    margin-right:6px;
}

.row-fluid .span4 {
    margin: 4px 2px 0;
    width: 23.4043%;
}


.trackTopItem:first-child {
    background-position: 3px 20px;
    padding-left: 8px;
}
.trackTopItem:last-child {
    border: medium none;
}
.trackTopItem {
    background-position: 0 20px;
    background-repeat: no-repeat;
    border-right: 1px solid #EFEFEF;
    min-height: 55px !important;
    padding: 0 0 5px 5px;
}

.trackTopItem h5 {
    font-size: 11px;
    text-transform: uppercase;
    color:#555555;
    margin-top:4px;
    margin-bottom:2px;
}

.trackTopItem h1 {
    margin-top:5px;
    margin-bottom:2px;
}
.trackTopItem h1 .value {
    float: right;
    font-size: 29px;
    font-weight: normal;
    padding: 5px 14px 0 0;
    color:#444444;
}

.trackTopItem h3 {
    font-size: 11px;
    text-transform: uppercase;
    color:#555555;
    margin-top:4px;
    margin-bottom:2px;
}

.trackTopItemC {
    font-size: 11px;
    color:#555555;

    padding-right: 8px;
}

.trackTopItemC div {
    margin-top:7px;
    text-align: right;
}


.leftCol {
    margin-left:10px;
}


#row2_4.boxgridStatusOk {
    background: none repeat scroll 0 0 #F4F7FF;
    margin: 0;
    margin-left: -7px;
    width: 232px;
    height: 64px;
}

#row2_4.boxgridStatusNotTerminated {
    background: none repeat scroll 0 0 #F7F7F7;
    margin: 0;
    margin-left: -7px;
    width: 232px;
    height: 64px;
}
#row2_4.boxgridStatusLive {
    background: none repeat scroll 0 0 #F4F9E9;
    margin: 0;
    margin-left: -7px;
    width: 232px;
    height: 64px;
}
#row2_4.boxgridStatusProblem {
    background: none repeat scroll 0 0 #FFE8E8;
    margin: 0;
    margin-left: -7px;
    width: 232px;
    height: 64px;
}


/* cesium specific */

.cesium-animation-rectButton {

}
