*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
* {padding: 0; margin: 0;}
body {font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 1.4;}
.select2-highlighted div{background-color: #ffae21;}
.select2-result-selectable{background-color: #415f70;}
.formElem .select2-container .select2-choice{background-image: none !important; background-color: #bdbec1; border-radius: 0px; border: none;}
.select2-container .select2-container-active{
    border: 0px !important;
    outline: none;
    -webkit-box-shadow: 0 0 0px rgba(0, 0, 0, 0) !important;
    box-shadow: 0 0 0px !important;
}
.select2-result-label{color: #fff}
.select2-drop-active{border: none !important;}
.select2-results{padding: 0px !important; margin: 0px !important;}
.select2-arrow{border-radius: 0px !important; background-image: none !important; background: #bdbec1 !important; border: 0px !important;}
.formElem .select2-container .select2-choice .select2-arrow b{background-image: url("../img/selectbox-arrow.png") !important; background-size: auto !important; margin: 2px 0 0 0}
.formElem {width: 250px;}
.formElem select{width: 100px;}
.formElem label{color: #696a6c; width: 100px;}
.main { float: left; width: 100%; padding: 0 10px;}
	.periods {float: left; width: 100%; margin: 0 0 6px 0;}
		.periods ul {float: left; width: 100%;}
			.periods ul li {float: left; display: inline-block;  width: 25%; padding: 3px; }
				.periods ul li a {display: inline-block; width: 100%; height: 20px; line-height: 20px; text-align: center; background: #ddd; border: 1px solid #ccc; color: #333; text-decoration: none; }
				.periods a.active {border: 1px solid #999;}
	.options {float: left; width: 10%; }
		.row {float: left; width: 100%;}
		
			.formElem {padding: 3px;}
				.formElem label {display: inline-block; height: 20px; line-height: 20px;}
				.formElem select,
				.formElem input {width: 100%; height: 30px;}
			.btn {float: left; border: 0 none; margin: 23px 0 0 0; background: #ccc; text-align: center; height: 30px; width: 60px; cursor: pointer;}
			
	.chart {float: left; width: 100%; height: 230px; margin: 0 0 6px 0;}

.annotation {float: left; width: 100%; padding: 5px; text-align: center;}



/* plugins specified */
/* jquery ui */

.ui-widget {
    font-family: Arial, Helvetica,sans-serif;
    background: #fff;
}

.ui-datepicker {
    padding: 0;
}

.ui-datepicker-header {
    border: none;
    font-size: 80%;
    -moz-border-radius: 4px 4px 0 0;
    -webkit-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0; /* border radius */
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box; /* prevents bg color from leaking outside the border */
    background-color: #e0e8ec; /* layer fill content */
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,.53), inset 0 -1px 0 rgba(0,0,0,.12); /* drop shadow and inner shadow */
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.53), inset 0 -1px 0 rgba(0,0,0,.12); /* drop shadow and inner shadow */
    box-shadow: 0 1px 0 rgba(255,255,255,.53), inset 0 -1px 0 rgba(0,0,0,.12); /* drop shadow and inner shadow */
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MCUiIHkxPSIxMDAlIiB4Mj0iNTAlIiB5Mj0iLTEuNDIxMDg1NDcxNTIwMmUtMTQlIj4KPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMCIgc3RvcC1vcGFjaXR5PSIwLjIxIi8+CjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjIxIi8+CiAgIDwvbGluZWFyR3JhZGllbnQ+Cgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0idXJsKCNoYXQwKSIgLz4KPC9zdmc+); /* gradient overlay */
    background-image: -moz-linear-gradient(bottom, rgba(0,0,0,.21) 0%, rgba(255,255,255,.21) 100%); /* gradient overlay */
    background-image: -o-linear-gradient(bottom, rgba(0,0,0,.21) 0%, rgba(255,255,255,.21) 100%); /* gradient overlay */
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.21) 0%, rgba(255,255,255,.21) 100%); /* gradient overlay */
    background-image: linear-gradient(bottom, rgba(0,0,0,.21) 0%, rgba(255,255,255,.21) 100%); /* gradient overlay */
}

.ui-datepicker-title {
    color: #515d65; /* text color */
    font-size: 13px;
    font-weight: bold;
    text-shadow: 0 1px 1px rgba(255,255,255,.8); /* drop shadow */

}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    border-color: transparent;
}

.ui-state-default {
    background: transparent;
    border: none;
    color: #2b2b2b;
    font-weight: normal;
    text-align: center !important;
}

.ui-datepicker-header .ui-state-hover {
    background: #bdc5c9;
}

.ui-datepicker table {
    margin: 0;
}

.ui-datepicker th {
    color: #9da7af;
    font-size: 12px;
    font-weight: normal;
    -moz-border-radius: 216px 0 0 0 / 0 0 0 0;
    -webkit-border-radius: 216px 0 0 0 / 0 0 0 0;
    border-radius: 216px 0 0 0 / 0 0 0 0;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: rgba(0,0,0,.08);

}

.ui-datepicker td {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    padding: 0;
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.4);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.4);
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MCUiIHkxPSIxMDAlIiB4Mj0iNTAlIiB5Mj0iLTEuNDIxMDg1NDcxNTIwMmUtMTQlIj4KPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMCIgc3RvcC1vcGFjaXR5PSIwLjA2Ii8+CjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjA2Ii8+CiAgIDwvbGluZWFyR3JhZGllbnQ+Cgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0idXJsKCNoYXQwKSIgLz4KPC9zdmc+);
    background-image: -moz-linear-gradient(bottom, rgba(0,0,0,.06) 0%, rgba(255,255,255,.06) 100%);
    background-image: -o-linear-gradient(bottom, rgba(0,0,0,.06) 0%, rgba(255,255,255,.06) 100%);
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.06) 0%, rgba(255,255,255,.06) 100%);
    background-image: linear-gradient(bottom, rgba(0,0,0,.06) 0%, rgba(255,255,255,.06) 100%);

}

.ui-datepicker td:last-child {
    border-right: none;
}

.ui-datepicker td span, 
.ui-datepicker td a {
    padding: .7em 0;
    color: #6a747a;
    font-size: 12px;
    font-weight: bold;
	text-align: center;
}

.ui-datepicker-calendar .ui-state-hover {
    background-image: -moz-linear-gradient(bottom, rgba(0,0,0,.12) 0%, rgba(255,255,255,.06) 100%);
    background-image: -o-linear-gradient(bottom, rgba(0,0,0,.12) 0%, rgba(255,255,255,.06) 100%);
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.12) 0%, rgba(255,255,255,.06) 100%);
}

td a.ui-state-active,
td a.ui-state-active.ui-state-hover {
    color: #fff;
    background-color: #8ab8ed;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .26);
    -moz-box-shadow: inset 0 4px 9px rgba(0, 0, 0, .24);
    -webkit-box-shadow: inset 0 4px 9px rgba(0, 0, 0, .24);
    box-shadow: inset 0 4px 9px rgba(0, 0, 0, .24);
}