/*//////////////////////////////////////////////////////////////////////////////
//
//  THIS CODE IS NOT APPROVED FOR USE IN/ON ANY OTHER UI ELEMENT OR PRODUCT COMPONENT.  
//  Copyright (c) 2009 Microsoft Corporation.  All rights reserved.
//
//////////////////////////////////////////////////////////////////////////////*/

#PlaceDockedMode, #PlaceDockedModeDropShadow 
{
  position:absolute;
  top:34px;
  left:6px;
}


#PlaceHrefDockedMode , #PlaceDockedModeDropShadow 
{
  width:104px;
  font-size:12px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis; 
  z-index:7;
  text-align:right;
}



#PlaceDockedMode a, #PlaceDockedMode visited 
{
  text-decoration:none;
}



#PlaceHrefDockedMode:hover 
{
  text-decoration:underline;
}


.BIDI #PlaceDockedMode 
{
  text-align:right; 
}

.GRAYDocked #TemperatureCurrent, .GRAYDocked #PlaceHrefDockedMode, .GRAYDocked #PlaceHrefDockedMode:visited
{
  color:Black;
}

.BLUEDocked #TemperatureCurrent, .BLUEDocked #PlaceHrefDockedMode, .BLUEDocked #PlaceHrefDockedMode:visited
{
  color:Black;
}

.BLACKDocked #TemperatureCurrent, .BLACKDocked #PlaceHrefDockedMode, .BLACKDocked #PlaceHrefDockedMode:visited
{
  color:White;
}


/*//////////////////////////////////////////////////////////////////////////////
//
// BackDrop BLUE
//
//////////////////////////////////////////////////////////////////////////////*/
.BLUE #TemperatureCurrent,
.BLUE #TemperatureCurrentUnDockedMode, .BLUE #TemperatureSeparator,
.BLUE #PlaceUnDockedMode, 
.BLUE #PlaceDockedMode, 
.BLUE #ConditionCurrentUnDockedMode,
.BLUE #TemperatureHigh0,
.BLUE #TemperatureLow0,
#PlaceHrefUnDockedMode,
#PlaceHrefUnDockedMode:visited, 
#PlaceHrefDockedMode,
#PlaceHrefDockedMode:visited 
{
  color:black;
}


/*//////////////////////////////////////////////////////////////////////////////
//
// BackDrop GRAY
//
//////////////////////////////////////////////////////////////////////////////*/
.GRAY #TemperatureCurrent,
.GRAY #PlaceDockedMode,
.GRAY #TemperatureCurrentUnDockedMode, 
.GRAY #PlaceUnDockedMode,
.GRAY #PlaceHrefUnDockedMode, .GRAY #PlaceHrefUnDockedMode:visited, 
.GRAY #PlaceHrefDockedMode, .GRAY #PlaceHrefDockedMode:visited 
{
  color:black;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// BackDrop BLACK
//
//////////////////////////////////////////////////////////////////////////////*/
.BLACK #TemperatureCurrent,
.BLACK #PlaceDockedMode,
.BLACK #TemperatureCurrentUnDockedMode, 
.BLACK #PlaceUnDockedMode,
.BLACK #PlaceHrefUnDockedMode, .BLACK #PlaceHrefUnDockedMode:visited,
.BLACK #PlaceHrefDockedMode, .BLACK #PlaceHrefDockedMode:visited,
.BLACK #ConditionCurrentUnDockedMode, .BLACK #TemperatureSeparator,
.BLACK #TemperatureHigh0,
.BLACK #TemperatureLow0 
{
  color:#F0F0F0;
}






#SensorIconDockedMode
{
  position:absolute;
  width:10px;
  height:10px;
  z-index:7;
  left:112px;
}

#SensorIconDockedMode
{
  top:36px;
}



.BIDI #SensorIconDockedMode

{
  right:8px;
}


#SensorIconUndockedMode
{
  position:absolute;
  width:10px;
  height:10px;
  z-index:99;
  left:230px;
  top:81px;
}

.BIDI #SensorIconUndockedMode
{
  right:26px;
}



#Attribution 
{
  position:relative;
  float:left;
  text-align:left;

  left:4px;
  width:49px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:12px;
  font-weight:lighter;
  z-index:99;
  visibility:inherit;
  padding-top:3px;
  padding-bottom:3px;
}
.BIDI #Attribution
{
  float:right;
  text-align:right;
  right:5px;
}

#AgeStampTextUndockedMode
{
  text-align:right;
  position:relative;
  left: 17px;
  float: left;
  width:157px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:11px;
  color:White;
  z-index:99;
  visibility:inherit;
  padding-top:4px;
  padding-left:2px;
}

.BIDI #AgeStampTextUndockedMode
{
  float:right;
  text-align:left;
  right:22px;
}

#AgeStampTextDockedMode
{
  position:absolute;
  left: 22px;
  top:48px;
  width:98px;

  text-align:right;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:11px;
  color:White;
  z-index:99;
  visibility:inherit;
}

.BIDI #AgeStampTextDockedMode
{
  text-align:left;
  right:24px;
}


#WeatherGadget 
{
  background: url(images/parts/BLACKDOCKED-base.png) no-repeat;  
  position:absolute;
  font-family:Segoe UI, Tahoma;
  table-layout:fixed; 
  scroll:no;
  padding:0;
  margin:0;
  width: 130px;
  height: 67px;
  background-repeat:no-repeat;
  background-position:top left;
}

div 
{ 
  position:absolute; 
}

table
{ 
  padding:0; 
  margin:0; 
  visibility:inherit;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// Gadget DOCKED
//
//////////////////////////////////////////////////////////////////////////////*/

#DockedModeDisplayArea,
#DockedModeCurrentConditionsText, #DropShadowDockedMode
{
  width:130px;
  height:67px;
  top:0;
  left:0;
  margin:0;
  padding:0;
  visibility: inherit;  
  position:absolute;
}


#DockedModeDisplayArea 
{
  display:block;
  visibility:visible;
}

#DockedModeCurrentConditionsText 
{ 
  z-index:99;  
}

#DockedModeAccessibilityInformation 
{ 
  width:130px;
  height:67px;
  top:0;
  left:0;
  margin:0;
  padding:0;
  visibility: inherit;  
  position:absolute;
}


#PlaceDockedModeDropShadow 
{
  top:35px;
  left:7px;
}

#TemperatureCurrent, #TemperatureCurrentDropShadow 
{
  position:absolute;
  top:-3px;
  height:10px;
  width:120px;
  text-align:right;
  margin:0;
  padding:0;
  margin-left:4px;
  font-size:24px; 
  z-index:1;
}

#TemperatureCurrentDropShadow 
{
  top:-1px;
  margin-left:54px;
}

#PlaceDockedModeDropShadow, #TemperatureCurrentDropShadow  
{
  color:Black;
  z-index:-1;
}  


.BIDI .dockedWeatherMessage, .BIDI .dockedWeatherMessage img 
{
  float:right;
} 

.BIDI #TemperatureCurrent 
{
  margin-right:8px;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// Gadget UNDOCKED
//
//////////////////////////////////////////////////////////////////////////////*/
#UnDockedModeCurrentConditionsText, #UnDockedModeDisplayArea
{
  width:264px;
  height:194px;
  top:0;
  left:0;
  margin:0;
  padding:0;
  visibility: inherit;  
  position:absolute;
}

#UnDockedModeDisplayArea 
{
  visibility:hidden;
  display:none;
  float:right;
}

#UnDockedModeAccessibilityInformation 
{ 
  position:absolute;
  top:12px;
  left:14px;
  width:160px;
  height:80px;
  z-index:3;
}

#UnDockedModeForecasts 
{ 
  z-index:6; 
}
  
#UnDockedModeCurrentConditionsText 
{ 
  z-index:4; 
}

#Today  
{
  margin-left:124px;
  text-align:right;
  height:67px;
  width :116px;
  visibility :inherit;
}

#Today table 
{
  position:absolute;
  top:58px;
  right:0px;
}

#Today td 
{
  vertical-align:middle;
  padding:0px;
  width:33%;
}

#TemperatureSeparator 
{
  text-align:center;
  vertical-align:top;
  visibility:inherit;
  font-size:12px;
}

.BIDI #Today 
{
  margin-right:26px;
}

#TemperatureCurrentUnDockedMode 
{
  font-size: 32px;
  text-align:right;
  position:absolute;
  left:145px;
  width:95px;
  top:5px;
}

#ConditionCurrentUnDockedMode 
{
  position:absolute;
  left:32px;
  top:33px;
  padding-top:10px;
  vertical-align:bottom;
  font-size:12px;
  text-align:right;
  width:207px;
}

#PlaceUnDockedMode
{
  margin-left:18px;
  top:76px;
  text-align:right;
}

#PlaceUnDockedMode a, #PlaceUnDockedMode visited 
{
  text-decoration:none;
}

#PlaceHrefUnDockedMode 
{
  width:210px;
  font-size:14px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis; 
  z-index:99;
  text-align:right;
}

#PlaceHrefUnDockedMode:hover 
{
  text-decoration:underline;
}

.BIDI #PlaceUnDockedMode 
{
  margin-right:38px;
  text-align:right; 
}

#UnDockedModeForecasts
{
  position:absolute;
  bottom:20px;
  left:14px;
  right:20px; 
  z-index:7; 
}

#Forecasts 
{
  border-collapse:separate;
  table-layout: fixed;
  width:230px;
  margin:auto;
  padding:0;
}

.ForecastDay 
{
  text-align:left;
  font-weight:normal;
  vertical-align:bottom;
  padding-left:4px;

}

.BIDI .ForecastDay 
{
  text-align:right;
  font-weight:normal;
  padding-right:4px;
}

.ForecastSeparator 
{
  text-align:center;
  background:url('../images/divider-vertical.png') repeat-y;
}

.ForecastSeparatorHeaderSection 
{
  text-align:center;
  vertical-align:bottom;
}

.ForecastSeparatorHeaderSection div 
{
  position:relative; 
  top:10px;
  height:2px;
  vertical-align:bottom;
  background:url('../images/divider-vertical.png') repeat-y;
}

#Separator 
{
  position:relative; 
  top:2px;
  height:2px;
  vertical-align:bottom;
  text-align:left;
}

#Separator div 
{
  background:url('../images/divider-horizontal.png') repeat-x;
  width:228px;
  left:0px;
}

.TemperatureRange 
{
  margin:0;
  padding:0;
  padding-left:4px;  
  text-align:right;
  vertical-align:baseline;
}

.BIDI .TemperatureRange 
{
  padding-right:4px;
  text-align:left;
}
.TemperatureRange label 
{
  text-align:right;
}

.BIDI .TemperatureRange label 
{
  text-align:left;
}

.TemperatureHigh, .TemperatureLow 
{
  float:left;
  clear:both;
  color: #c85b2a;
  font-size:12px;
  white-space:nowrap;
}

.BIDI .TemperatureHigh, .BIDI .TemperatureLow 
{
  float:right;
}

#TemperatureHigh0, #TemperatureLow0 
{
  width:40px;
  text-align:right;
}

.DayOfWeek 
{
  text-decoration:none;
  font-size:11px;
  z-index:98;
}

.DayOfWeek:hover 
{
  text-decoration:underline;
}

.SkyCodeImage 
{
  position:relative;
}

.SkyCodeImage img 
{
  vertical-align:bottom;
  margin:0;  
  padding:0;
}


.GRAY #ConditionCurrentUnDockedMode a, .GRAY #TemperatureSeparator,
.GRAY #TemperatureHigh0,
.GRAY #TemperatureLow0  
{
color: #5b6062;
}

.GRAY .DayOfWeek, 
.GRAY .DayOfWeek:visited, 
.GRAY #UnDockedModeForecasts .TemperatureLow,
.GRAY #Attribution 
{
  color:#b5babe;
}

.GRAY #UnDockedModeForecasts .TemperatureHigh 
{
  color:#fbfbfb;
}

.BLUE .DayOfWeek, 
.BLUE .DayOfWeek:visited, 
.BLUE #UnDockedModeForecasts .TemperatureLow,
.BLUE #Attribution 
{
  color:#99CBFF; 
}

.BLUE #UnDockedModeForecasts .TemperatureHigh 
{
  color:#eeeeee;
}

.BLACK .DayOfWeek, 
.BLACK .DayOfWeek:visited, 
.BLACK #UnDockedModeForecasts .TemperatureLow,
.BLACK #Attribution 
{
  color:#a6a6a6;
}

.BLACK #UnDockedModeForecasts .TemperatureHigh 
{
  color:White;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// SERVICE STATUS MESSAGE
//
//////////////////////////////////////////////////////////////////////////////*/
#WeatherMessage 
{
  text-align:center;
  z-index:99;
}


#WeatherMessage table td 
{
  padding:0;
  margin:0;
  vertical-align:middle;
  text-align:center;
  color: #F0F0F0;

}

#WeatherMessageIcon, #PleaseWaitLoadingSpinner
{
  width:16px;
  margin-top:0px;
}

#WeatherMessageIcon {
  background:url('../images/info.png') no-repeat;
}

#message 
{
  padding-left:20px;
  display:inline-block;
}

.BIDI #message 
{
  padding-right:20px;
}

#message span 
{
  float:left;
  text-align:left;
  overflow:visible;
  vertical-align:bottom;
  margin:0;
  padding:0;
}

.BIDI #message span 
{
  text-align:right;
  padding-right:20px;
}

.unDockedWeatherMessage 
{
  position:absolute;
  width:264px;
  height:194px;
  left:0px;
  padding:15px;
}
.unDockedWeatherMessage span 
{
  font-size:12px;
}

.dockedWeatherMessage span 
{
  font-size:12px;
}

.unDockedWeatherMessage table td 
{
  width:165px;
  height:154px;
}

.dockedWeatherMessage 
{
  position:absolute;
  width:115px;
  height:57px;
  top:4px;
  left:6px;
  overflow:hidden;
}

.dockedWeatherMessage table td 
{
  width:120px;
  height:57px;
}
