/* Styling for the main body of the connect page */
html, body
{
    padding: 0px;
    margin: 0px;
    height:100%;
}

/* This style any system error messages that are shown in case of complete
 * failure.
 */
.errorPanel
{
    text-align:center;
    vertical-align:middle;
    border:1px solid #666666;
    margin-top:200px;
    margin-left:auto;
    margin-right:auto;
    display:block;
    height:150px;
    width:400px;
    padding-top: 50px;
    background-image: url("../images/panelHover.png");
    background-repeat:repeat-x;
    background-color:#EEEEEE;
}

/* Left Panel Container which holds the sub panels such as locator, legend  
 * controls etc and helps with the slider operation */
#leftPanel
{
    margin:8px 0 0 0;
    position: absolute; 
    left:0px; 
    height: 400px; 
    top: 0px; 
    z-index: 1001;
    background-color:#FFFFFF;
    overflow: auto;
}

/**
 * This is to prevent elements start to word-wrapping upon panel 
 * collapse. It needs to have the same width as #leftPanel
 */
#leftPanelContainer 
{
    position:relative;
    width: 285px; 
    height: 99%;
    overflow-x: hidden;
    overflow-y: auto;
}

/* 
  Locator Control
*/

/*  Panel which contains all the locator sub controls  */
#locatorContainer 
{
    border-top:1px solid #6666cc;
    border-left: 1px solid #6666cc;
    border-right: 1px solid #6666cc;
}



/* Hide the radio button that chooses search type - this is incomplete */
#locatorSearchType 
{
    display:none;
}

/* Hide the suggestions list also - this is incomplete */
.suggestionsListContainer 
{
    display:none;
}

/* Use for the Locator control and is control by the dojo locator control */
#locator
{
    height:33px;
    margin: 3px 0 0 0;
    padding:0 0 0 6px;
}

/* Panel controls three sub panels for locator control, locatorresult and error */
#resultsContainer
{
    clear: both;
    position: relative;
    overflow: hidden;
    padding:1px 0 0 0;
}

/* The error message that is displayed if no query is entered in locator input  */
#resultsContainer #error
{
    padding:0 0 0 6px;
    font-family:verdana;
    font-weight:bold;
    font-size:11px;
    color:#666666;
}

#result div
{
    padding:0 0 0 6px;
    font-family:verdana;
    font-weight:bold;
    font-size:11px;
    color:#666666;
}
/* This class is for LocatorSearch textBox - IE modifications */
#resultsContainer .dijitTextBox
{    
    font-size: 0.9em;
    color:#406b9b;
}

/* Use for the LocatorResults control and is control by the dojo
 * LocatorResults control and either shows the address results or a general 
 * message from the search server */
#result
{
    height: 0px;
    overflow-y: auto;
    overflow-x: hidden;
}

/* 
  Cached PreviousAddress
*/

/*  Panel which contains all the previously saved address controls  */
#cachedAddressContainer 
{
    overflow-y: auto;
    border-left: 1px solid #6666cc;
    border-right: 1px solid #6666cc;
    border-bottom: 1px solid #6666cc;
}

/* Displays the previously saved address from the LocatorResults control */
#cacheResultContainer
{          
    clear: both;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
}

/* Styles the width of the anchor link within a normal row cell */
#cacheResultContainer .normalCell a
{
   width:auto;
}


/* Displays find Nearest search results */
#findNearestContainer
{          
    padding-top: 1px;
    margin-left: 0;
    border-left: 1px solid #6666cc;
    border-right: 1px solid #6666cc;
    border-bottom: 1px solid #6666cc;
}

#findNearestContainer .findNearestContainerPanelHeader
{
    border-bottom: none;
}

/*  The results container widget itself for Find Nearest */
#findNearestResultContainer
{
    height: 0px;
    overflow: hidden;
}

/* Position and styling of clear fmn results */
#findNearestResultContainer .clearResults
{
    font-size:10px;
    font-family:Verdana;
    font-weight:bold;
    color:#3366CC;
    margin-right:7px;
    float: right;
}

/* Results container for Find My Nearest */
#findNearestResults
{
    height:190px; 
    border-top:1px solid #cccccc;
    overflow-y:auto;
}

*html #findNearestResults
{
    height:190px; 
    border-top:1px solid #cccccc;
    overflow-y:auto;
    overflow-x:hidden;
    width:100% !important;
}

/* 
  Legend Control
*/

/*  Master panel for the legend control  */
#legendContainer
{
    margin-left: 0;
    border-top:1px solid #6666cc;
    border-right:1px solid #6666cc;
    border-bottom:1px solid #6666cc;
    border-left:1px solid #6666cc;
    overflow-y:visible;
}

#legendInnerContainer
{
    overflow: hidden;
}

#legendContainer .panelHeader
{
    background-color:#9999ff;
    margin-left: 0;
}

#legendContainer #legend #legendInnerContainer ul.last
{
    background-color:#F0F0F0;
    width:auto;
    overflow: hidden;
}

#legendContainer #legend #legendInnerContainer ul div
{
    border-bottom:0px solid #FFFFFF;
}

#legendContainer #legend #legendInnerContainer ul ul div 
{
   height:23px;
   margin:0;
}

.legendControl li.childLayersStructure {
   margin:0 2px 0 0 !important;
}

/* 
  Panel Dialog Header for customising the header cell and the text within it
*/

/*  panel header for the legend control  */
div.locatorContainerPanelHeader,
div.cachedAddressContainerPanelHeader,
div.findNearestContainerPanelHeader
{
    height:auto;
    cursor: pointer;
    font-weight:bold;
    padding:4px 0 4px 6px;
    border-bottom:1px solid #9999ff;
    overflow: hidden;
    position:relative;
}

#leftPanelContainer .panelHeaderLabel
{
    padding:0 0 0 14px;
}

#legendContainer .panelHeaderLabel
{
    padding:0;
}


#legendContainer #legend .master
{
    padding:0 0 0 5px;
}

/* 
  Slider buttons for the slider control 
*/
#slider
{
    height: 1px; 
    position: absolute; 
    left: 285px; 
    top: 0px; 
    width: 15px; 
    background-color:#FFFFFF;
    z-index: 2;
    margin: 8px 0 11px 0;
}
            
#slider button
{
    height: 1px;
    display:block;
    width: 100%; /* This is required for IE6 */
    background-repeat: no-repeat;
    background-position: center;
    background-color:transparent;
    border: none;
    cursor: pointer;
    padding: 0px;
}

/* Slider icon area*/
#slider div.sliderIconCollapse
{
    height:15px;
    width:15px;
    margin-left:-2px;
}

/* IE7 Fix for the slider icon*/ 
*:first-child+html #slider div.sliderIconCollapse      
{
    margin-left:1px;
}

div.sliderIconCollapseHover
{
    height:15px;
    width:15px;
    margin-left:-2px;
}

/* IE7 Fix for the slider icon hover */
*:first-child+html #slider div.sliderIconCollapseHover
{
    margin-left:1px;
}

div.sliderIconExpandHover
{
    height:15px;
    width:15px;
    margin-left:-2px;
}

/* IE7 Fix for the slider icon expand hover  */
*:first-child+html #slider div.sliderIconExpandHover 
{
    margin-left:1px;
}

#slider div.sliderIconExpand
{
    height:15px;
    width:15px;
    margin-left:-2px;
}
/* IE7 Fix for the slider icon expand */
*:first-child+html #slider div.sliderIconExpand 
{
    margin-left:1px;
}

/* Used to style the arrow on the slider. This is used when it is expanded */
#slider button.sliderDefault:hover
{
    background-repeat: repeat!important;
}

/* Used to style the arrow on the slider. This is used when it is collapsed*/
#slider button.sliderCollapse:hover
{
    background-repeat: repeat!important;
}

/* The collapse and show buttons for the accordion map control*/
#leftPanelContainer #locatorContainer .panelHeaderLabel .treeExpandMinus,
#leftPanelContainer #locatorContainer .panelHeaderLabel .treeExpandMinusHover,
#leftPanelContainer #locatorContainer .panelHeaderLabel .treeExpandPlus,
#leftPanelContainer #locatorContainer .panelHeaderLabel .treeExpandPlusHover,

#leftPanelContainer #cachedAddressContainer .panelHeaderLabel .treeExpandMinus,
#leftPanelContainer #cachedAddressContainer .panelHeaderLabel .treeExpandMinusHover,
#leftPanelContainer #cachedAddressContainer .panelHeaderLabel .treeExpandPlus,
#leftPanelContainer #cachedAddressContainer .panelHeaderLabel .treeExpandPlusHover,

#leftPanelContainer #findNearestContainer .panelHeaderLabel .treeExpandMinus,
#leftPanelContainer #findNearestContainer .panelHeaderLabel .treeExpandMinusHover,
#leftPanelContainer #findNearestContainer .panelHeaderLabel .treeExpandPlus,
#leftPanelContainer #findNearestContainer .panelHeaderLabel .treeExpandPlusHover
{
    padding:0;
    margin:0;
    background-position: center;
    background-repeat: no-repeat;
    background-color:transparent;
    cursor:pointer;
    width:8px;
    height:8px;
}

/* Adjustment for the collapse and show buttons in the locatorContainer panel */
#locatorContainer .panelHeaderLabel .treeExpandMinus,
#locatorContainer .panelHeaderLabel .treeExpandMinusHover,
#locatorContainer .panelHeaderLabel .treeExpandPlus,
#locatorContainer .panelHeaderLabel .treeExpandPlusHover,

#cachedAddressContainer .panelHeaderLabel .treeExpandMinus,
#cachedAddressContainer .panelHeaderLabel .treeExpandMinusHover,
#cachedAddressContainer .panelHeaderLabel .treeExpandPlus,
#cachedAddressContainer .panelHeaderLabel .treeExpandPlusHover,

#findNearestContainer .panelHeaderLabel .treeExpandMinus,
#findNearestContainer .panelHeaderLabel .treeExpandMinusHover,
#findNearestContainer .panelHeaderLabel .treeExpandPlus,
#findNearestContainer .panelHeaderLabel .treeExpandPlusHover
{
   position:absolute;
   left:8px;
   top:8px;
}

#myMap
{
    height:1px;
    overflow: hidden;
    border: 1px solid #6666cc;
    margin:8px 0 10px 0;
}

/* the outer container for the map control which is used for the wipe in and wipe out
 * when the user expands the map to cover the whole width and to restore it its default position
 */
#mapContainer
{
    height:100%;
    padding-left: 300px;
    z-index: 1;
}

/* the content container which contains the left panel , map and slider*/
#content
{
    height: 1px; 
    overflow: hidden; 
    position: relative;
    border-top: 0px solid #87AFD1;
    margin:0 15px 0 15px;
}

/* the content container which contains the left panel , map and slider & banner */
#all
{
    height: 100%;
}

/*  Default settings for the body of the connect page */
html, body
{
    padding: 0px;
    margin: 0px;
    height: 100%;
}