@media screen and (min-width:992px) {
	.max1000 {
		width: 992px;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	.max940 {
		width: 940px;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
}

@media screen and (max-width:600px) {
	.max1000 {
		width: 600px;
		display: block;
	}

	.max940 {
		width: 600px;
		display: block;
	}
}

body {
	color: #c7c7c7	;
	background-size: 100% 800px;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: top;
	background-image: url("/assets/images/bg.png");
	/*background-color: #31657d;*/
	background-color: #254c5f;
	font-family: Lato, "微軟正黑體";
	font-weight: 300;
	font-size: 15px;
}

body.login-body {
	background-size: 100% 800px;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: top;
	background-image: url("/assets/images/login-bg2.png");
	background-color: #254c5f;
}

body.userinfo-body {
	background-image: none;
	background-color: #437478;
}

a:link		{ text-decoration: none; }
a:visited	{ text-decoration: none; }
a:hover		{ 
	text-decoration: none; 
	color: #f2fdd1;
}
a:active	{ text-decoration: none; }
a:focus		{ outline: none; }

#content {
	background-color: transparent;
}

#breadcrumb {
	background-color: #024E65;
}

/* Overriding navs.less:35 */
.nav > li > a:hover, .nav > li > a:focus {
text-decoration: none;
background: none;
}

.std-green {
	/* color: #28de08; */
	color: #093;
}

.std-cyan {
	color: #01adff;
}

.std-yellow {
	color: #dbde2f;
}

.std-white {
	color: #fff;
}

.mr-10px {
	margin-right: 10px;
}

#main {
	margin-top: 115px;

}

.row-extra-margins {
	margin-left: 0;
	margin-right: 0;
}

 .footers {
	margin-top: 80px;
	line-height: 24px;
	font-size: 14px;
	color: #ddd;
}

.footers a:link		{ color: #ccc; }
.footers a:visited	{ color: #ccc; }
.footers a:hover	{ color: #f2fdd1; }
.footers a:active	{  }

.footers > .groups {
	min-height: 80px;
	margin-bottom: 60px;
}

.footers > .groups .headers {
	font-weight: bold;
	margin-bottom: 10px;
}

 .footers > .footlinks {
	font-size: 14px;
}

.footers > .footlinks > .links {
	text-align: right;
}

.footers > .footlinks a {
	font-size: 14px;
	margin: 0 10px;
}

.dk-navbar {
	box-shadow: none;
}



#top-panel {
	height: 75px;
	line-height: 75px;
	/*background-color: #2d5c6e;*/
	background-color: rgba(35,72,89,0.9)
	/*opacity: 0.95;*/
}

.top-panel-row {
	margin-top: 12px;
}

.logo-master {
	line-height: 50px;
	width: 98px;

}

/*
.top-panel-row .logo-master:hover {
	background-color: rgba(232, 234, 171, 0.5);
	border-radius: 5px;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}
*/

.panel-menu i {
	color: #fff;
}

.panel-menu a.account {

	padding-right: 10px;

}

.panel-menu i.pull-right {
	color: #fff;
}

/*
.panel-menu > li > a:hover:not(.modal-link) {
  background-color: rgba(232, 234, 171, 0.5);
  border-radius: 5px;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
*/

/*
.panel-menu > li > a:hover > i {
  background-color: rgba(232, 234, 171, 0.5);
}
*/

/* Overriding bootstrap.css .dropdown-menu */
.dropdown-menu {
	border-radius: 8px;
}

/* Overriding bootstrap.css */
.navbar-nav > li > .dropdown-menu {
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}

/* dropdown item hover halo */
.dropdown-menu > li > a:hover {
  background-color: rgba(232, 234, 171, 0.5);
  border-radius: 8px;
}


.dk-top-region {
	height: 40px;
	display: table;
}

.dk-top-region  > span {
	display: table-cell;
	vertical-align: middle;
	margin-bottom: none;
	color: #fff;
	padding-left: 8px;
}

.panel-menu .dropdown-menu {
	background-color: #234753 !important;
}

.panel-menu .dropdown-menu > li > a {
	color: #fff;
}

.panel-menu .dropdown-menu > li > a > span {
	text-align: right;
	width: 130px;
	display: inline-block;
}

.panel-notify {
	padding-top: 6px;
}

.panel-notify > li > a {
	line-height: 40px;
	white-space: nowrap;
}

a > .notify-count {
	color: #fff;
}

/* dropdown menu-header halo */
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
	/* background: rgba(0, 0, 0, 0.1); */
	background: none;
}

.navbar-nav.menu-region > li {
	width: 195px;
}

.navbar-home {
	font-size: 34px;
}

ul#menu-account > li > ul > li {
	text-align: center;
}

ul#menu-account .dropdown-menu > li > a > span {
	text-align: center;
	width: 123px;
	display: inline-block;
}

.dashboard .timeline-top {
	width: 1000px;
	margin: 0 auto;
	  height: 200px;
}

/*
.dashboard  .bubble:after
{
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 12px 14px 0;
	border-color: #31657d transparent;
	display: block;
	width: 0;
	z-index: 1;
	margin-left: -14px;
	bottom: -12px;
	left: 50%;
}

.dashboard  .bubble:before
{
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 13px 15px 0;
	border-color: #507a90 transparent;
	display: block;
	width: 0;
	z-index: 0;
	margin-left: -15px;
	bottom: -15px;
	left: 50%;
}
*/

.dashboard  .bubble
{
	display: inline-block;
	position: relative;
	vertical-align: top;
	width: 136px;
	/*width: 116px;*/
	height: 190px;
	padding: 0px;
	margin: 0 3px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	font-size: 13px;
}

.dashboard  .bubble.arrow:after
{
	content: '';
	position: absolute;
	border-style: solid;
	display: block;
	width: 0;
	z-index: 1;
}

.dashboard  .bubble.arrow:before
{
	content: '';
	position: absolute;
	border-style: solid;
	display: block;
	width: 0;
	z-index: 0;
}

.dashboard .bubble.arrow-bottom:after {
	border-width: 12px 14px 0;
	margin-left: -14px;
	bottom: -12px;
	left: 50%;
}

.dashboard .bubble.arrow-bottom:before {
	border-width: 13px 15px 0;
	margin-left: -15px;
	bottom: -15px;
	left: 50%;
}

.dashboard .bubble.cset1		{ background: #31657d; border: #507a90 solid 2px; }
.dashboard .bubble.cset1:after	{ border-color: #96a7bb transparent; }
.dashboard .bubble.cset1:before	{ border-color: transparent; }
.dashboard .bubble.cset1 .bheader { background-color: #507a90; color: #fefefe; }
.dashboard .bubble.cset1 .btitle { background-color: #2d5d71; }
.dashboard .bubble.concealed { visibility: none; }


.dashboard .bubble .bheader {
	text-align: center;
	padding: 30px 0 30px 0;
	border-radius: 8px 8px 0 0;
}

.dashboard .rename-icon {
	width: 23px;
	height: 37px;
	background-size: 100% 100%;
}

.dashboard .rename-icon.chevron-right {
	color: #5eced3;
	background-image: url('/assets/images/chevron-right.png');
	background-size: 14px;
}

.dashboard .bubble .bheader .bdtspan .bdt-time {
	font-weight: bold;
}

.dashboard .bubble .btitle {
	padding: 5px 10px;
	text-align: left;
	position: absolute;
	width: 133px;
	height: 30px;
	margin-top: 20px;
}

.dashboard .bubble .bmesg {
	padding: 15px 10px;
	text-align: left;
}

.dashboard .bubble .bmesg > .bm-more {
	width: 110px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dashboard .bubble .bmesg > a.bm-more			{ color: #c7c7c7; }
.dashboard .bubble .bmesg > a.bm-more:link		{ color: #c7c7c7; }
.dashboard .bubble .bmesg > a.bm-more:visited	{ color: #c7c7c7; }
.dashboard .bubble .bmesg > a.bm-more:active	{ color: #c7c7c7; }
.dashboard .bubble .bmesg > a.bm-more:hover		{ color: #f2fdd1; }

.dashboard .bubble .bmesg > .bm-more > .bm-count { float: right; }

.dashboard .bubble .bmesg > .bm-more > .bm-count:hover {
	text-decoration: underline;
	font-weight: bold;
}

.dashboard .timeline-stripblock {
	width: 1168px;
	height: 64px;
	margin: 5px auto 15px auto;
}

.dashboard .timeline-left  { margin-bottom: 80px; }
.dashboard .timeline-right { 
	margin-bottom: 50px; 
	padding-bottom: 20px;
}

.dashboard .timeline-right .timeline-stripblock {
	width: 1168px;
	height: 152px;
	margin-top: 147px;
}

.dashboard .timeline-right .timeline-backdrop { height: 390px; }

.dashboard .timeline-right .timeline-stripblock .bubble-frame {
	height: 220px;
	z-index: 300;
	margin-top: -145px;
	margin-right: 82px;
	width: 1000px;
}

.dashboard .timeline-stripblock > div {
	float: right;
	position: relative;
}

.dashboard .timeline-strip {
	width: 1000px;
	height: 64px;
	background-repeat: repeat no-repeat;
	background-position: 0 31px;
	/* border: 1px dashed gray; */
	z-index: 100;
	position: relative;
}

.dashboard .timeline-strip .caption-no-event { margin-top: -25px; }

.dashboard .timeline-strip .caption {
	position: relative;
	text-align: center;
	font-size: 30px;
	line-height: 38px;
	color:#244a55;
	margin: 0 auto;
}

.dashboard .timeline-strip .caption.sec1 {
	width: 1000px;
	height: 92px;
	letter-spacing: 1px;
}

.dashboard .timeline-strip .caption.sec1 .inner {
	width: 350px;
	height: 90px;
	margin: 0 auto;
}

.dashboard .timeline-strip .caption.sec2 {
	width: 1000px;
	height: 90px;
	letter-spacing: 20px;
	padding-left: 20px;
}

.dashboard .timeline-strip .caption.sec1 .capt-text {
	height: 90px;
	text-align: left;
	padding-top: 5px;
}

.dashboard .timeline-strip .caption.sec1 .capt-text .ct-date { padding-left: 4px; }

.dashboard .timeline-strip .caption.sec1 .capt-text .ct-tperiod {
	font-weight: bold;
	font-size: 40px;
}

.dashboard .timeline-strip .caption.sec1 .capt-icon {
	width: 90px; /* Ideal size 90x90, extra left/right space added to align with Chinese text on bottom */
	height: 90px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('/assets/images/newtml-noevent.png');
	float: left;
}



.dashboard .timeline-headers {
	width: 1000px;
	margin: 0 auto;
}

.dashboard .timeline-headers .dtblock {
	width: 200px;
}

.dashboard .timeline-headers .dtblock .dt-date {
}

.dashboard .timeline-headers .dtblock .dt-timeperiod {
	font-weight: bold;
}

.dashboard .timeline-footers {
	width: 1000px;
	margin: 0 auto;
}

.dashboard .timeline-footers .dtblock {
	text-align: right;
	float: right;
	width: 200px;
	height: 74px;
	line-height: 68px;
}

.dashboard .timeline-footers .dtblock .dt-date {
}

.dashboard .timeline-footers .dtblock .dt-timeperiod {
	font-weight: bold;
}

.dashboard .timeline-footers .flip-nav {
	width: 600px;
	float: right;
}

/*
.dashboard .timeline-left .timeline-strip {

}

.dashboard .timeline-right .timeline-strip {
	width: 1000px;
	height: 64px;
}
*/

.dashboard .timeline-left .timeline-strip { background-image: url('/assets/images/newtml-line.png'); }
.dashboard .timeline-right .timeline-strip { background-image: url('/assets/images/newtml-dashedline.png'); }
.dashboard .timeline-strip.solid  { background-image: url('/assets/images/newtml-line.png'); }
.dashboard .timeline-strip.dashed { background-image: url('/assets/images/newtml-dashedline.png'); }
.dashboard .timeline-strip.none { background-image: none; }

.dashboard .icon-event {
	width: 84px;
	height: 64px;
	display: inline-block;
	position: absolute;
	z-index: 200;
	background-repeat: no-repeat;
	background-position: center;
}

.icon-event.single	{ background-image: url('/assets/images/newtml-event.png'); }
.icon-event.multi	{ background-image: url('/assets/images/newtml-eventmulti.png'); }
.icon-event.single:hover	{ 
	background-image: url('/assets/images/newtml-event-hi.png'); 
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}
.icon-event.multi:hover		{ 
	background-image: url('/assets/images/newtml-eventmulti-hi.png'); 
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}
.icon-event.link { background-image: url('/assets/images/newtml-link.png'); }
.icon-event.chevron-right { background-image: url('/assets/images/newtml-chevronright.png'); }
.icon-event.chevron-left { background-image: url('/assets/images/newtml-chevronleft.png'); }
.icon-event.line { background-image: url('/assets/images/newtml-line.png'); }
.icon-event.dashedline { background-image: url('/assets/images/newtml-dashedline.png'); }

.icon-event#ev06 { z-index: 250; left: 29px; }
.icon-event#ev05 { z-index: 250; left: 171px; }
.icon-event#ev04 { z-index: 240; left: 313px;}
.icon-event#ev03 { z-index: 230; left: 455px;}
.icon-event#ev02 { z-index: 220; left: 597px;}
.icon-event#ev01 { z-index: 210; left: 739px;}
.icon-event#ev00 { z-index: 200; left: 881px;}

.icon-event#ln05 { z-index: 240; left: 100px;}
.icon-event#ln04 { z-index: 240; left: 242px;}
.icon-event#ln03 { z-index: 230; left: 384px;}
.icon-event#ln02 { z-index: 220; left: 526px;}
.icon-event#ln01 { z-index: 210; left: 668px;}
.icon-event#ln00 { z-index: 200; left: 810px;}


.dashboard .timeline-bottom  {
	width: 1000px;
	height: 260px;
	margin: 0 auto;
	padding: 0 70px;
}

/*
.dashboard .timeline-bottom input.pexp {
	color: #fff;
	background-color: #302118;
	width: 40px;
	padding: 0 5px;
	text-align: right;
}

.dashboard .timeline-bottom pre {
	width: 300px;
	height: 40px;
	background-color: #1f2c1d;
	color: white;
}
*/

.dashboard .bubble.arrow-top:after {
	border-width: 0 15px 15px;
	top: -15px;
	margin-left: 0;
	left: 52px;
}

.dashboard .bubble.arrow-top:before {
	border-width: 0 16px 16px;
	top:-18px;
	margin-left: 0;
	left: 51px;
}

.dashboard .bubble.cset2		{ background: #31657d; border: #2c96a4 solid 2px; }
.dashboard .bubble.cset2:after	{ border-color: #2e8b9d transparent; }
.dashboard .bubble.cset2:before	{ border-color: transparent; }
.dashboard .bubble.cset2 .bheader { background-color: #2c96a4; color: #fefefe; }
.dashboard .bubble.cset2 .btitle { background-color: #2c5c72; }

.dashboard .bubble.cset3		{ background: #31657d; border: #2b4663 solid 2px; }
.dashboard .bubble.strip-mid	{ margin-top: -80px; }
.dashboard .bubble.strip-mid:after	{  }
.dashboard .bubble.strip-mid:before	{  }
.dashboard .bubble.strip-mid .bheader {
	padding: 20px 0 40px 0;
}
.dashboard .bubble.strip-mid .bheader .bdtspan {
	text-align: left;
	margin: 5px 0 0 10px;
}
.dashboard .bubble.rooms .bdtspan .schedule-days { font-size: 12px; }
.dashboard .bubble.rooms .bdtspan .schedule-days .on  { color: #fefefe; }
.dashboard .bubble.rooms .bdtspan .schedule-days .off { color: #000; }
.dashboard .bubble.rooms .btitle {
	margin-top: 10px;
}

.dashboard .bubble.rooms {  }
.dashboard .bubble.rooms:after	{  }
.dashboard .bubble.rooms:before	{  }
.dashboard .bubble.rooms .bheader {
	padding: 25px 0 25px 0;
}
.dashboard .bubble.rooms .bheader .bdtspan {
	text-align: center;
	margin: 5px 0 0 2px;
}
.dashboard .bubble.rooms .bdtspan .schedule-days { font-size: 12px; }
.dashboard .bubble.rooms .bdtspan .schedule-days .on  { color: #fefefe; }
.dashboard .bubble.rooms .bdtspan .schedule-days .off { color: #000; }
.dashboard .bubble.rooms .btitle {
	margin-top: 10px;
}

.dashboard .bubble.cset3 .bheader { background-color: #2e5670; color: #fefefe; }
.dashboard .bubble.cset3 .btitle { background-color: #2c5c72; }

.event-details-frame {
	width: 320px;
	height: 390px;
}

.event-details-frame .notify-center {
	width: 300px;
}

.event-details-frame .notify-section {
	width: 270px;
	margin-left: -20px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.event-details-frame .event-list {
	color: #fefefe;
	text-align: center;
	margin-left: 10px;
	height: 130px;
	overflow-y: auto;
	padding: 0;
}

.event-details-frame .event-list .event-item * {
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	
}

.event-details-frame .event-list .event-item .evi-time	{ width: 50px; text-align: right; }
.event-details-frame .event-list .event-item .evi-dev	{ width: 80px; text-align: center; }
.event-details-frame .event-list .event-item .evi-event	{ width: 90px; text-align: left; }

.event-details-frame .event-icon {
	margin-left: 10px;
	text-align: center;
}

.event-details-frame .rename-icon {
	width: 35px;
	height: 56px;
	background-size: 100% 100%;
}

.home-container {
	display: table-row;
	width: 100%;
}

.home {
	display: table-cell;
	text-align: center;
	width: 5%;
}

.home .master-status {
	display: inline-block;
	width: 110px;
	height: 110px;
	background-repeat: no-repeat;
	background-position: center;
}

.master-status.red	{ background-image: url('/assets/images/main_status_red.png'); }
.master-status.yellow	{ background-image: url('/assets/images/main_status_yellow.png'); }
.master-status.green	{ background-image: url('/assets/images/main_status_green.png'); }

.home .home-text-block {
	display: inline-block;
	vertical-align: top;
}

.home-text-block .greetings {
        margin-top: 3px;
        font-size: 50px;
        font-family: Muli, "微軟正黑體";
        font-weight: 300;
        letter-spacing: -1px;
}

.home-text-block .status-report {
	text-align: left;
}
/*

.home-main-right .status {
        font-size: 24px;
        color: #093;
        padding: 0px 10px;
        border: 2px solid #093;
        border-radius: 20px;
        margin-right: 10px;
}


*/
.room-row-shades {
	background-color: #35556c;
	/*box-shadow: 5px 0px 10px 20px rgba(59, 77, 92, 0.96) inset;*/
	/*
	 box-shadow:
		 -10px 0px 10px 10px rgba(55, 80, 102, 0.4)
		, 10px 0px 10px 10px rgba(55, 80, 102, 0.55);
	*/
}

.room-row {
}

.room-cell {
    float: left;
    text-align: center;
    height: 170px;
    color: #ddd;
	/*background-color: #35556c;*/
    padding-top:30px;
    width: 16.65%;

}

.room-cell.control > .chevron {
	font-size: 60px;
}

.room-cell.control > div.chevron.down	{ display: none; }
.room-cell.control > div.chevron.up		{ display: block; }
.room-cell.control.collapsed > div.chevron.down	{ display: block; }
.room-cell.control.collapsed > div.chevron.up	{ display: none; }

.circle-o-large {
	border: 3px solid #ddd;
	height: 60px;
	width: 60px;
	padding: 0 0 10px 0;
	margin-top: 10px;
	margin-bottom: 10px;
	border-radius: 35px;
	line-height: 55px;
}

.room-cell > div {
	font-size: 14px;
	margin-top: 5px;
}

.general-viewport  .room-cell {
	width: 16.66%;
}

.small-viewport  .room-cell {
	width: 33.33%;
}

.col-nopadding {
	padding-left: 0;
	padding-right: 0;
}

.col-sm-12 > .add-room-cell {
	float: left;
    text-align: center;
    height: 240px;
    color: #333;
    background-color: #f0f0f0;
    padding-top:70px;
    width: 33.33%;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
}

.add-room-cell > div {
	font-size: 20px;
	line-height: 35px;
}

.add-room-cell > img {
	width: 100px;
	height: 75px;
}

.add-room-cell.prompt {
	background-color: white;
}

.plus {
	padding: 2px 7px;
	border-radius: 20px;
	border: 1px solid #000;
	margin-right: 5px;
}

.plus.ellip {
	letter-spacing: -1.5px;
}

.add-room-cell > .in-line {
	padding-top: 15px;
	margin: 0 auto;
}

.add-room-cell > .in-line > .in-line-item {
	float: left;
	display: table-cell;
	line-height: 28px;
	margin-left: 5px;
}

.fancy-frame-close {
	color: #fff;
	position: absolute;
	left: 2px;
	top: -5px;
	font-size: 20px;
	z-index: 10051;
}

.fancy-frame-close a:link		{ color: #fff; }
.fancy-frame-close a:visited	{ color: #fff; }
.fancy-frame-close a:hover	{ color: #fff; }
.fancy-frame-close a:active	{ color: #fff; }

a#notify-center-icon img {
	vertical-align: sub;
}

.notify-center-frame {
	width: 668px;
	height: 550px;
}

.notify-center {
	background-color: #274347;
	z-index: 4500;
	position: absolute;
	margin: 0 auto;
	width: 668px;
}

.notify-center .row {
	padding-left: 23px;
	padding-right: 23px;
}

.notify-center .stat-icon {
	display: inline-block;
	width: 32px;
	height: 32px;
	background-repeat: no-repeat;
	background-position: center;
	margin-top: -6px;
	margin-right: 4px;
}

.notify-center .head-icon {
	display: inline-block;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
	background-position: center;
}

 .notify-center .head-icon  i {
	font-size: 16px;
	vertical-align: middle;
	height: 18px;
	line-height: 13px;
}

.stat-icon.notify-bulb { background-image: url('/assets/images/notify-bulb.png'); }
.stat-icon.notify-temp { background-image: url('/assets/images/notify-temp.png'); }
.stat-icon.notify-plug { background-image: url('/assets/images/notify-plug.png'); }
.stat-icon.notify-door { background-image: url('/assets/images/notify-door.png'); }

.notify-center-title {
	background: none;
	color: #fefefe;
	font-size: 18px;
	text-align: center;
	padding: 16px 0;
}

.notify-section {
	width: 592px;
	/*border: 1px solid #fff;*/
	border-radius:20px;
	padding: 5px;
	background-color: #3e565a;
	color: #fefefe;
	margin: 20px auto;
	font-size: 18px;
	text-align: center;
}

.notify-event {
	/* border-bottom: 1px dashed #8a8a8a; */
	color: #fefefe;
	padding: 15px 10px;
	font-size: 14px;
}

.notify-event > .cat {
	color: #47c496;
}

.notify-event.notify-mesg {
	/* border-bottom: 1px dashed #8a8a8a; */
	color: #509d97;
}

/* fancybox hack */
.fancybox-inner {
	overflow-x: hidden;
}

.fancybox-skin {
	background: #274347;
	border-radius: 10px;
}


.log_door {
	font-size: 12px;
}

.panel-logs {
	padding-bottom: 95px;
}

.panel-index {
	padding-bottom: 36px;
	padding-top: 150px;
}

.log-panel > div {
	/* background-color: #fff; */
	vertical-align: middle;
	height: 50px;
}

.log-panel.bottom > div {
	height: 100px;
}

.log-panel.log-captions > div {
	padding: 20px;
	font-size: 16px;
}

.log-panel.log-captions a {
	/* color: #525252; */
}

.log-panel.log-captions a.cal-icon {
	padding: 3px;
	border-radius: 5px;
	text-decoration: none;
}

.log-panel.log-captions a.cal-icon:link {}
.log-panel.log-captions a.cal-icon:visited { text-decoration: none; }
.log-panel.log-captions a.cal-icon:hover { text-decoration: none; }

.log-panel.log-captions a.cal-icon:active { text-decoration: none; }
.log-panel.log-captions a:link		{ color: #f0f0f0; }
.log-panel.log-captions a:visited	{ color: #f0f0f0; }
.log-panel.log-captions a:hover		{ color: #f2fdd1; }
.log-panel.log-captions a:active	{ color: #28525b; /*background-color: rgba(232, 234, 171, 0.5);*/ }

.log-date-options  a {
	display: inline-block;
	/*float: left;*/
	height: 28px;
	line-height: 26px;
	color: #c7c7c7;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	width: 45px;
	padding: 0;
	border-radius: 20px;
	border: 1px solid #c7c7c7;
}



.log-date-options  a:link {
	color: #c7c7c7;
}

.log-date-options  a:visited {
	color: #c7c7c7;
}

.log-date-options  a:hover {
	/*background-color: #c7c7c7;*/
	color: #f2fdd1;
	text-decoration: none;
}

.log-date-options  a:active {
	background-color: #c7c7c7;
	color: black;
}

.log-date-options  a.active {
	background-color: #c7c7c7;
	color: #28525b;
}

.log-date-options  a.active:hover { color: #f2fdd1; }

.log-date-options > .options-md {
	padding-top: 3px;
}

.log-date-options > .options-md > a {
	width: 55px;
	height: 38px;
	padding: 5px;
}

.log-date-select > .selects-md {
	margin-top: 8px;
}

.log-date-select .dropdown-hours .btn  {
	width: 200px;
	line-height: 30px;
	border: 2px solid #c7c7c7;
	border-radius: 8px;
	margin-bottom: 13px;
	color: #f0f0f0;
}

.log-date-select .dropdown-hours.open .btn  { color: #f0f0f0; }

.log-date-select .dropdown-hours .btn:hover  { 
	color: #f2fdd1; 
	background: transparent;
}

.log-date-select .dropdown-hours .btn .button-icon {
	margin-top: -32px;
}

.log-date-select ul.dropdown-menu {
	min-width: 0;
	text-align: center;
	left: 0;
	width: 200px;
    background: transparent !important;
    border: 2px solid #c7c7c7;
	border-radius: 8px;
}

.log-date-select ul.dropdown-menu li a:hover { background-color: rgba(255, 255, 255, 0.3); }

.log-month-dial > a {
	display: block;
	padding: 5px 8px;
	font-size: 20px;
	border-radius: 10px;
	height: 42px;
	width: 155px;
}

.log-month-dial > a  i {
	margin-top: 4px;
	font-size: 26px;
}

.log-month-dial > a > div {
	display: table-cell;
}

.log-month-dial > a > div.text {
	padding: 3px 5px 0 5px;
}

.log-month-dial.disabled > a > div.text {
	color: #38805f;
}

.log-month-dial.disabled > a i {
	color: #38805f;
}

.log-month-dial > a:link {
	color: #c7c7c7;
}

.log-month-dial > a:visited {
	color: #c7c7c7;
}

.log-month-dial > a:hover {
/*	background-color: rgba(232, 234, 171, 0.5);*/
	color: #f2fdd1;
	text-decoration: none;
}

.log-month-dial > a:active {
	/*background-color: rgba(232, 234, 171, 0.5);*/
	/*color: #28525b;*/
}


.log-month-dial.dial-l > a > div {
	float: left;
}

.log-month-dial.dial-r > a > div {
	float: right;
}

.cal-input-concealed {
	visibility: hidden;
	font-size: 8pt;
}

.log-stats {
	font-size: 15px;
}

.log-stats a {
	display: inline-block;
	/*float: left;*/
	height: 28px;
	color: #525252;
	text-align: center;
	font-size: 15px;
	width: 45px;
	border-radius: 20px;
	background-color: #ebebeb;
}

.log-stats  a.active {
	background-color: #9e9e9e;
	color: #525252;
}

.log-stats  a:link {
	color: #525252;
}

.log-stats  a:visited {
	color: #525252;
}

.log-stats  a:hover {
	text-decoration: none;
}

.log-stats > .options-md {
	/*padding-top: 3px;*/
}

.log-stats > .options-md > a {
	width: 75px;
	height: 32px;
	padding: 5px;
}

.log-stats > div {
	margin-top: 25px;
}

.log-stats > .options-md > a#temp.active {
	background-color: #dbde2f;
}

.log-stats > .options-md > a#humid.active {
	background-color: #01adff;
}

.log-stats > .options-md > a#work.active {
	background-color: #fff;
}

.log-stats > .options-md > a:hover { color: #f2fdd1; }
.log-stats > .options-md > a#humid:hover	{ background-color: #01adff; }
.log-stats > .options-md > a#temp:hover		{ background-color: #dbde2f; }
/* .log-stats > .options-md > a#humid:hover { background-color: #01adff; } */
.log-stats > .options-md > a#work:hover { background-color: #bbb; }

.log-footer {
	color: #c7c7c7;
	padding-top: 5px;
}

.log-footer .stat-icon {
	vertical-align: middle;
}

.log-interval-select {
	width: 200px;
	font-size: 18px;
	border: #c7c7c7 1px solid;
	border-radius: 10px;
}

.log-interval-select > li > a {
	color: #c7c7c7;
}

.log-interval-select > li > a > i {
	font-size: 24px;
}

.log-interval-select > li > a:visited {
	color: #c7c7c7;
}

.log-interval-select > li > a:hover {
	color: #c7c7c7;
}

.log-interval-select > li > .dropdown-menu {
	font-size: 18px;
	width: 200px;
	background:rgba(47, 95, 83, 0.77);
	border: #c7c7c7 1px solid;
}

.log-interval-select > li > .dropdown-menu > li > a {
	color: #c7c7c7;
}

.log-interval-select > li > .dropdown-menu > li > a:hover {
	color: #000;
}

.log-interval-select > li > .dropdown-menu > li > a > i {
	padding-left: 10px;
}

.chartback {
	padding: 20px 0;
	background-color: #2d5c66;
}

.login-logo-block {
	width:300px;
	text-align: center;
	font-size: 28px;
	font-weight: normal;
	letter-spacing: 1px;
	color: #fff;
	padding-bottom: 118px;
}

.login-logo-block > img{

	margin-bottom: 15px;
}

.login-form {
	width: 300px;
	color: #fff;
}

.login-form input.form-control {
	width: 245px;
	height: 26px;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    color: #fff;
}

.login-form input.form-control.shadow {
	position: relative;
	margin-top: -30px;
	z-index: 255;
	cursor: text;
}

.login-form .form-group {
	border-bottom: 1px solid #fff;
	padding-bottom: 5px;
}

.login-form .form-group label > i {
	font-size: 24px;
	margin: 0 5px;
	width: 24px;
}

.form-footers a {
	color: #fff;
}

.form-footers .form-submit a {
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
}

.form-footers .form-submit a:link {
	text-decoration: none;
}

.form-footers .form-submit a:visited {
	text-decoration: none;
}

.form-footers .form-submit a:hover {
	text-decoration: none;
}

.form-footers .form-submit a:active {
	text-decoration: none;
}

.form-footers .form-submit a:focus {
	box-shadow: 0 0 3px 1px rgba(255,255,255,0.15);
	background-color: rgba(255,255,255,0.15);
}


.form-footers .forget-passwd a img {
	vertical-align: text-top;
}
.form-footers .forget-passwd {
	padding-top: 2px;
}

.login-form .form-control::-webkit-input-placeholder {
	color: #ccc;
}

.login-form .err-field {
	font-size: 24px;
	line-height: 24px;
}

.login-bottom-space {
	height: 225px;
	padding-top: 50px;
}

#login-alert, .dk-alert {
	/*
	box-shadow: 0px 0px 10px 5px #bce8f1;
	background-color: #bce8f1;
	*/
	box-shadow: 0px 0px 10px 5px #fff;
	background-color: #fff;
	opacity: 0.6;
	line-height: 45px;
	color: #333;
	text-align: center;
	font-weight: bold;
	font-size: 16px;
	border-radius: 3px;
	/* padding-left: 30px; */
}

.dk-alert-frame {
	height: 45px;
	margin: 0 auto;
}

#edit-alert {
	height: 30px;
	margin: 10px 0 20px 0;
	line-height: 30px;
}

#login-alert > button {
	float: right;
	background-color: transparent;
	border: none;
	padding: 0 10px;
}

._temp-logs {
	width: 95%;
	height: 400px;
	font-family: consolas;
	font-size: 10pt;
	overflow-x: scroll;
	overflow-y: scroll;
	background-color: #0a0201;
	color: #e9e7ec;
}

._temp-logs pre {
	background-color: #0a0201;
	color: #e9e7ec;
}
}

a.logdots:link {
	color: #428bca;
	text-decoration: none;
}

a.logdots:visited {
	color: #428bca;
	text-decoration: none;
}

a.logdots:hover {
	color: #fff;
	text-decoration: underline overline;
}


a.logdots:active {
	color: #428bca;
	text-decoration: none;
}

#userinfo {
	color: #fff;
}

#userinfo .form-group input.form-control {
	background: transparent;
	/* border: 1px solid #fff; */
	border: none;
	box-shadow: none;
	width: 210px;
	height: 35px;
	color: #eee;
	display: inline;
}

#userinfo .form-group .input-frame {
	border: 1px solid #fff;
	border-radius: 7px;
	width: 240px;
}

#userinfo .row.photoandname {
	margin-bottom: 20px;
}

#userinfo .row.photoandname .photo .frame img {
	/* box-shadow: 0 0 5px 3px rgba(255,255,255,0.5); */
}

#userinfo .form-group input#userCasaID {
	color: #333;
}

#userinfo .row.passwd {
	margin-top: 15px;
}

#userinfo .row.passwd div.field,div.message {
	display: inline-block;
}

#userinfo .row.passwd div.message {
	margin-left: 16px;
	line-height: 24px;
	vertical-align: text-top;
}

#userinfo .row.passwd div.label {
	width: 160px;
	float: right;
	font-size: 100%;
	line-height: 100%;
	text-align: left;
	font-weight: normal;
	line-height: 33px;
}

#userinfo .row.photoandname .photo {
	width:160px;
	float: right;
	text-align: center;
}

#userinfo .row.photoandname .photo div {
	padding-top: 8px;
}

#userinfo .row.photoandname .photo .upload a {
	font-weight: bold;
	color: #6fc1bb;
}

 .btn-dk {
	line-height: 50px;
	font-size: 15px;
	background: transparent;
	border: 1px solid #ccc;
	font-weight: normal;
	color: #ccc;
	font-family: Lato, "微軟正黑體";
	font-weight: 300;
}

 .btn-dk:hover {
	/*background-color: rgba(232, 234, 171, 0.5);*/
	background-color: rgba(255, 255, 255, 0.6);
	color: black;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}

 .btn-dk-md {
	width: 180px;
	margin: 10px;
	height: 50px;
}

 .btn-dk-lg {
	width: 384px;
	margin: 10px;
	height: 50px;
}

 .btn-dk-primary {
	background-color: #24494c;
	color: #6fc1bb;
}

#userinfo label {
	font-weight: normal;
}

#userinfo .row.buttons {
	padding-top: 58px;
}

#userinfo .row.buttons.delete-user {
	padding-top: 62px;
}

#userinfo .alert-frame {
	height: 60px;
}

.upload-frame {
	width: 668px;
	height: 400px;
}

.userinfo-avatar-upload {
	font-size: 15px;
	width: 70%
}
.userinfo-avatar-upload p {
	margin: 10px 0 15px 0;
}
.userinfo-avatar-upload .frame-group {
	height: 190px;
	padding: 10px 0;
}
.userinfo-avatar-upload .frame-group .select-frame {
	display:inline-block;
	vertical-align: top;
	width: 170px;
	height: 170px;
}
.userinfo-avatar-upload .frame-group .preview-frame {
	display:inline-block;
	width: 170px;
	height: 170px;
}

.userinfo-avatar-upload .frame-group .preview-frame canvas {
	border: 1px solid #aaa;
}
.userinfo-avatar-upload #upload-button {
}

.notify-center-title label h3 {
	border-radius: 20px;
	padding: 5px;
	background-color: #3e565a;
	color: #fefefe;
	width: 500px;
}

#devices {
	min-height: 500px;
}

#devices .gateway-header {
	background-color: #386d8f;
	color: #fff;
	height: 70px;
	margin-top: 1px;
	padding-top: 25px;
}

#devices .gateway-header .gateway-stat i {
	padding: 0 10px;
	font-size: 20px;
}

#devices .dev-cat-header {
	background-color: #20404b;
	color: #eee;
	height: 70px;
	margin-top: 1px;
	padding-top: 25px;
}

#devices .dev-cat-header .headspace { width: 35px; }

#devices .dev-cat-header .cat-title {
	display: inline-block;
	height: 36px;
	padding-bottom: 10px;
	margin-top: -16px;
	padding-left: 15px;
	vertical-align: text-top;
}

#devices .dev-cat-header .bar-icon { margin-top: -8px; }

#devices .dev-item {
	background-color: transparent;
	color: #eee;
	/*height: 50px;*/
	margin-top: 1px;
	padding-top: 24px;
	padding-bottom: 20px;
}

#devices .dev-item .headspace { width: 65px; }
#devices .dev-item .item-title { 
	padding-left:40px; 
	margin-top: 9px;
}

#devices .dev-item .item-title i {
	padding: 0 10px;
	font-size: 20px;
	vertical-align: top;
}

#devices .dev-item .item-title i.good {
	color: #6ec8e7;
}

#devices .dev-item .item-title i.warn {
	color: #fee00b;
}

.top-panel-row .devices-currentregion {
	text-align: right;
	line-height: 52px;
	color: #fff;
}

#devices .collapsible > .indicator { margin-top: -6px; }
#devices .indicator { margin-top: -6px; }

/*
#devices .collapsible.collapsed > .indicator > i.arrow-up {
	display: none;
}

#devices .collapsible:not(.collapsed) > .indicator > i.arrow-down {
	display: none;
}
*/

#devices .gateway-header .gateway-stat img {
	margin-top: -4px;
	margin-right: 10px;
}



#devices .float-menu {
	position: fixed;
	left: 0;
	top: 120px;

}

#devices .float-menu .icon {
	position: absolute;
	background-color: #d2d782;
	opacity: 0.9;
	width: 63px;
	height: 63px;
	color: black;
	text-align: center;
	line-height: 70px;
	opacity: 0.8;
}

#devices .float-menu .menu {
	position: absolute;
	left: -180px;
}

#devices .float-menu .menu div {
	height: 50px;
	background-color: #d2d782;
	color: black;
	width: 180px;
	margin-bottom: 5px;
	line-height: 50px;
	padding-left: 40px;
	opacity: 0.8;
	/*box-shadow: 1px 1px 15px 8px #ccc inset;*/
}

#devices .float-menu .menu div.items {
}

#devices .float-menu .menu .header {
	padding-left: 20px;
}

#devices .float-menu .menu i.pull-right {
	color: #000;
	line-height: 30px;
	padding: 8px 12px;
	margin: 2px;
	background-color: #f6fce8;
	z-index: 1024;
}

.rename-form-row {
	height: 220px;
	padding-top: 80px;
}

.rename-icon {
	display: inline-block;
	width: 46px;
	height: 74px;
	background-repeat: no-repeat;
	background-position: center;
}

.rename-field {
	display: inline-block;
	vertical-align: top;
	margin-top: 20px;
	margin-left: 10px;
}

.rename-field input.form-control {
	width: 230px;
}

.rename-icon.icon-bulb		{ background-image: url('/assets/images/rename-device-bulb.png'); }
.rename-icon.icon-plug		{ background-image: url('/assets/images/rename-device-plug.png'); }
.rename-icon.icon-door		{ background-image: url('/assets/images/rename-device-door.png'); }
.rename-icon.icon-weather	{ background-image: url('/assets/images/rename-device-weather.png'); }

.dashboard .connstat.green	{ color: #95e868; }
.dashboard .connstat.yellow	{ color: #ffe400; }
.dashboard .connstat.red	{ color: #e24a2c; }

#add-room-box, #moveto-room-box, #edit-room-box { color: #fefefe; }

.add-room-frame {
	width: 680px;
	height: 630px;
}

.add-room-frame .room-frame { height: 400px; }

.add-room-frame .edit-ops a.edit-op { 
	font-size: 16px; 
	margin-right: 26px;
}

.add-room-frame .edit-ops a.edit-op:link	{ color: #ddd; }
.add-room-frame .edit-ops a.edit-op:visited { color: #ddd; }
.add-room-frame .edit-ops a.edit-op:hover	{ color: #f2fdd1; }
.add-room-frame .edit-ops a.edit-op:active	{ color: #ddd; }


.add-room-frame .list-rows div.list-selected .edit-ops { color: #fefefe; }

.add-room-frame .op-icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	vertical-align: sub;
	margin-right: 8px;
	background-size: 100% 100%;	
	background-repeat: no-repeat;
	background-position: center;
}

.op-icon.op-edit	{ background-image: url('/assets/images/dashboard-roomedit-edit.png'); }
.op-icon.op-delete	{ background-image: url('/assets/images/dashboard-roomedit-delete.png'); }

.add-room-frame div .input-room-name {
	width: 140px;
    height: 24px;
	line-height: 20px;
	padding-bottom: 5px;
    vertical-align: middle;
    background: transparent;
    border: none;
    color: #fefefe;
	outline: 0;
}

.add-room-frame div.list-selected .input-room-name { border-bottom: #60A978 solid 1px; }

.add-room-frame .alert-mesgs {
	width: 320px;
    text-align: center;
    margin: 0 auto;
    background-color: rgba(255,255,255,0.7);
    box-shadow: 0 0 8px 8px rgba(255,255,255,0.7);
    color: #222;
    font-weight: bold;
    font-size: 18px;
}

.add-room-frame .alter-mesgs.concealed { visibility: hidden; }

.add-room-frame .edit-warn {
	margin-top: 120px;
	float: left;
}

.add-room-frame .warn-left {
    width: 35%;
	height: 120px;
    text-align: right;
    padding: 0 20px;
}

.add-room-frame .warn-left img {
    width: 80px;
	height: 80px;
}

.add-room-frame .warn-right	{ 
	width: 55%;
	height: 120px;
}

.add-room-frame .warn-center	{ 
	width: 100%;
	text-align: center;
    line-height: 130px;
}

.add-room-frame  .warn-title	{ 
	font-size: 24px;
	color: #69bdbc;
	font-weight: bold;
}
.add-room-frame .warn-text	{ 
	font-size: 18px; 
	color: #f0f0f0;
}

.add-room-frame .warn-link {
    padding: 15px;
    border: 2px solid #69bdbc;
    margin: 10px;
    border-radius: 8px;
}
.add-room-frame .warn-link:link		{ color: #69bdbc; }
.add-room-frame .warn-link:visited	{ color: #69bdbc; }
.add-room-frame .warn-link:hover	{ color: #f2fdd1; }
.add-room-frame .warn-link:active	{ color: #69bdbc; }

.notify-center.add-room {
	background-color: #274347;
	z-index: 4500;
	position: absolute;
	margin: 0 auto;
	width: 670px;
}

.notify-center input.form-control {
	background: transparent;
	border: none;
	box-shadow: none;
	color: #fefefe;
	font-size: 18px;
}

.notify-center input.form-control.with-titles {
	display: inline-block;
	width: 70%;
}

.notify-center .row.list-rows {
	line-height: 85px;
	width: 88%;
	border-bottom: 2px solid rgba(184, 177, 177, 0.41);
	font-size: 18px;
	margin-left: 45px; /* added 6/26/2015 - compensate left margin after add-room-box scrollbar removal */
}

.notify-center .row.list-rows .current { color: #aaa; }
.notify-center .list-rows div i.fa {
	padding-left: 5px;
	padding-right: 20px;
}

.notify-center .list-rows div.list-selected {
	color: #7aeae5;
}

.dk-panel-2-button {
	width: 450px;
	text-align: center;
}

.head-space-30 {
	padding-top: 30px;
}




#roommain {
	min-height: 500px;
}

#roommain .dev-cat-header {
	background-color: #20404b;
	color: #eee;
	height: 70px;
	margin-bottom: 1px;
	padding-top: 15px;
}

.bar-icon {
	display: inline-block;
	width: 40px;
	height: 36px;
	background-repeat: no-repeat;
	background-position: center;
}

#roommain .dev-cat-header .bar-icon {
	margin-top: 3px;
}

 .bar-icon.cat-weather { background-image: url('/assets/images/cats-weather.png'); }
 .bar-icon.cat-plugs { background-image: url('/assets/images/cats-plugs.png'); }
 .bar-icon.cat-bulbs { background-image: url('/assets/images/cats-bulbs.png'); }
 .bar-icon.cat-doors { background-image: url('/assets/images/cats-doors.png'); }
 .bar-icon.icon-saver { background-image: url('/assets/images/icon-saver.png'); }
 .bar-icon.icon-stats {
	width: 90px; height: 34px;
	background-image: url('/assets/images/icon-stats.png');
}

#roommain .dev-cat-header .cat-title {
	display: inline-block;
	height: 36px;
	vertical-align: top;
	padding-left: 15px;
	padding-top: 8px;
}

#roommain .bar-slot {
	display: block;
	float: right;
	text-align: right;
}

#roommain .bar-slot.indicators { padding-top: 5px; }

/*
//For whole-line accordions
#roommain .collapsible.collapsed  .indicator > div > i.arrow-up	{ display: none; }
#roommain .collapsible:not(.collapsed)  .indicator > div > i.arrow-down { display: none; }
// For parts-of-line accordions (with toggles on accordion title bars) - 2/24/2015
#roommain .collapsible.collapsed.indicator > div > i.arrow-up	{ display: none; }
#roommain .collapsible.indicator:not(.collapsed) > div > i.arrow-down { display: none; }
-- discarded in favor of javascript event driven display (3/13)
*/

#roommain .row.stat-row {
	margin-top: 25px;
	margin-bottom: 20px;
}

/*
#roommain .row.stat-row.yellow	{ color: #ffe401; }
#roommain .row.stat-row.blue	{ color: #65cde8; }
#roommain .row.stat-row.dark	{ color: #1a1a20; }
*/

#roommain .row.stat-row.norm	{ color: #a2d11f; }
#roommain .row.stat-row.warning	{ color: #fdbb33; }
#roommain .row.stat-row.offline	{ color: #e72526; }

#roommain .stat-row .stat-text {
	display: inline-block;
	vertical-align: middle;
	height: 36px;
	line-height: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #fcfee3;
}

#roommain .row.stat-row div.blur-on-fault { padding-right: 0; }
#roommain .row.stat-row.fault div.blur-on-fault { opacity: 0.4; }
#roommain .row.stat-row.fault div.blur-on-fault div { color: #162e38; }

#roommain .stat-row.fault .stat-text { 
	color: #162e38; 
	font-weight: bold;
}

.stat-text.devname {
	width: 125px;
}

 .stat-icon {
	display: inline-block;
	width: 36px;
	height: 36px;
	background-repeat: no-repeat;
	background-position: center;
	text-align: center;
}

 .stat-icon  i {
	/*font-size: 24px;*/
	font-size: 12px;
	vertical-align: middle;
	height: 36px;
	line-height: 12px;
	
}

.stat-icon.stat-humi { background-image: url('/assets/images/stat-humi-white.png'); }
.stat-icon.stat-temp { background-image: url('/assets/images/stat-temp-white.png'); }
.stat-icon.stat-baro { background-image: url('/assets/images/stat-baro-white.png'); }
/*
.stat-icon.stat-humi.yellow { background-image: url('/assets/images/stat-humi-yellow.png'); }
.stat-icon.stat-temp.yellow { background-image: url('/assets/images/stat-temp-yellow.png'); }
.stat-icon.stat-baro.yellow { background-image: url('/assets/images/stat-baro-yellow.png'); }
*/
#roommain .stat-row.yellow .stat-icon.stat-humi { background-image: url('/assets/images/stat-humi-yellow.png'); }
#roommain .stat-row.yellow .stat-icon.stat-temp { background-image: url('/assets/images/stat-temp-yellow.png'); }
#roommain .stat-row.yellow .stat-icon.stat-baro { background-image: url('/assets/images/stat-baro-yellow.png'); }
/*#roommain .stat-row .stat-icon.stat-batt.batt-low { background-image: url('/assets/images/stat-batt-yellow.png'); }*/
#roommain .stat-row .stat-icon.stat-batt.batt-low {
	background-image: url('/assets/images/dashboard-battery-white.png'); 
	background-position: 0 5px;
}

#roommain .stat-row.fault.devfault .stat-icon.stat-conn {
    background-image: url('/assets/images/rooms-dashboard-fault.png');
	background-position: 4px 8px;
}

#roommain #dev-cat-doors .stat-row.fault.devfault .stat-icon.stat-conn {
    background-image: url('/assets/images/rooms-dashboard-fault.png');
	background-position: 4px 6px;
}

.stat-icon.icon-check { background-image: url('/assets/images/icon-check.png'); }
.stat-icon.icon-check.dim { background-image: url('/assets/images/icon-check-dim.png'); }
.stat-icon.icon-checkmulti { background-image: url('/assets/images/icon-checkmulti.png'); }
.stat-icon.icon-checkmulti.dim { background-image: url('/assets/images/icon-checkmulti-dim.png'); }

#roommain .dropdown-rooms .btn-rooms 
,#devices .dropdown-rooms .btn-rooms {
	width: 110px;
	height: 36px;
	background: transparent;
	border: 1px solid #fefefe;
	border-radius: 5px;
	color: #fefefe;
	/*box-shadow: 0 0 6px 1px rgba(253,253,253,0.4);*/
	overflow-x: hidden;
	font-size: 15px;
	font-weight: normal;
	text-align: left;
}

#roommain .dropdown-rooms.disabled .btn-rooms
, #devices .dropdown-rooms.disabled .btn-rooms {
	border: 1px solid #000;
	color: #000;
	box-shadow: 0 0 4px 1px rgba(2,3,4,0.4);
}

#roommain .dropdown-rooms .btn-rooms i 
,#devices .dropdown-rooms .btn-rooms i {
	font-size: 25px;
}

#roommain .btn + .dropdown-menu 
,#devices .btn + .dropdown-menu {
	left: 0;
	min-width: 0;
	width: 110px;
}

#roommain .stat-row .pwr-text {
	color: #fefefe;
	line-height: 32px;
}

#roommain .stat-row .pwr-text .pwr-cue {
	font-size: 13px;
	background-color: #295778;
	padding: 3px 8px;
	margin-right: 5px;
	border-radius: 2px;
	line-height: 32px;
}

#roommain .toggle-iphone .toggle-on, .toggle-iphone .toggle-off { font-size: 14px; }

#roommain .toggle-iphone .toggle-on:after,
#roommain .toggle-iphone .toggle-off:after {
	background: none;
}
#roommain .toggle-iphone .toggle-on		{
	color: #f0fffa;
	padding-left: 30px;
	background-color: #58aa82;
}
#roommain .toggle-iphone .toggle-off	{
	color: #526c79;
	background-color: #162e38;
	padding-left: 5px;
	text-shadow: 0 0 1px #122e3c;
}

#roommain .toggle {
	width: 80px;
	height: 36px;
}

#roommain .toggle-grand {
	width: 80px;
	height: 36px;
}

#roommain .toggle-grand-mask {
	width: 80px;
	height: 36px;
	position: relative;
	opacity: 0.35;
}

#roommain .toggle-sub-mask {
	width: 80px;
	height: 36px;
	position: relative;
	opacity: 0.35;
}

#roommain .jquislider { line-height: 32px; }
#roommain .jquislider .text-off {
	color: #000;
	font-weight: bold;
	text-align: right;
}
#roommain .jquislider .body {
	height: 16px;
	padding-top: 14px;
	width: 160px;
	min-width: 80px;
}
#roommain .jquislider .text-num {
	color: #f6fae0;
	text-align: left;
	white-space: nowrap;
}

#roommain .range-handle {
	height: 42px;
	top: -18px;
	position: absolute;
	width: 42px;
	background-image: url('/assets/images/slider-handle-on.png');
	background-position: -3px -2px;
	background-repeat: no-repeat;
}

#roommain .range-handle.dimmed {
	background-image: url('/assets/images/slider-handle-off.png');
	background-color: #162e3b;
}

#roommain .range-bar.dimmed {
	background-color: #162e3b;
}

#roommain .range-quantity {
	background: none;
}

.concealed {
	visibility: hidden;
}

#roommain .door-status { 
	line-height: 36px; 
	color: #fcfee3;
}
/*
#roommain .door-status.open		{ color: #fff; }
#roommain .door-status.closed	{ color: #000; }
*/

#roommain .overhead.center {
	background-image: url('/assets/images/room-overhead-smile-1.png');
	height: 260px;
	background-position: center bottom;
	/*background-position-y: 85px;*/
	background-repeat: no-repeat;
}

#roommain .overhead .bunch {
	width: 1px;
	display: block;
	margin: 0 auto;

}

#roommain .overhead .bunch .sprite {
	position: absolute;
	/* width: 140px; */
	height: 42px;
}

#roommain .overhead .bunch .sprite.smile-text {
	width: 320px;
	color: #347297;
	margin-top: 220px;
	margin-left: -160px;
	text-align: center;
	font-weight: bold;
}


#roommain .overhead .sprite.oclock12 { margin-left: -60px; margin-top: 0; }
#roommain .overhead .sprite.oclock11 { margin-left: -290px; margin-top: 60px; }
#roommain .overhead .sprite.oclock01 { margin-left:  150px; margin-top: 60px; }
#roommain .overhead .sprite.oclock10 { margin-left: -340px; margin-top: 170px; }
#roommain .overhead .sprite.oclock02 { margin-left:  230px; margin-top: 170px; }
/*
#roommain .overhead .sprite.oclock10 { top: 170px; left: 598px; }
#roommain .overhead .sprite.oclock11 { top: 60px; left: 655px; }
#roommain .overhead .sprite.oclock12 { top: 20px; left: 605px; }
#roommain .overhead .sprite.oclock01 { top: 60px; left: 598px; }
#roommain .overhead .sprite.oclock02 { top: 170px; left: 608px; }
*/
#roommain .overhead .sprite-icon {
	display: inline-block;
	height: 42px;
	width: 42px;
	background-position: center;
	background-repeat: no-repeat;
	/* border: 1px dashed #fea; */
}

#roommain .overhead .sprite-text {
	display: inline-block;
	height: 42px;
	/* width: 96px; */
	/* border: 1px dotted #fff; */
	vertical-align: top;
}

#roommain .overhead .airq .sprite-icon	{ background-image: url('/assets/images/room-overhead-icon-air.png'); }
#roommain .overhead .elec .sprite-icon	{ background-image: url('/assets/images/room-overhead-icon-elec.png'); }
#roommain .overhead .humi .sprite-icon	{ background-image: url('/assets/images/room-overhead-icon-humid.png'); }
#roommain .overhead .temp .sprite-icon	{ background-image: url('/assets/images/room-overhead-icon-temp.png'); }

#roommain .overhead .airq { color: #dd7400; }
#roommain .overhead .elec { color: #71dbaa; }
#roommain .overhead .humi { color: #00b2fd; }
#roommain .overhead .temp { color: #e0df2d; }

#roommain .overhead .sprite-dot {
	position: absolute;
	display: block;
	width: 14px;
	height: 16px;
}

#roommain .overhead .sprite-dot.oclock10 { margin-top: 180px; margin-left: -217px; }
#roommain .overhead .sprite-dot.oclock11 { margin-top: 100px; margin-left: -157px; }
#roommain .overhead .sprite-dot.oclock12 { margin-top: 50px; margin-left: -7px; }
#roommain .overhead .sprite-dot.oclock01 { margin-top: 100px; margin-left: 150px; }
#roommain .overhead .sprite-dot.oclock02 { margin-top: 180px; margin-left: 210px; }

/* 6/30/2015: Suppress the blue square halo around the slider knob for chrome/safari (or webkit based browsers) */
#roommain .ui-slider > span:focus { outline: 0; }

/* overriding jquery.fancybox.css: 180 */
.fancybox-overlay {
	/* background: url('fancybox_overlay.png'); */
	background-image: none;
	background-color: rgba(255, 255, 255, 0.3);
}

/* begin dropdown menu transition */
.open > .dropdown-menu {
  animation-name: slidenavAnimation;
  animation-duration:.4s;
  animation-iteration-count: 1;
  animation-timing-function: ease;
  animation-fill-mode: forwards;

  -webkit-animation-name: slidenavAnimation;
  -webkit-animation-duration:.4s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;

  -moz-animation-name: slidenavAnimation;
  -moz-animation-duration:.4s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: forwards;
}

@keyframes slidenavAnimation {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes slidenavAnimation {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* end dropdown menu transition */

#dotchart-0 .title-vaxis {
	font-size: 24px;
	letter-spacing: 5px;
	color: rgb(255, 255, 255);
	opacity: 0.9;
	position: relative;
	left: 45px;
	top: -420px;
}

#dotchart-0 .title-haxis {
	font-size: 14px;
	color: rgb(255, 255, 255);
	opacity: 0.9;
	position: relative;
	left: 45px;
	top: -110px;
}

#dotchart-0 .title-master {
	font-size: 48px;
	letter-spacing: 20px;
	color: rgb(255, 255, 255);
	opacity: 0.2;
	position: relative;
	display: inline-block;
	top: -350px;
}

#dotchart-0 .title-mesg {
	font-size: 48px;
	letter-spacing: 10px;
	color: rgb(255, 255, 255);
	opacity: 0.4;
	position: relative;
	display: inline-block;
	top: -330px;
}

.dbg { border: 1px solid; }
.dbg.f { border-color: #dde; }
.dbg.g { border-color: #dde; }

.page-details .dropdown-device .btn-rooms {
	border: 2px solid #c7c7c7;
	border-radius: 8px;
	width: 180px;
	height: 35px;
	margin-bottom: 13px;
	line-height: 22px;
	background: transparent;
	color: #f0f0f0;
	/* box-shadow: 0 0 6px 1px rgba(253,253,253,0.4); */
	font-size: 15px;
	font-weight: normal;
	text-align: left;
	overflow-x: hidden;
}

.page-details .dropdown-device .btn-rooms:hover { color: #f2fdd1; }

.page-details .dropdown-device.disabled .btn-rooms {
	border: 1px solid #000;
	color: #000;
	box-shadow: 0 0 4px 1px rgba(2,3,4,0.4);
}

.page-details .dropdown-device .btn-rooms i {
	font-size: 20px;
}

.page-details .dropdown-device .btn-rooms .button-icon {
	margin-top: -24px;
}

.page-details .btn + .dropdown-menu {
	left: 0;
	min-width: 0;
	font-size: 15px;
	width: 180px;
	border: 2px solid #c7c7c7;
	border-radius: 8px;
	background: transparent !important;
}

.page-details .dropdown-device .dropdown-menu li a:hover { background: rgba(255,255,255,.3); }

.savings {
	background-color: #2d5d66;
}

.savings .dropdown-year {
	display: inline-block;
	line-height: 28px;
}

.savings .dropdown-year .btn-rooms {
	background: transparent;
	border: 1px solid #c7c7c7;
	border-radius: 5px;
	color: #c7c7c7;
	/* box-shadow: 0 0 6px 1px rgba(253,253,253,0.4); */
	font-size: 15px;
	font-weight: normal;
	text-align: left;
	width: 80px;
	height: 25px;
	line-height: 22px;
}

.savings .dropdown-year.disabled .btn-rooms {
	border: 1px solid #000;
	color: #000;
	box-shadow: 0 0 4px 1px rgba(2,3,4,0.4);
}

.savings .dropdown-year .btn-rooms i { font-size: 20px; }
.savings .dropdown-year .btn-rooms .button-icon	{ margin-top: -24px; }
.savings .dropdown-year button.btn-rooms:hover	{ color: #f2fdd1; }

.savings .btn + .dropdown-menu {
	left: 0;
	min-width: 0;
	font-size: 15px;
	width: 80px;
}

.savings .dropdown-year#dropdown-device .btn-rooms,
.savings .dropdown-year#dropdown-device .dropdown-menu { width: 180px; }

.savings #flip {
	height: 350px;
	display: block;
	width: 800px;
	margin: 0 auto;
}

.savings #flip a {
	text-decoration: none;
	color: #fefefe;
}

.savings .card {
	height: 300px;
	min-width: 150px;
	/*background-color: #315874;*/
	text-align: center;
}

.savings .card .title1 {
	margin-bottom: 20px;
	font-size: 24px;
}

.flip-nav {
	width:350px;
	margin: 0 auto;
	color: #fefefe;
	text-align: center;

}

.flip-nav .dots {
	margin: 20px 0 30px 0;
	padding-top: 3px;
}

.flip-nav .arrow.left { float: left; }
.flip-nav .arrow.right { float: right; }

.flip-nav .dots .navdot i {
	padding: 0px 6px;
	font-size: 12px;
}

.flip-nav .navdot.active   .off { display: none; }
.flip-nav .navdot.active   .on  { display: inline; }
.flip-nav .navdot.inactive .off { display: inline; }
.flip-nav .navdot.inactive .on  { display: none; }

.savings.above {
	background: none;
	padding-bottom: 145px;
}

.savings .dial-frame {
	position: absolute;
}

.savings .dial-frame.big {
	left: 50px;
	opacity: 0.0;
}

.savings .dial-frame.small {
	left: 25px;
	top: 95px;
}

.savings .card-footer {
	margin-top: 230px;
	opacity: 0.0;
}

.savings .power-rate {
	display: block;
	width: 300px;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 30px;
}

.savings .power-rate-input {
	display: none;
}

.savings .cash-diff {

}

.savings .cash-diff .down {
	color: #c0ed81;
	display: none;
}

.savings .cash-diff .up {
	color: #f3a044;
	display: none;
}

.savings .cash-diff .icon-spends {
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: bottom;
	background-repeat: no-repeat;
	background-position: center;
}

.savings .cash-diff .down .icon-spends	{ background-image: url('/assets/images/savings-saving.png'); }
.savings .cash-diff .up .icon-spends	{ background-image: url('/assets/images/savings-overuse.png'); }

.add-room-frame#power-rate-input-box {
	height: 410px;
}

.pri { display: inline-block; }

.pri.form-group .form-control {
	width: 100px;
	display: inline;
	text-align: right;
}

.pri.errmark { visibility: hidden; }

/* begin clickable element transition */
.clickable:hover {
  animation-name: fadingAnimation;
  animation-duration:.2s;
  animation-iteration-count: 1;
  animation-timing-function: ease;
  animation-fill-mode: forwards;

  -webkit-animation-name: fadingAnimation;
  -webkit-animation-duration:.2s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;

  -moz-animation-name: fadingAnimation;
  -moz-animation-duration:.2s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: forwards;
}

@keyframes fadingAnimation {
  from {
    opacity: 1;
  }
  to {
    opacity: 0.7;
	/*
	box-shadow: 0 0 5px 3px rgba(214, 214, 214, 0.2);
	border-radius: 5px;
	background-color: rgba(214, 214, 214, 0.1);
	*/

  }
}
@-webkit-keyframes fadingAnimation {
  from {
    opacity: 1;
  }
  to {
    opacity: 0.6;
    /*
	-webkit-border-radius: 5px;
	background-color: rgba(214, 214, 214, 0.1);
	*/
  }
}
/* end dropdown menu transition */

/* Remove IE10 input clear (x)/reveal (eye) icons */
input::-ms-clear, input::-ms-reveal{
    display:none;
}

.dk-navbar .idle-timer {
	position: fixed;
	margin-top: -12px;
	margin-left: 120px;
	font-size: 20pt;
	opacity: 0.7;
	text-align: right;
}

.dk-navbar .focuschk {
	position: fixed;
	width: 160px;
	height: 75px;
	margin-left: 120px;
	margin-top: 40px;
	overflow-x: hidden;
	overflow-y: scroll;
	white-space: pre;
	font-family: consolas;
	font-size: 8pt;
	line-height: 9pt;

}