@font-face {
	font-family: 'OpenSans-Regular';
	src:
		url("/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Regular.eot");
	src:
		url("/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Regular.eot?#iefix")
		format('embedded-opentype'),
		url("/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Regular.ttf")
		format('truetype');
}
@font-face {
	font-family: 'OpenSans-Bold';
	src:
		url("/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Bold.eot");
	src:
		url("/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Bold.eot?#iefix")
		format('embedded-opentype'),
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Bold.ttf')
		format('truetype');
}

@font-face {
	font-family: 'OpenSans-Italic';
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Italic.eot');
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Italic.eot?#iefix')
		format('embedded-opentype'),
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-Italic.ttf')
		format('truetype');
}

@font-face {
	font-family: 'OpenSans-BoldItalic';
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-BoldItalic.eot');
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-BoldItalic.eot?#iefix')
		format('embedded-opentype'),
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-BoldItalic.ttf')
		format('truetype');
}

@font-face {
	font-family: 'OpenSans-ExtraBold';
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-ExtraBold.eot');
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-ExtraBold.eot?#iefix')
		format('embedded-opentype'),
		url('/pnlibcommon/resources/fonts/Open_Sans/OpenSans-ExtraBold.ttf')
		format('truetype');
}

@font-face {
	font-family: 'OpenSans-CondBold';
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondBold.eot');
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondBold.eot?#iefix')
		format('embedded-opentype'),
		url('/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondBold.ttf')
		format('truetype');
}

@font-face {
	font-family: 'OpenSans-CondLight';
	src:
		url("/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondLight.eot");
	src:
		url("/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondLight.eot?#iefix")
		format('embedded-opentype'),
		url('/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondLight.ttf')
		format('truetype');
}

@font-face {
	font-family: 'OpenSans-CondLightItalic';
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondLightItalic.eot');
	src:
		url('/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondLightItalic.eot?#iefix')
		format('embedded-opentype'),
		url('/pnlibcommon/resources/fonts/Open_Sans_Condensed/OpenSans-CondBold.ttf')
		format('truetype');
}

@font-face {
	font-family: 'SS-Gizmo';
	src: url('/pnlibcommon/resources/fonts/ssgizmo/ss-gizmo.eot');
	src:
		url('/pnlibcommon/resources/fonts/ssgizmo/ss-gizmo.eot?#iefix')
		format('embedded-opentype'),
		/*url('/pnlibcommon/resources/fonts/ssgizmo/ss-gizmo.woff')
		format('woff'),*/
		url('/pnlibcommon/resources/fonts/ssgizmo/ss-gizmo.ttf')
		format('truetype'),
		url('/pnlibcommon/resources/fonts/ssgizmo/ss-gizmo.svg#SSGizmo')
		format('svg');
	font-weight: normal;
	font-style: normal;
}

html { margin: 0; padding: 0; }
body { font-size: 100%; margin: 0; padding: 1.75em; font-family: OpenSans-Regular, Helvetica, Arial; font-size: 1em; font: 1em OpenSans-Regular, Helvetica, arial;; max-width:1080px; }

h1 { font-size: 1.5em; margin: 0 0 0.6em 0;text-align: center; font-family: OpenSans-Bold, Helvetica, arial;}
h2 { font-size: 1.25em; margin: 0 0 0.6em 0;text-align: center; font-family: OpenSans-Bold, Helvetica, arial;}

a { color: #2996cc; font-family: OpenSans-Regular, Helvetica, Arial;}
a:hover { text-decoration: none; }

p { line-height: 1.5em; font-family: OpenSans-Regular, Helvetica, Arial;}
.small { color: #666; font-size: 0.875em; }
.large { font-size: 1.25em; }


label {
	font-family: OpenSans-Bold, Helvetica, arial;
    font-weight: bold;
}

input[type="text"] {
    margin: 0.5em 0 3em 0;
    padding: 0.5em;
}

button#datepicker-button {
    margin-bottom: 3em;
}

.flow-element {
    display: inline-block;
    margin-right: 3em;
    vertical-align: top;
}
.flow-element:last-child {
    margin-right: 0;
}
.flow-element input {
    margin-top: 0;
}

#container {
    min-height: 15em;
}

canvas {
	float:left;
  	height: 250px;
}

.chart{
	width: 50%;
	height: 400px;
	float: left;
	padding-top:15px;
}

#periodSelection{
	width: 50%;
	float: left;
}

#chartSelection{
	width: 50%;
	float: left;
}

.legend{
	width: 33.3%;
	float:left;
}

.pie-legend{
	list-style: none;
 	position: absolute;
 	padding-left: 15px;
}

.pie-legend li{
	font-family: OpenSans-Regular, Helvetica, Arial;
	display: block;
	border-radius: 5px;
	position: relative;
	margin-bottom: 4px;
	border-radius: 5px;
	padding: 2px 8px 2px 28px;
	cursor: default;
}

.pie-legend li span{
display: block;
position: absolute;
left: 0;
top: 0;
width: 20px;
height: 100%;
border-radius: 5px;
}