/*
* Copyright (c) 2016 The Weather Company, an IBM Business, Copyright (c) 1998-2015, WSI Corporation.
*/


	/* Set properties used throughout the control*/
	.wsi-chartControl
	{
		color:#003366;
		height:100%;
        padding-left: 15px;
	}   
	
	/* This is the bar that hangs from the nav header and has some controls in it */
	.wsi-hangingControlBar
	{
	    font-size:12px;
	    font-weight:bold;
    	color:#003366;
	    z-index:1;
		position: relative; 
        padding: 3px 0 7px 0;
	}
	
    .wsi-hangingControlBar span{
        padding-right: 10px;
    }
	
   
	.wsi-chartControl .wsi-chartViewer-subSectorArea
	{
		background: yellow;
	}   

	/* Set things specific to the title bar */
    .wsi-chartControl .wsi-chartControl-titleBar
    {
    	position: relative;
    	
		background:#fff url(../../Images/bg_container.gif) 1px 1px repeat-x;
		margin-bottom:0;
		border:solid 2px #d8e0f0;
		font-size:12px;
		font-weight:bold;
		height:24px;
    }

    /* This is for title text in the text bar */
    .wsi-chartControl .wsi-chartControl-titleBar-text
    {
        float: left;
    	margin-left: 10px;
    	margin-top: 7px;
    }

    .wsi-chartControl .wsi-chartControl-titleBar-noteText
    {
    	margin-left: 10px;
    	margin-top: 7px;
    	margin-right: 3px;
    }
    
    #clickToZoomLabel
    {
        line-height: 28px;
    }

    .wsi-chartControl .wsi-chartControl-titleBar-buttonGroup
    {
        float: right;
        height: 18px;
    }

    .wsi-chartControl .wsi-chartControl-titleBar-button
    {
        margin: 0;
        border-top: 0;
        border-bottom: 0;
        border-right: 0;
    }

	/* The buttons on the right side of the chart image title bar: overriding some jQueryUI button settings */
	.wsi-chartControl .smallButton .ui-button-text 
	{ 
		padding: 0;
		margin-left: 10px;
		margin-right: 10px;
		margin-bottom: 0;
	}
    
    /* This can be used on any control on the left edge*/
    .wsi-chartControl .wsi-chartControl-topControlBar-contents-leftGroup-leftmost
    {
    	float: left;
    	margin-top: 3px;
    	margin-left :10px;
    }

    /* This can be used on any control in the top control bar */
    .wsi-chartControl .wsi-chartControl-topControlBar-contents
    {
        float:none;
        margin-top: 3px;
        margin-left: 4px;
    }
    
    #chartPrintingCanvas
    {
        display: block;
        position: absolute;
        visibility: hidden;
    }
   
    /* This can be used on any text label in the top control bar */
    .wsi-chartControl .wsi-chartControl-topControlBar-contents-label
    {
    	
    	margin-top: 4px;
    	margin-left: 10px;
    }
    
    /* This is for the leftmost control shown in the center control group of the top bar */
   .wsi-chartControl .wsi-chartControl-centerGroup-leftmost
    {
    
    	margin-left : 5px;
    }

   .wsi-chartControl .wsi-chartControl-frame3D-container
   {
       display: flex;
   }
    
	/* Frame on the left of the chart image */	
	.wsi-chartControl .wsi-chartControl-frame3D-left
	{
    	position: relative;

		background:#fff url(../../Images/bg_container_l.gif) 0 0 repeat;
		width: 10px;

		border-left:solid 2px #d8e0f0;
		border-top:0;
		border-bottom:0;
		border-right:0;
		flex-grow: 1;
	}

	.wsi-chartControl .wsi-chartControl-frame3D-center
	{
    	position: relative;
        overflow:hidden;
		display:flex;
	}

	/* Frame on the right of the chart image */
	.wsi-chartControl .wsi-chartControl-frame3D-right
	{
    	position: relative;

		background:#fff url(../../Images/bg_container_r.gif) 0 0 repeat;
		width: 10px;

		border-left:0;
		border-top:0;
		border-bottom:0;
		border-right:solid 2px #d8e0f0;
        flex-grow: 1;
	}

	.wsi-chartControl .wsi-chartControl-statusText
	{
	    background:transparent;
    	position: relative;
        border:0;	    
	    padding-left:10px;
	}
	
	.ws-chartControl .wsi-chartControl-overlayCombo
	{
	    z-index:100;
	}
	
	.wsi-chartControl .wsi-chartControl-belowFrameGutter
	{
	    background:transparent;

    	position: relative;
	    top: 0;

        border:0;
	    height:25px;
	}
	
	/* Frame on bottom of the chart image*/
	.wsi-chartControl .wsi-chartControl-frame3D-bottom
	{
    	position: relative;
    	
		background:#fff url(../../Images/bg_container_b.gif) 0 0 repeat-x;
		padding:0;
		margin-bottom:0;
		border-left:solid 2px #d8e0f0;
		border-top:0;
		border-bottom:0;
		border-right:solid 2px #d8e0f0;
		height:10px;
	}
	
	/* Thick frame vertically above the chart image, with controls in it */
    .wsi-chartControl .wsi-chartControl-frame3D-top
    {
    	/* Move 15px in from left of parent */
    	position: relative;

		background:#fff url(../../Images/bg_container.gif) 0 0 repeat-x;
		padding:0;
		margin-bottom:0;
		border-left:solid 2px #d8e0f0;
		border-top:solid 2px #d8e0f0;
		border-bottom:0;
		border-right:solid 2px #d8e0f0;
		font-size:12px;
		font-weight:bold;
		height:24px;
		z-index:3000; /*Necessary to fix IE quirk bug with controls on the bar*/
        display:flex;
        justify-content: space-between;
    }
    
   
	.wsi-chartControl-chartsPosition
	{
		position:absolute;
		top:0;
		left:0;
		float:left;
	}

	
	.wsi-chartControl #chartImageArea
	{
    	/* Move 15px in from left of parent */
    	position: relative;
    	left: 15px;
    	top: 0;
	}

    .wsi-chartControl-chartImage-frameresizing
    {
        opacity: 0;
    }

    .wsi-chartControl-chartImage
    {
        position: absolute;
        top: 0;
        left: 0;
    }	

	.wsi-chartViewer-chartImage
	{
		position:absolute;
		top:0;
		left:0;
		z-index:1;
	}
	
	.wsi-chartViewer-overlayImage-1
	{
		position:absolute;
		top:0;
		left:0;
		z-index:2;
	}

	.wsi-chartViewer-overlayImage-2
	{
		position:absolute;
		top:0;
		left:0;
		z-index:3;
	}
	
	.wsi-chartViewer-overlayImage-3
	{
		position:absolute;
		top:0;
		left:0;
		z-index:4;
	}

	.wsi-chartViewer-overlayImage-4
	{
		position:absolute;
		top:0;
		left:0;
		z-index:5;
	}

	.wsi-chartViewer-overlayImage-5
	{
		position:absolute;
		top:0;
		left:0;
		z-index:6;
	}


	.wsi-chartControl #zoomSliderContainer
	{
		position: absolute;
		left : 513px;
		top : 45px;
		width : 253px; /* 250 for control, 2 for border, 1 for drag handle border*/
		height : 42px;
		margin-bottom : 2px;
		border: 1px solid white;
		background-color: Navy;
		opacity: 0.8;
		filter: alpha(opacity=80);
		z-index:10;
	}
	
	.wsi-chartControl #altitudeSliderContainer
	{
		border: 1px solid white;
		position: absolute;
		left : 3px;
		top : 45px;
		width : 70px;
		height : 252px;
		opacity: 0.8;
		filter: alpha(opacity=80);
		background-color: Navy;
		z-index:10;
	}

	.wsi-chartControl .dragHandleForHorizontalControl
	{
		float:left;
		height: 100%;
		width: 10px;
		background: Navy;
		border-right: 1px solid white;
	}

	.wsi-chartControl .dragHandleForVerticalControl
	{
		position: absolute;
		top:0;
		left:0;
		height: 10px;
		width: 100%;
		background: Navy;
		border-bottom: 1px solid white;
	}
	
	.ui-multiselect.wsi-chartControl-overlayCombo
	{
		height: 18px;
		width:100px;
	}
	
	.wsi-chartControl .wsi-chartControl-animationBar
	{
	    margin-left:10px;
	    margin-right:2px;
	    padding:1px 5px 0 5px;
	    background:white;
	    border:1px solid #d8e0f0;
	    height:20px;
	}
	
	.wsi-chartControl .wsi-chartControl-animationBar-buttonsArea
	{
	    float:left;
	    height:18px;
	    border-right:1px solid #d8e0f0;
	    margin-right:2px;
	    padding-right:2px;
	    margin-left:0;
	}
	
	
	.wsi-chartControl .animationBarVertCenterText
	{
	    position: relative;
	    top: 0;
	    margin-top:1px;
	    margin-bottom:1px;
	    margin-left:2px;
	}

	.wsi-chartControl .animationBarVertCenterCombo
	{
	    position: relative;
	    top: 0;
	    margin-top:1px;
	    margin-bottom:1px;
	}
	
	.wsi-chartControl .animationButton
	{
	    margin-top:1px;
	    margin-bottom:1px;
	    width: 18px;
	    height: 16px;
	}
	#ServicePlanForMiniRegistration .WebPortalParagraph
	{
		width: 385px; 
		margin-left: 5px; 
		margin-top: 5px;
	}
	#ServicePlanForMiniRegistration .WebPortalParagraph .strong
	{
		font-weight:bold;
		font-size:14px;
		text-align:center;
	}
	#ServicePlanForMiniRegistration #RegistrationTitle
	{
		background-color:#003366;
		color:white;
		text-align:center;
		font-size:14px;
		font-family:Arial;
		height:22px;
		border-top: 2px solid #ffcc00;
		padding-top:2px;
	}
	#ServicePlanForMiniRegistration #RedirectToWebPortal
	{
		height:25px;
		width:100px;
		margin-bottom:30px;
		font-weight:bold;
	}
	#ServicePlanForMiniRegistration .WebPortalParagraph .image
	{
		margin-right:4px;
	}
	#ServicePlanForMiniRegistration .WebPortalParagraph p,li
	{
		 font-size: 12px;
	}
	#ServicePlanForMiniRegistration .WebPortalParagraph li img
	{
		padding-left: 10px;
		vertical-align: middle;
	}
	#ServicePlanForMiniRegistration .WebPortalParagraph li
	{
		 padding-bottom: 10px;
	}
	#miniregistration
	{
        /* comment the height out when Zoura re-enabled */
		height:496px;
		width:334px;
		margin-left: 5px;
	}
	#miniregistration .left-fields input, #miniregistration .right-fields input
	{
		width: 150px;
	}
	#miniregistration .right-fields
	{
		float:right;
	}
	#miniregistration #Register
	{
		float:right;
		text-align:right;
		display:inline;
		margin-right:10px;

	}
#ServicePlanForMiniRegistration #ServicePlanWrapper
{
	padding-left:5px;
	padding-right: 5px;
	width: 340px;
}
#miniregistration .required {color: #FF0000;}
#EmailErrorLabel{color: #FF0000;}
#FirstNameErrorLabel{color: #FF0000;}
#PasswordErrorLabel{color: #FF0000;}
#LastNameErrorLabel{color: #FF0000;}
#ConfirmPasswordErrorLabel{color: #FF0000;}
#DisclaimerError{color: #FF0000;}
#SubmitMiniRegistration {padding:0; margin:0;width:60px;height:20px;}
#SubmitMiniRegistration #CancelReg {display:block; float:right;}
#CancelReg {padding-left:10px;height:15px;}
#miniregistration a, a:visited, a:active, a:hover {color:#7A8293; text-decoration:underline;}

.wsi-IntroPopupControl .content
{
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    visibility: hidden;
}

.wsi-IntroPopupControl p,li
{
    font-size: 12px;
}

.wsi-IntroPopupControl li span, .wsi-IntroPopupControl li img
{
    padding-left: 10px;
    vertical-align: middle;
}

.wsi-IntroPopupControl li
{
    padding-bottom: 10px;
}

.wsi-IntroPopupControl .emphasize
{
    font-size:13px;
    font-weight: bolder;
    padding-top: 10px;
    padding-bottom: 5px;
}

.wsi-IntroPopupControl .ccSeparator
{
    margin-top: 20px;
    border-top-style: solid;
}

.dontShow
{
    padding-top: 10px;
    float: right;
    padding-right: 20px;
}

.dontShow input, .dontShow span
{
    vertical-align: middle;
    font-size: 12px;
}

.wsi-marketingTagLine
{
    padding-left: 25px;
    font-weight: bold;
    font-size: 14px;
    width: 795px;
    padding-top: 485px;
}

.wsi-marketingTagLine a,a:hover,a:visited
{
    color: #2c7ecf;
    text-decoration: underline;
}