﻿
/* Forms */


.urlBox
{
    width: 500px;
}


.simpleBox
{
    width: 300px;
}

.simpleBox2
{
    width: 200px;
}

.textAreaSize
{
    width:300px;
    height:100px;
}

a.block
{
    display: block;
    float:left;
}


/* BOX */

.box div
{
    font-family: Arial;
}

.title
{
    font-size: 11px;
    font-weight: bold;
    font-family: Arial;
    color: #000000;
}

.question
{
    font-size: 12px;
    font-family: Arial;
    margin-bottom: 5px;
}

.answer
{
    font-size: 11px;
    font-family: Arial;
    margin-bottom: 10px;
}

.answerBold
{
    font-size: 11px;
    font-family: Arial;
    margin-bottom: 10px;
    font-weight: bold;
}

select, input, textarea
{
    font-size: 11px;
    font-family: Arial;
}

.TinyBox
{
    width: 50px;
}

.box
{
    float:left;
    padding-right: 10px;
}

.boxSpace
{
    padding-right: 50px;
}

.boxFull
{
    float:left;
    width: 100%;
}

.BigBox
{
    width: 300px;
}

.SmallBox
{
    width: 100px;
}

.MediumBox
{
    width: 200px;
}

.MessageBox
{
    display: block;
    margin-bottom: 20px;
}

.MessageError
{
    display: block;
    margin-bottom: 20px;
    color: #ff0000;
}

.FunctionInactive
{
    display: block;
    color: #ff0000;
}


/* OverviewPage */


    #PageBodyContentContainer #OverviewModulesArea
    {
        float:left;
        width:100%;
        height:400px;
        /*background-color:#f2f1ed;*/
        background-color:#ffffff;
    }
    
    #PageBodyContentContainer > #OverviewModulesArea
    {
        height: auto;
        min-height: 400px;
    }
    
    #OverviewModulesArea .OverviewModule
    {
        float:left;
        /*margin: 0px 15px 15px 0px;*/
        /*margin: 15px;*/
        /*margin: 15px 60px 15px 15px;*/
        margin: 15px 60px 15px 0px;
    }

        #OverviewModulesArea .OverviewModule .OverviewModuleInside
        {
            float:left;
            padding: 15px 10px 10px 20px;
            height: 145px;
            width: 180px;
        }
    
        #OverviewModulesArea .OverviewModule .OverviewModuleTitle
        {
            float:left;
            /*padding: 10px 0px 0px 20px;*/
            padding-left: 5px;
            width: 140px;
            font-family: Trebuchet MS, Tahoma, Verdana, Arial;
            font-weight: bold;
            font-size: 12px;
            color: #000000;
            border-style: solid;
            border-width: 0px 0px 1px 0px;
            border-color: #000000;
            clear:both;
        }
        
        #OverviewModulesArea .OverviewModule .OverviewModuleContent
        {
            float:left;
            padding-top:5px;
            padding-left: 5px;
            width: 165px;
            height: 120px;
            overflow: hidden;
        }
    
    #OverviewModulesArea .OverviewModuleMessage
    {
        float:left;
        background: url(/design/images/modul_vit_message1.jpg) no-repeat;
        width: 210px;
        height: 170px;
    }
    
    #OverviewModulesArea .OverviewModuleElectricity
    {
        float:left;
        background: url(/design/images/modul_vit_electricity1.jpg) no-repeat;
        width: 210px;
        height: 170px;
    }

    #OverviewModulesArea .OverviewModuleBoende
    {
        float:left;
        background: url(/design/images/modul_vit_boende1.jpg) no-repeat;
        width: 210px;
        height: 170px;
    }

    #OverviewModulesArea .OverviewModuleSettings
    {
        float:left;
        background: url(/design/images/modul_vit_settings1.jpg) no-repeat;
        width: 210px;
        height: 170px;
    }
    
    #OverviewModulesArea .OverviewModuleInformation
    {
        float:left;
        background: url(/design/images/modul_vit_information1.jpg) no-repeat;
        width: 210px;
        height: 170px;
    }

    #OverviewModulesArea .OverviewModuleHeating
    {
        float:left;
        background: url(/design/images/modul_vit_heating1.jpg) no-repeat;
        width: 210px;
        height: 170px;
    }

    #OverviewModulesArea .OverviewModuleEnergy
    {
        float:left;
        background: url(/design/images/modul_vit_energy1.jpg) no-repeat;
        width: 210px;
        height: 170px;
    }
    
    .ModuleMessageBoxTitle
    {
        margin-bottom:6px;
    }
    
    .OverviewModuleMessage .OverviewModuleContent .ModuleMessage
    {
        margin-bottom:4px;
    }
    
        .OverviewModuleMessage .OverviewModuleContent .ModuleMessage .ModuleMessageTitle
        {
            font-weight:bold;
        }
        
        .OverviewModuleMessage .OverviewModuleContent .ModuleMessage .ModuleMessageDate
        {
            font-size: 10px;
            line-height: 10px;
        }
        
    .OverviewModuleElectricity .OverviewModuleContent .ModuleConsumption
    {
        margin-bottom: 4px;
    }
    
        .OverviewModuleElectricity .OverviewModuleContent .ModuleConsumption .ModuleConsumptionTitle
        {
            font-weight:bold;
        }

        .OverviewModuleElectricity .OverviewModuleContent .ModuleConsumption .ModuleConsumptionValue
        {
        }


    .OverviewModuleInformation .OverviewModuleContent .ModuleInfo
    {
        margin-bottom: 4px;
    }
    
        .OverviewModuleInformation .OverviewModuleContent .ModuleInfo .ModuleInfoTitle
        {
            font-weight:bold;
        }

        .OverviewModuleInformation .OverviewModuleContent .ModuleInfo .ModuleInfoValue
        {
        }


    .OverviewModuleSettings .OverviewModuleContent .ModuleItem
    {
        margin-bottom: 4px;
        float:left;
        clear:both;
    }

        .OverviewModuleSettings .OverviewModuleContent .ModuleItem .ModuleItemTitle
        {
            float:left;
            font-weight: bold;
            font-size: 12px;
            clear:both;
            line-height:14px;
        }

        .OverviewModuleSettings .OverviewModuleContent .ModuleItem .ModuleItemValue
        {
            float:left;
            font-size: 12px;
            clear:both;
            line-height:14px;
        }
        
    .OverviewModuleBoende .OverviewModuleContent .ModuleAddress
    {
        margin-bottom: 8px;
        float:left;
        clear:both;
    }


        .OverviewModuleBoende .OverviewModuleContent .ModuleAddress .ModuleAddressTitle
        {
            float:left;
	    font-weight: bold;
            font-size: 12px;
            clear: both;
            line-height: 14px;
        }
    
        .OverviewModuleBoende .OverviewModuleContent .ModuleAddress .ModuleAddressValue
        {
            float:left;
            /*font-weight: bold;*/
            font-size: 12px;
            clear: both;
            line-height: 14px;
        }
        
    .OverviewModuleBoende .OverviewModuleContent .ModuleClass
    {
        margin-bottom: 4px;
        float:left;
        clear: both;
    }

        .OverviewModuleBoende .OverviewModuleContent .ModuleClass .ModuleClassTitle
        {
            float:left;
            /*font-weight: bold;*/
            font-size: 12px;
            clear: left;
            line-height: 14px;
        }
    
        .OverviewModuleBoende .OverviewModuleContent .ModuleClass .ModuleClassValue
        {
            margin-left: 5px;
            float:left;
            font-size: 12px;
            clear:right;
            line-height:14px;
        }


    .OverviewModuleHeating .OverviewModuleContent .ModuleConsumption
    {
        margin-bottom: 4px;
    }
    
        .OverviewModuleHeating .OverviewModuleContent .ModuleConsumption .ModuleConsumptionTitle
        {
            font-weight:bold;
        }

        .OverviewModuleHeating .OverviewModuleContent .ModuleConsumption .ModuleConsumptionValue
        {
        }
        

    .OverviewModuleEnergy .OverviewModuleContent .ModuleConsumption
    {
        margin-bottom: 4px;
    }
    
        .OverviewModuleEnergy .OverviewModuleContent .ModuleConsumption .ModuleConsumptionTitle
        {
            font-weight:bold;
        }

        .OverviewModuleEnergy .OverviewModuleContent .ModuleConsumption .ModuleConsumptionValue
        {
        }


/* PropertyChoiceContainer */

.PropertyChoiceContainer
{
	height:30px;
	padding: 0px 10px 0px 10px;
	float:right;
	background-color:#F2F1ED;
	border-style:dashed;
	border-width:0px 0px 0px 0px;
	border-color:#ccc;
	text-align: center;
	font-family: Arial;
	font-size: 11px;
}

	.PropertyChoiceContainer .PropertyChoiceContainerContent
	{
		padding-top: 5px;
	}
	
		.PropertyChoiceContainer .PropertyChoiceContainerContent select
		{
			font-family: Arial;
			font-size: 11px;
		}
		
		.PropertyChoiceContainer .PropertyChoiceContainerContent select option
		{
			font-family: Arial;
			font-size: 11px;
		}

/* In the middle */

#PageMiddlePropertySelection
{
	float:left;
	width: 100%;
	clear: both;
}

#PageMiddlePropertySelection .PropertyChoiceContainer
{
	height:30px;
	padding: 0px 0px 10px 0px;
	background-color:#fff;
	border-style:dashed;
	border-width:0px 0px 0px 0px;
	border-color:#ccc;
	text-align: center;
	font-family: Arial;
	font-size: 11px;
	float:left;
}

	#PageMiddlePropertySelection .PropertyChoiceContainer .PropertyChoiceContainerContent
	{
		padding-top: 5px;
	}
	
		#PageMiddlePropertySelection .PropertyChoiceContainer .PropertyChoiceContainerContent select
		{
			font-family: Arial;
			font-size: 11px;
		}
		
		#PageMiddlePropertySelection .PropertyChoiceContainer .PropertyChoiceContainerContent select option
		{
			font-family: Arial;
			font-size: 11px;
		}



/* Fakturor & Statistik */

#InvoicesStatsContainer
{
	float:left;
	/*width: 500px;*/
	width: 650px;
	clear: both;
}

	#InvoicesStatsContainer .InvoicesStatsTitleContainer
	{
		clear: both;
		width: 100%;
		float:left;
		/*
		border-style: solid;
		border-width: 0px 0px 2px 0px;
		border-color: #a0a0a0;
		*/
		position: relative;
	}
	
		#InvoicesStatsContainer .InvoicesStatsTitleContainer .InvoicesStatsTitleLink
		{
			float: left;
			background-color: #ccc;
		}
		
		#InvoicesStatsContainer #InvoicesStatsBody
		{
			float:left;
			border-style: solid;
			/*
			border-width: 3px 1px 1px 1px;
			border-width: 3px 0px 0px 0px;
			*/
			border-width: 0px;
			/*border-color: #666666;*/
			border-color: #ccc;
			border-top-color: #666;
			
			/*width: 448px;*/
			/*width: 505px;*/
			width: 655px;
			padding-top: 10px;
		}
		
			#InvoicesStatsBody .InvoicesStatsBodyQuarter
			{
				float:left;
				width: 100%;
				clear: both;
				text-align: center;
				padding: 10px 0px 10px 0px;
				border-style: dashed;
				border-width: 0px 0px 1px 0px;
				border-color: #eee;
			}
			
			#InvoicesStatsBody .InvoicesStatsBodyMonthColArea
			{
				float:left;
				padding: 15px 0px 15px 10px;
			}

			#InvoicesStatsBody .InvoicesStatsBodyMonthCol
			{
				float:left;
				/*padding: 15px 0px 15px 80px;*/
				background: url('/design/Common/images/bg-pdf.png');
				/*width: 99px;
				height: 85px;*/
				width: 150px;
				height: 129px;

				/*margin-left: 50px;*/
				position: relative;
				
			}
			
				#InvoicesStatsBody .InvoicesStatsBodyMonthCol .InvoicesStatsBodyMonthColContent
				{
					padding: 15px 15px 0px 15px;
				}
				
				.InvoicesStatsBodyMonthColContent .InvoicesStatsBodyMonthColContentTitle
				{
					border-color:#000000;
					border-style:solid;
					border-width:0 0 1px;
					color:#000000;
					font-family:Trebuchet MS,Tahoma,Verdana,Arial;
					font-size:12px;
					font-weight:bold;
					padding:0px 0px 0px 0px;
					width:90px;
				}
				
				.InvoicesStatsBodyMonthColContent .InvoicesStatsNo
				{
					float:left;
					padding-top: 2px;
					clear: both;
					width: 100%;
				}

				.InvoicesStatsBodyMonthColContent .InvoicesStatsNo .InvoicesStatsNoTitle
				{
					font-weight: bold;
				}
				
				.InvoicesStatsBodyMonthColContent .InvoicesStatsLink
				{
					float:left;
					padding-top: 10px;
					clear: both;
					width: 100%;
				}
				
				.InvoicesStatsBodyMonthColContent .InvoicesStatsLink .InvoicesStatsLinkTitle
				{
					font-weight: bold;
				}
				
				.InvoicesStatsBodyMonthColContent .InvoicesStatsLink .InvoiceLink
				{
					float:left;
				}
				
				
				.InvoicesStatsBodyMonthColContent .InvoicesStatsLink .StatsLink
				{
					float:right;
				}
				
			
				#InvoicesStatsBody .InvoicesStatsBodyQuarter .InvoicesStatsBodyMonthCol
				{
					float:left;
					padding-left: 80px; /*65px;*/
				}
				
				.InvoicesStatsBodyMonthCol .MonthTitle
				{
					font-style: italic;
				}
		

/* Flikar */

div.border
{
	position: absolute;
	top: 27px;
	/*
	border-style: solid;
	border-width: 0px 0px 1px 0px;
	border-color: #a0a0a0;
	*/
	/*width: 510px;*/
	width: 660px;
	/*height: 27px;*/
	height: 1px;
	line-height: 0px;
	font-size: 0px;
	z-index: 100;
	background-color: #a0a0a0;
}


div.flik
{
	float:right;
	position:relative;
	margin-left:-40px;
	z-index:100;
}

div.flik_first
{
	margin-left: 0px;
}

div.flik_gray
{
}

div.flik_white div.start
{
	float:left;
	width:43px;
	height:28px;
	background: url('/design/Common/gfx/flikar/fp_white.gif');
}

div.flik_white div.stop
{
	float:left;
	width:43px;
	height:28px;
	background: url('/design/Common/gfx/flikar/lp_white.gif');
}

div.flik_white div.content
{
	float:left;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/bg_white_stripe.gif') repeat-x;
	padding-top:5px;
	color:#000000;
	font-size:12px;
	font-family:Arial;
}


div.flik_gray div.start
{
	float:left;
	width:43px;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/fp_gray.gif');
}

div.flik_gray div.stop
{
	float:left;
	width:43px;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/lp_gray.gif');
	
}

div.flik_gray div.content
{
	float:left;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/bg_gray_stripe.gif') repeat-x;
	padding-top:5px;
	color:#ffffff;
	font-size:12px;
	font-family:Arial;
}

div.flik_inactive
{
	z-index: 50;
	/*
	border-style: solid;
	border-color: #a0a0a0;
	border-width: 0px 0px 1px 0px;
	*/
}

div.flik_inactive div.start
{
	float:left;
	width:43px;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/fp_gray2.gif');
}

div.flik_inactive div.stop
{
	float:left;
	width:43px;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/lp_gray2.gif');
}

div.flik_inactive div.content
{
	float:left;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/bg_gray2_stripe.gif') repeat-x;
}

div.flik_inactive div.content div.textcontent
{
	padding-top: 8px;
	color:#ffffff;
	font-size:12px;
	font-family:Arial;
}


div.flik_active
{
	z-index: 200;
	/*
	border-style: solid;
	border-color: #ffffff;
	border-width: 0px 0px 1px 0px;
	*/
}


div.flik_active div.start
{
	float:left;
	width:43px;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/fp_white2.gif');
}

div.flik_active div.stop
{
	float:left;
	width:43px;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/lp_white2.gif');
}

div.flik_active div.content
{
	float:left;
	height:28px;
	background: url('/Private/diagram/gfx/flikar/bg_white2_stripe.gif') repeat-x;
}

div.flik_active div.content div.textcontent
{
	padding-top: 8px;
	color:#000000;
	font-size:12px;
	font-family:Arial;
}

div.flik_active div.content div.textcontent a, div.flik_active div.content div.textcontent a:hover
{
	text-decoration: none;
	font-weight: bold;
	color: #000000;
	font-size: 12px;
	font-family: Verdana;
}


div.flik_inactive div.content div.textcontent a
{
	text-decoration: none;
	font-weight: bold;
	color: #ffffff;
	font-size: 12px;
	font-family: Verdana;

}

div.flik_inactive div.content div.textcontent a:hover
{
	text-decoration: underline;
}


/* UserLoginInformation */


/* PAGETOP */

div#UserLoginInfo
{
	position:absolute;
	top:15px;
	left:720px;
	width:250px;
	height:57px;
	background: url(/design/Common/images/bg-userinfo-big.png);
}

	div#UserLoginInfo .UserLoginInfoContent
	{
		padding: 5px 15px 5px 15px;
		font-family: Verdana, Arial;
		font-size: 10px;
	}




.toolTip {
        padding-right: 20px;
        background: url(http://design.energiinfo.se/design/images/help.png) no-repeat right;
        cursor: help;
        /*
        position: relative;
        z-index: 1;
        */
}

#tooltip{
	position:absolute;
	border:1px solid #333;
	background:#f7f5d1;
	padding:2px 5px;
	color:#333;
	display:none;
	width: 400px;
	}	

.MessageSuccess
{
    display: block;
    clear: both;
    width: 400px;
    border-style: solid;
    border-width: 1px;
    border-color: #aaaaaa;
    padding: 23px 15px 20px 50px;
    background-color: #ffffe1;
    margin-bottom: 15px;
    color: #000000;
    
    background: #f2f1ff url(http://design.energiinfo.se/design/Common/icons/icon_okbox.png) no-repeat left;
    background-position: 10px center;    
}

.MessageError
{
    display: block;
    clear: both;
    width: 400px;
    border-style: solid;
    border-width: 1px;
    border-color: #aaaaaa;
    padding: 23px 15px 20px 50px;
    background-color: #ffffe1;
    margin-bottom: 15px;
    color: #000000;
    
    background: #fff0f0 url(http://design.energiinfo.se/design/Common/icons/icon_errbox.png) no-repeat left;
    background-position: 10px center;
}





#PagePopupGrayBackground
{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 120%;
	background: transparent url(http://design.energiinfo.se/design/Common/gfx/bg_gray.png) repeat;
	z-index: 10000;
    cursor: wait;
}

    #PagePopupGrayBackground #PopupSquare
    {
    	width: 300px;
    	margin: 200px auto;
    	height: 100px;
    	/*background-color: #f7f5d1;*/
    	/*
    	background-color: #ffffff;
    	border-style: solid;
    	border-width: 1px;
    	border-color: #aaa;
    	*/
        cursor: wait;
    }
    
        #PopupSquare #PopupContent
        {
        	padding: 40px 0px 0px 0px;
        	text-align: center;
        	cursor: wait;
        }
        
        #PopupContent #PopupContentWait
        {
        	background: transparent url(http://design.energiinfo.se/design/Common/images/bg-userinfo-big.png) no-repeat;
        	width: 250px;
        	height: 57px;
        }
        
        #PopupContentWait .PopupContentWaitText
        {
        	padding: 17px 0px 10px 0px;
        	text-align: center;
        }


.RightInfo
{
	border: 1px dashed #cccccc;
	float:right;
	width: 250px;
}

    .RightInfo .RightInfoContent
    {
    	padding: 10px;
    }
    
    
#PageInsideContainer #PageSubMenuContainer
{
	display: none;
	background-color: #fff;
	border-color: #cccccc;
	border-width: 0px 1px 0px 1px;
	border-style: solid;
	
/*	background-color:#fbfaf9;*/
	padding-top:10px;
	padding-bottom:5px;
	padding-left:0px;
	font-size:12px;
	font-family:Arial;
}

#PageInsideContainer #PageSubMenuContainer
{
	width: 100%;
	padding: 6px 0px 6px 0px;
	border-color: #ccc;
	border-width: 1px;
	border-top: 0px;
	border-style: solid;
}

#PageSubMenuContainer ul
{
	margin: 0px;
	padding: 0px 0px 0px 20px;
	list-style-type: none;
}

#PageSubMenuContainer ul li
{
	display: inline;
}

#PageSubMenuContainer ul li a
{
	padding-left: 0px;
	/*padding-left:8px;*/
	padding-right:8px;
	color:#000;
}

#PageSubMenuContainer ul li a.active
{
	text-decoration: underline;
}

#PageBodyOuterContainer .PageBodyTopOuterContainerSubMenuActive
{
	padding-top: 20px;
}

#PageBodyOuterContainer .PageBodyTopOuterContainerSubMenuActive h1.PageHeader
{
	margin: 0px;
}
    
