/*//////////////////////////////////////////////////////////////////////////////
//
//  THIS CODE IS NOT APPROVED FOR USE IN/ON ANY OTHER UI ELEMENT OR PRODUCT COMPONENT.  
//  Copyright (c) 2006 Microsoft Corporation.  All rights reserved.
//
//////////////////////////////////////////////////////////////////////////////*/


#WeatherGadget 
{
/*  background: url(images/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;
}

#sidebar-weather .x-panel-body div 
{ 
  position:absolute; 
}

#sidebar-weather .x-panel-body table
{ 
  padding:0; 
  margin:0; 
  visibility:inherit;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// Gadget DOCKED
//
//////////////////////////////////////////////////////////////////////////////*/

#DockedModeDisplayArea,
#DockedModeCurrentConditionsVisual,
#DockedModeHighlight2,
#DockedModeCurrentConditionsText, #DropShadowDockedMode,
#WeatherStateDockedMode, #HighlightsDockedMode, #OrbStateDockedMode 
{
  width:130px;
  height:67px;
  top:0;
  left:0;
  margin:0;
  padding:0;
  visibility: inherit;  
  position:absolute;
}

#DockedModeHighlight1, #DockedModeHighlight2 
{
  width:123px;
  height:60px;
  position:absolute;
  left:3px;
  top:3px;
}

#DockedModeDisplayArea 
{
  display:block;
  visibility:visible;
}

#HighlightsDockedMode 
{
  position:absolute;
  left:0;
  top:0;
  z-index:6;
}

#DockedModeCurrentConditionsVisual 
{ 
  z-index:2; 
}

#DockedModeHighlight2 
{ 
  z-index:5;
}

#DockedModeCurrentConditionsText 
{ 
  z-index:99;  
}

#DockedModeHighlight1 
{ 
  z-index:3; 
}

#PlaceDockedMode, #PlaceDockedModeDropShadow 
{
  position:absolute;
  top:34px;
  width:116px;
  left:6px;
  font-size:12px;
  text-align:right;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis; 
  z-index:7;
}

#PlaceDockedModeDropShadow 
{
  top:35px;
  left:7px;
}

#TemperatureCurrent, #TemperatureCurrentDropShadow 
{
  position:absolute;
  top:-3px;
  height:10px;
  width:70px;
  text-align:right;
  margin:0;
  padding:0;
  margin-left:54px;
  font-size:24px; 
  z-index:1;
}

#TemperatureCurrentDropShadow 
{
  top:-1px;
  margin-left:54px;
}

#PlaceDockedModeDropShadow, #TemperatureCurrentDropShadow  
{
  color:Black;
  z-index:-1;
}  

#OrbStateDockedMode 
{	
  z-index:-1;
  position:absolute;
}

.BIDI .dockedWeatherMessage, .BIDI .dockedWeatherMessage img 
{
  float:right;
} 

.BIDI #TemperatureCurrent 
{
  margin-right:8px;
}

.GRAYDocked #TemperatureCurrent, .GRAYDocked #PlaceDockedMode 
{
  color:Black;
}

.BLUEDocked #TemperatureCurrent, .BLUEDocked #PlaceDockedMode 
{
  color:Black;
}

.BLACKDocked #TemperatureCurrent, .BLACKDocked #PlaceDockedMode 
{
  color:White;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// Gadget UNDOCKED
//
//////////////////////////////////////////////////////////////////////////////*/
#UnDockedModeCurrentConditionsVisual,
#UnDockedModeCurrentConditionsText,
#UnWeatherStateDockedMode, #UnDockedModeDisplayArea, #WeatherStateUnDockedMode
{
  width:264px;
  height:194px;
  top:0;
  left:0;
  margin:0;
  padding:0;
  visibility: inherit;  
  position:absolute;
}

#UnDockedModeHighlight1, #UnDockedModeHighlight2 
{
  position:absolute;
  margin:0;
  padding:0;
  top:1;
  left:1;
  width:230px;
  height:160px; 
}

#UnDockedModeDisplayArea 
{
  visibility:hidden;
  display:none;
  float:right;
}

#HighlightsUnDockedMode 
{
  position:absolute;
  left:12px;
  top:12px;
  padding:0;
  margin:0;
}

#UnDockedModeAccessibilityInformation 
{ 
  position:absolute;
  top:12px;
  left:14px;
  width:160px;
  height:80px;
  z-index:3;
}

#UnDockedModeForecasts 
{ 
  z-index:6; 
}
  
#UnDockedModeCurrentConditionsVisual 
{ 
  z-index:-2;
}

#UnDockedModeHighlight2 
{ 
  z-index:5;
}

#UnDockedModeCurrentConditionsText 
{ 
  z-index:4; 
}

#UnDockedModeHighlight1 
{ 
  z-index:3;
}

#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:222px;
  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:26px;
  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;
}

#Attribution 
{
  width:224px; 
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:12px;
  font-weight:lighter;
  z-index: 99;
  visibility:inherit;
  padding-top:1px;
  padding-bottom:3px;
  padding-left:4px;
  text-align:left;
}

.BIDI #Attribution 
{
  text-align:right;
  padding-right:4px;
}

.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;
}


/*//////////////////////////////////////////////////////////////////////////////
//
// BackDrop GRAY
//
//////////////////////////////////////////////////////////////////////////////*/
.GRAY #TemperatureCurrent,
.GRAY #PlaceDockedMode,
.GRAY #TemperatureCurrentUnDockedMode, 
.GRAY #PlaceUnDockedMode,
.GRAY #PlaceHrefUnDockedMode, .GRAY #PlaceHrefUnDockedMode:visited 
{
  color:black;
}

.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;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// BackDrop BLUE
//
//////////////////////////////////////////////////////////////////////////////*/
.BLUE #TemperatureCurrent,
.BLUE #TemperatureCurrentUnDockedMode, .BLUE #TemperatureSeparator,
.BLUE #PlaceUnDockedMode, 
.BLUE #ConditionCurrentUnDockedMode,
.BLUE #TemperatureHigh0,
.BLUE #TemperatureLow0,
#PlaceHrefUnDockedMode,
#PlaceHrefUnDockedMode:visited 
{
  color:black;
}

.BLUE .DayOfWeek, 
.BLUE .DayOfWeek:visited, 
.BLUE #UnDockedModeForecasts .TemperatureLow,
.BLUE #Attribution 
{
  color:#99CBFF; 
}

.BLUE #UnDockedModeForecasts .TemperatureHigh 
{
  color:#eeeeee;
}

/*//////////////////////////////////////////////////////////////////////////////
//
// BackDrop BLACK
//
//////////////////////////////////////////////////////////////////////////////*/
.BLACK #TemperatureCurrent,
.BLACK #PlaceDockedMode,
.BLACK #TemperatureCurrentUnDockedMode, 
.BLACK #PlaceUnDockedMode,
.BLACK #PlaceHrefUnDockedMode, .BLACK #PlaceHrefUnDockedMode:visited,
.BLACK #ConditionCurrentUnDockedMode, .BLACK #TemperatureSeparator,
.BLACK #TemperatureHigh0,
.BLACK #TemperatureLow0 
{
  color:#F0F0F0;
}

.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;
  height:16px;
  margin-left: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;
}