html {
	position:fixed;
	scroll-behavior: smooth;
}
@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

body{
	position:fixed;
	padding:0px;
	margin:0px;
	background-color:rgba(240,240,245,1);
	font-family:'Helvetica';
	height:100%;
	width:100%;
}
#vwlogo {
	position:fixed; right:15px; top:15px; height:90px;
}
div {
	cursor:pointer;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}

.grecaptcha-badge { opacity:0;}

#content {
	position:relative;
	top:0px;
	margin-top:20px;
}
a {
	color:#444444;
}
#admingrid {
	width:800px;
	margin:auto;
	margin-top:60px;
}
#admingrid .adminbttn {
	font-size:2em;
	width:350px;
	height:100px;
	line-height:100px;
	border-radius:20px;
	margin:10px;
	text-align:center;
	padding:0px;
	background-color:#EEEEEE;
}
#admingrid .adminbttn:not(.disabled) a:hover {
	background-color:#222222;
	color:#FFFFFF;
	box-shadow:5px 5px 5px rgba(0,0,0,.3);
}
#admingrid .adminbttn a {
	border-radius:20px;
	text-decoration:none;
	display:inline-block;
	width:100%;
    height:100%;
    border:2px solid #999999;
    padding:0px;
}

#map {
	position:absolute;
	top:40px;
	left:0px;
	width:100%;
    height: calc(100% - 40px);
    border-radius:0px 0px 10px 10px;
    overflow:hidden;
    z-index:100;
}
#mapmenu {
	list-style:none;
	position:absolute;
	top:60px;
	left:20px;
	margin:0px;
	padding:0px;
	background-color:rgba(255,255,255,.7);
	box-shadow:5px 5px 5px rgba(0,0,0,.6);
	z-index:110;
	border-radius:5px;
	color:#444444;
	overflow:hidden;
}
#mapmenu ul {
	list-style:none;
	margin:0px;
	padding:0px;
}
#mapmenu li.header {
	padding:5px 20px;
	font-size:.7em;
}
#mapmenu ul>li {
	padding:5px;
	font-size:.7em;
}
#mapmenu ul>li:not(.header):hover {
	background-color:#000000;
	color:#FFFFFF;
}
#mapmenu li.header {
	background-color:#444444;
	color:#FFFFFF;
	border-bottom:1px solid #666666;
	font-size:.8em;
	font-weight:700;
	margin-bottom:5px;
	margin-top:5px;
	padding-top:8px;
	text-align:center;
}
#mapmenu ul>li:before {
	display: inline-block;
	width:20px;
	text-align:center;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Free";
}
#mapmenu ul>li.ACTIVE { color:#444444; }
#mapmenu #readcommunities>li.ACTIVE:before {
	content: "\f276";
}
#mapmenu #installcommunities>li.ACTIVE:before {
	content: "\f041";
}
#mapmenu ul>li.COMPLETE { color:#999999; }
#mapmenu #readcommunities>li.COMPLETE:before {
	content: "\f276";
}
#mapmenu #installcommunities>li.COMPLETE:before {
	content: "\f041";
}
#mapmenu ul>li.SUSPENDED { color:#DD6666; }
#mapmenu ul>li.SUSPENDED:before {
	content: "\f071";
}
h1 {
	font-size:4em;
	color:#555555;
	text-align:center;
	margin:0px;
}
.helpbttn {
	position:fixed;top:260px;right:20px;font-size:4em;color:#C00000;
}
.subtitle {
	width:100%;text-align:center;font-size:2em;color:#555555;
}

.heading {
	font-size:3.5vw;
	color:rgba(100,100,110,1);
	text-align:center;

}
.account {
	font-size:2em;
	color:rgba(100,100,110,1);
	text-transform: uppercase;
}
#communitycode {
	position:relative;
	width:100%;
	text-align:center;
	margin-top:30px;
}


#communitynum,
#accountnum {
	position:relative;
	border-radius: 30px;
	border: 1px solid rgba(180,180,180,.2);
	background-color:rgba(255,255,255,.1);
	height:90px;
	width:calc(100% - 20px);
	float:left;
	margin-left:10px;
	font-size:4em;
	font-weight:bold;
	color: #661111;
	text-align:center;
	box-shadow:inset 2px 2px 4px rgba(0,0,0,.3);
}
#keypad {
	position:relative;
	width:100%;
}
.key {
	position:relative;
	width:33%;
	height:120px;
	float:left;
}
.keywrap {
	box-shadow:inset -1px -1px 3px rgba(80,80,95.4);
	position:relative;
	width:calc(100% - 20px);
	height:calc(100% - 20px);
	margin:10px;
	border-radius:30px;
	border: 1px solid rgba(80,80,80,.5);
	background-color:rgba(255,255,255,1);
	background: linear-gradient(170deg, rgba(255,255,255,1) 0%, rgba(190,190,195,0.1) 40%, rgba(130,130,140,.3) 100%);
	color:rgba(40,40,45,.8);
	font-size:4em;
	font-weight:700;
	line-height:100px;
	text-align:center;
}
.key.placeholder {
	border:transparent;
	background-color:transparent
}
.enterbutton {
	position:relative;
	padding:10px 5px;
	width:60%;
	height:60px;
	line-height:60px;
	background-color:#C00000;
	font-size:2em;
	font-weight:700;
	color:rgba(255,255,255,1);
	border-radius: 30px;
	text-align:center;
	margin:auto;
	margin-top:30px;
}
.enterbutton-small {
	position:relative;
	padding:5px 5px;
	width:30%;
	height:30px;
	line-height:30px;
	background-color:#C00000;
	font-size:1em;
	font-weight:700;
	color:rgba(255,255,255,1);
	border-radius: 10px;
	text-align:center;
	margin:auto;
}
.enterbutton:not(.disabled):hover,
.enterbutton-small:not(.disabled):hover {
	background:#444444;
	cursor:pointer;
}
.disabled {
	cursor:none;
	opacity:.20;
	font-weight:700 !important;
}
.blur {
	filter: blur(3px);
	opacity:.7;
}
.holiday,
.weekend {
	opacity:.20;
	font-weight:400 !important;
}
.datefield {
	position:relative;
	border-radius:10px;
	border: 1px solid rgba(180,180,180,1);
	background-color:rgba(230,230,230,1);
	width:17%;
	height:120px;
	line-height:120px;
	margin:0px 16px;
	float:left;
	font-size:4em;
	color: rgba(100,100,100,1);
	text-align:center;
	cursor:pointer;
}
.datefield-placeholder {
	border-radius:10px;
	border: 1px solid transparent;
	background-color:transparent;
	width:17%;
	height:120px;
	line-height:120px;
	margin:0px 10px;
	float:left;
	font-size:4em;
	color: transparent
	text-align:center;
	cursor:pointer;
}
.dayofweek {
	width:17%;
	margin:0px 11px;
	float:left;
	font-size:1.5em;
	color: rgba(100,100,100,1);
	text-align:center;
	cursor:arrow;
}
.timefield {
	position:relative;
	border-radius:10px;
	border: 1px solid rgba(180,180,180,1);
	background-color:rgba(255,255,255,1);
	width:48%;
	height:160px;
	margin:10px 9px;
	float:left;
	font-size:4em;
	font-weight:700;
	line-height:160px;
	color: rgba(100,100,100,1);
	text-align:center;
	cursor:pointer;
}
.timefield.selected:after {
	content:"Click Select Below to Finalize";
	position:absolute;
	bottom:15px;
	left:0px;
	height:20px;
	line-height:20px;
	width:100%;
	text-align:center;
	font-size:24px;
	font-weight:400;
}
#result {
	display:none;
	position:absolute;
	width:100%;
	bottom:20px;
	font-size:18px;
	margin-top:25px;
	color: rgba(100,100,100,1);
	text-align:center;
}
#logoHolder {
	position:relative;
	margin:auto;
	margin-bottom:40px;
	width:100%;
	height:200px;
	text-align:center;
}
#logoHolder>img {
    max-width: 100%;
    max-height: 100%;
}

.pageHeader {
	position:fixed;
	top:0px;
	width:100%;
	box-shadow:0px 3px 6px rgba(0,0,0,.8);
	background-color:rgba(230,230,240,1);
	z-index:1000;
}
.pageContent {
	position:relative;width:100%;height:calc(100% - 190px);top:195px;left:0px;overflow-y:scroll;z-index:100;
}
.pageContentWrapper {
	position:relative;
	margin:0px 40px;
	color:rgba(90,90,95,1);
	height:auto;
	padding-top:50px;
}

.schedule {
	position:relative;
	width:calc(100% - 10px);
	border:3px solid rgba(200,200,215,1);
	padding:5px;
	margin:0px 0px 50px 0px;
	border-radius:5px;
	background-color:#FFFFFF;
}
.schedulename {
	height:120px;
	line-height:120px;
	padding:0px 20px 20px 20px;
	font-size:2em;
}
.scheduleholder {
	position:relative;
	margin-top:-20px;
	height:0px;
	overflow:hidden;
	text-align:center;
}
#userPrompt,
#schedulePrompt {
	position:absolute;
	width:calc(100% - 250px);
	margin-left:210px;
	top:25%;
	font-size:2em;
	text-align:center;
	color:#CCCCCC;
	z-index: 1000;
}
.dayrange {
	float:right;
	font-size:.5em;
}
.selected {
	background-color: #BB0000 !important;
	color: #FFFFFF !important;
	border: 1px solid #BB0000 !important;
	box-shadow:3px 3px 3px rgba(0,0,0,.5);
	font-weight:700;
}
.monthname {
	width:100%;
	text-align:center;
	font-weight:700;
	border-bottom:1px solid #CCCCCC;
	margin-bottom:10px;
	text-transform: uppercase;
	font-size:2em;
	color:#999999;
}


.backbutton {
	position:fixed;
	height:50px;
	font-size:2.5em;
	line-height:1.5em;
	color:#AA0000;
	padding:10px 0px 0px 10px;
}

.meterimageholder {
	position:relative;width:33%;float:left;text-align:center;
}
.meterimagelabel {
	margin-top:5px;font-size:1.6em;font-weight:700;
}
.metercounter {
	position:absolute;width:90px;height:90px;top:0px;right:5px;line-height:90px;font-size:4em;font-weight:700;border-radius:45px;background-color:#006600;color:#FFFFFF;text-align:center;box-shadow:3px 3px 4px rgba(0,0,0,.7);
}
.meterdisabled {
	position:absolute;width:100%;height:100%;top:0px;left:0px;background-color:rgba(255,255,255,.8);
}

/* ADMIN PAGES */
#thinking {
	position:absolute;
	width:calc(100% - 250px);
	margin-left:210px;
	text-align:center;
	top:40%;
	z-index:100;
}
#thinking.off { display:none; }
#thinking.on { display:block; }

#adminloginpanel {
	position:absolute;
	top:-1000px;
	left:50%;
	margin-left:-200px;
	width:400px;
	height:400px;
	background:rgba(255,255,255,.5);
	border-radius:10px;
	box-shadow:3px 3px 3px rgba(0,0,0,.5);
	transition: top .5s;
	z-index:20;
}
#adminAddEditPanel {
	position:absolute;
	top:-1000px;
	left:50%;
	margin-left:-400px;
	width:800px;
	height:850px;
	background:rgba(255,255,255,.9);
	border-radius:10px;
	box-shadow:3px 3px 3px rgba(0,0,0,.5);
	transition: top .5s;
	z-index:900;
}
#adminCommunityPanel {
	position:absolute;
	top:-1000px;
	left:50%;
	margin-left:-400px;
	width:850px;
	height:750px;
	background:rgba(255,255,255,.4);
	border-radius:10px;
	box-shadow:3px 3px 3px rgba(0,0,0,.5);
	transition: top .5s;
	z-index:900;
}
#adminloginpanel.open {
	top:0px;
	transition: top .5s;
}
#adminAddEditPanel.open {
	top:0px;
	transition: top .25s;
}
#adminCommunityPanel.open {
	top:0px;
	transition: top .25s;
}
#adminCommunityPanelContent {
	position:relative;
	width:100%;
	margin:140px 15px 0px 15px;
	height:calc(100% - 200px);
	width:calc(100% - 30px);
}

#loginpanelcontent .inputwrapper {
	position:relative;
	width:calc(100% - 50px);
	margin-left:20px;
	height:58px;
}
#loginpanelcontent .inputwrapper input[type='password'],
#loginpanelcontent .inputwrapper input[type='text'] {
	position:relative;
	width:100%;
	font-size:1.3em;
	border:0px;
	border-bottom:1px solid #AAAAAA;
	color:#444444;
	background-color:transparent;
	-webkit-user-select: all;
	-khtml-user-select: all;
	-moz-user-select: all;
	-o-user-select: all;
	user-select: all;
	padding:3px;
	outline: 0;
}
#loginpanelcontent .inputwrapper input[type='text']:focus {
	border-bottom:1px solid #666666;

}
input::-webkit-contacts-auto-fill-button {
	opacity:.4;
}
#loginpanelcontent .inputwrapper label {
	position:absolute;
	bottom:2px;
	left:5px;
	color:#777777;
	font-weight:400;
	font-size:1em;
	width:100%;
}
#loginpanelcontent .inputwrapper input:focus + label {
	color:#444444;
	font-weight:700;
}

#loginpanelcontent {
	position:relative;
	width:100%;
	height:calc(100% - 60px);
}
#addEditPanelContent {
	position:relative;
	width:100%;
	margin:120px 10px 0px 10px;
	height:calc(100% - 175px);
}

#addEditPanelContent #editpanelform {
	width:calc(100% - 20px);
}
#addEditPanelContent #editpanelform .sectionheader {
	font-size:1em;
	color:#555555;
	font-weight:700;
	text-transform: uppercase;
	border-bottom:1px solid #999999;
	margin-bottom:5px;
}
#addEditPanelContent #editpanelform .inputwrapper {
	position:relative;
	height:35px;
	width:100%;
	margin-bottom:10px;
}

#addEditPanelContent #editpanelform input:not([type='checkbox']) {
	position:absolute;
	font-size:.9em;
	height:15px;
	width:100%;
	top:0px;
	background-color:transparent;
	border:0px;
	border-bottom:1px solid #DDDDDD;
	padding-bottom:0px;
	color:#444444;
}
#addEditPanelContent #editpanelform input:disabled {
  border-bottom:1px solid #EEEEEE;
}
#addEditPanelContent label {
	position: absolute;
	bottom:0px;
  	cursor:pointer;
	font-size:.9em;
	font-weight:400;
	color:rgba(100,100,110,1);
	/*text-transform: uppercase;*/
}

#addEditPanelContent .meterwrapper {
	position:realtive;margin-left:5px;width:20%;text-align:center;padding:5px;
}
#addEditPanelContent .meterheader {
	border-bottom:1px solid #CCCCCC;font-size:.7em;font-weight:700;color:rgba(100,100,110,1);
}
#addEditPanelContent .metercontent {
	text-align:center;
	font-size:1.5em;
	color:#444444;
	margin-left:25px;
}
.meter-viewdetails-bttn {
	position:relative;
	font-size:.4em;
	padding:5px 10px;
	background-color:#666666;
	border-radius:5px;
	color:#ffffff;
}

#edit-completed,
#edit-timeslotlabel {
	background-color:rgba(200,200,0,.1);margin-left:-10px;padding:10px 0px;width:100%;color:#444444;font-size:1.2em;text-align:center;
}
#editpanelsearch {
	outline:none;
	font-size:1.4em;
	color:#444444;
	padding:10px;
	position:relative;
	background:rgba(255,255,255,.5);
	border:1px solid rgba(255,255,255,.6);
	border-radius:10px;
	height:35px;
	width:700px;
}
#editpanelsearchbar {
	width:calc(100% - 20px);padding-top:20px;margin-left:-10px;padding-left:20px;padding-bottom:20px;background-color:rgba(0,0,10,.7);box-shadow:0px 3px 6px rgba(0,0,0,.5);position:relative;z-index:910;
}
#editpanelsearchresults {
	position:absolute;
	top:95px;
	left:0px;
	width:770px;
	height:0px;
	background:rgba(255,255,255,1);
	border-radius:0px 0px 10px 10px;
	box-shadow:3px 3px 3px rgba(0,0,0,.5);
	transition: top .5s;
	z-index:900;
	overflow:hidden;
	color:#444444;
	font-size:.7em;
}
#searchresultwrapper {
	width:100%;
	height:100%;
	overflow-y:scroll;
}

#editpanelsearchresults table {
	width:100%;
}
#editpanelsearchresults table tr:not(.head):not(.selected):not(.emptysearch):hover {
	background-color:rgba(0,0,0,.1) !important;
}
#editpanelsearchresults td {
	color:#444444;
	font-size:1.3em;
	padding:5px 5px;
}
#editpanelsearchresults td.hilite {
	background-color:rgba(200,200,0,.1);
	color:#555555;
}
#editpanelsearchresults td.hilite b { color:#000000; }

#editpanelsearchresults td.head {
	border-bottom:1px solid #cccccc;
}
#editpanelsearchresults td.name { width:45%; }
#editpanelsearchresults td.addr { width:45%; }
#editpanelsearchresults td.acct { width:10%; }

#editpanelsearchresults.open {
	height:120%;
	transition: top .5s;
	padding:5px;
}
#editpanelsearchresults tr.selected td b { color:#ffffff; }
#editpanelsearchresults tr.selected td {
	color:#FFFFFF;
	font-weight:400;
}

input::-webkit-textfield-decoration-container {
	opacity:1;
}
input::-webkit-credentials-auto-fill-button {
	opacity:.4;
}

.customer #content {
	margin-top:120px;
	padding:20px 20px 20px 20px;
	/*background-color:#FFFFFF;*/
	min-width:835px;
	height:100%;
	z-index:10;
}
.admin #content {
	margin-top:120px;
	padding:30px 20px 20px 20px;
	background-color:rgba(160,160,165,1);
	height:calc(100% - 160px);
	min-width:835px;
	z-index:10;
}

.admin #content.communityopen,
.admin #content.loginopen,
.customer #content.loginopen,
.admin #content.editopen  {
	filter: blur(5px);
	opacity:.7;
}

#adminlogin {
	position:absolute;
	top:10px;
	right:5px;
}
#loginbttn,
#logoutbttn {
	position:relative;
	float:right;
	padding:5px 20px;
	border-radius:10px;
	border: 1px solid rgba(180,180,180,1);
	background-color:rgba(0,0,0,1);
	color:#FFFFFF;
	margin:0px 10px;
	font-weight:700;
	cursor:pointer;
}
#adminmenu {
	position:absolute;
	bottom:5px;
	right:10px;
}
.adminbttn {
	position:relative;
	float:right;
	border-radius:5px;
	border: 1px solid rgba(180,180,180,.2);
	background-color:rgba(255,255,255,.2);
	font-size:1em;
	margin:0px 5px;
	cursor:pointer;
	color:#444444;
}
.adminbttn:not(.disabled) a:hover {
	color:#FFFFFF;
}
.adminbttn a {
	border-radius:5px;
	text-decoration:none;
	text-align:center;
	display:inline-block;
	width:calc(100% - 30px);
	min-width:65px;
    height:100%;
    padding:10px 15px;
    white-space: nowrap;
}

#loginbttn:hover,
.adminbttn:not(.disabled):hover {
	background: #222222;
	color:#FFFFFF;
}
.adminbttn.selected a {
	color:#FFFFFF;
}
.adminbttn.selected {
	background-color: #BB0000;
	color: #FFFFFF;
	border: 1px solid #BB0000;
	font-weight:700;
}
.admin-header-bttn {
	cursor:pointer;position:absolute;font-size:1em;margin-top:0px;right:15px;
}
.tabheader {
	position:absolute;top:0px;left:0px;border-radius:10px 10px 0px 0px;height:40px;line-height:40px;width:100%;background-color:#444444;color:#FFFFFF;
	box-shadow:0px 3px 3px rgba(0,0,0,.5);
	z-index:1000;
}

#loginnote {
	width:100%;text-align:center;font-size:1.7em;color:#777777;margin-top:10%;
}

.on { display:block; }
.off { display:none; }

.tabbody {
	position:relative;
	height:100%;
	z-index:999;
}
.column {
	position:relative;
	float:left;
}
#leftcol {
	margin-top:40px;
	width:240px;
	padding:0px 5px;
	height:calc(100% - 40px);
}
#rightcol {
	margin-top:40px;
	width: calc(100% - 250px);
	height:calc(100% - 40px);
	z-index:700;
	scroll-margin-top: 500px;
}
#rightcol .static {
	position:relative;
	height:135px;
	/*
	 zoom: 0.5;
    -moz-transform: scale(0.5);
    transform: scale(0.5);
    */
}
#rightcol .scrolling {
	position:relative;
	height:calc(100% - 165px);
	width:calc(100% - 15px);
	overflow-y:scroll;
	margin-top:105px;
}


#findApptContentWrapper {
	background-color:rgba(255,255,255,.2);
	border:1px solid rgba(0,0,0,.1);
	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;
}

.col {
	float:left;
}



#communitymenu {
	position:absolute;
	top:17px;
	left:30px;
	width:350px;
	z-index:1100;
	font-size:24px;
	color:#444444;
}
#communities {
	position:absolute;
	list-style:none;
	padding:0px;
	margin:-45px 0px 0px 0px;
	box-shadow:3px 3px 3px rgba(0,0,0,.3);
	height:0px;
	width:350px;
	overflow:hidden;
}
#communities.open {
	height:auto;
}
#communities li:before {
	display: inline-block;
	width:30px;	
	content:"";
}
#communities li {
	height:25px;
	line-height:25px;
	background-color:#EEEEEE;
	color:#444444;
	padding:5px;
	border-bottom:1px solid #CCCCCC;
}
#communities li:not(.divider):not(.selectedcity):hover {
	background-color:#000000;
	color:#ffffff;
}
#communities li.divider {
	height:1px;
	background-color:#444444;
	padding:0px;
	border:0px;
	margin-top:-1px;
}
#communities li.selectedcity:before {
	display: inline-block;
	width:30px;
	text-align:center;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Free";
	content: "\f00c";
}
#communities li.selectedcity {
	font-weight:700;
}

#bttn-exportsched,
#bttn-searchappts {
	position:relative;
	float:left;
	height:20px;
	line-height:20px;
	width:120px;
	text-align:center;
	margin-top:9px;
	margin-left:280px;
	font-size:11px;
	background-color:#222222;
	border:1px solid #999999;
	border-radius:5px;
	color:#DDDDDD;
	
}
#bttn-searchappts {
	width:130px;
	margin-left:10px;
}
#schedulegridhead {z-index:100;}
#schedulegrid { z-index:50; }

#schedulegridhead,
#schedulegrid {
	width:100%;
	font-size:.8em;
	color:#444444;
	table-layout:fixed;
	border-collapse: collapse;
}

#schedulegrid tr {
	background-color:transparent;
	
	-webkit-transition: background-color .5s linear;
	-moz-transition: background-color .5s linear;
	transition: background-color .5s linear;
}
#schedulegrid tr.glowing {
	background-color:#CC0000;
}

#schedulegrid tr.editing,
#schedulegrid tr.editing td {
	background-color:#444444;
	color:#FFFFFF;
	opacity:.3;
}
#schedulegrid tr.pending {
	opacity:.3;
	color:#000000;
}
#schedulegrid tr.pending td {
	background-color:#FFFFFF;
}
#schedulegrid tr.active,
#schedulegrid tr.active td {
	background-color:#444444;
	color:#ffffff;
}
#schedulegrid tr.complete,
#schedulegrid tr.complete td {
	background-color:#ffffff;
	opacity:1;
}

#schedulegrid tr.pasttime:not(.active),
#schedulegrid tr.pasttime:not(.complete) {
	opacity:.4 !important;
}

#schedulegrid tr#currenttimerow td {
	background-color:#777777;
	height:1px;
	padding: 1px 0px;
	text-align: center;
	color: #ffffff;
	border-top:10px solid #FFFFFF;
}
#schedulegrid tr#currenttimerow td span {
 	position:absolute;
 	right:60px;
 	width:30px;
 	text-align:center;
 	padding:0px 10px 0px 7px;
 	color:#555555;
 	background-color:#FFFFEE;
 	border:2px solid #777777;
 	margin-top:-15px;
 	border-radius:5px;
 	font-weight:700;
 }
#schedulegrid td {
	height:25px;
	line-height:25px;
	padding:2px 5px 2px 5px;
	color:#444444;
	white-space:nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
	vertical-align:top;
	border-right:1px solid #FFFFFF;
}
#schedulegrid td.hilited {
	background-color:#FFFFFF;
	color:#FFFFFF;
}

#schedulegrid td.time {
	font-size:.9em;
}
#filterslots {
	position:relative;
	float:right;
	height:30px;
	margin-top:10px;
	margin-right:10px;
	line-height:100%;
	z-index:800;
}
.filterslots-value {
	position:relative;
	height:10px;
	line-height:10px;
	min-width:10px;
	text-align:center;
	display:inline-block;
	border:1px solid #999999;
	color:#DDDDDD;
	background-color:#222222;
	padding:5px 5px;
	margin:0px 5px;
	font-size:12px;
	border-radius:5px;
}

#installeractivity {
	position:relative;
	z-index:800;
	text-align:left;
	font-size:.8em;
	color:#666666;
}
#schedulegrid .time { position:relative;width:50px; text-align:left;font-size:1.3em;}
#schedulegrid .name { width:200px; }
#schedulegrid .addr { width:200px; }
#schedulegrid .phone { width:100px; }
#schedulegrid .notes { /*width:300px;*/ }
#schedulegrid .alert { width:30px;font-size:1em; text-align:center;}

#schedulegridhead .time { width:60px; text-align:center;}
#schedulegridhead .name { width:210px;}
#schedulegridhead .addr { width:210px;}
#schedulegridhead .phone { width:100px;}
#schedulegridhead .notes { width:320px;text-align:center;}
#schedulegridhead .alert { width:30px;}

.weekholder {
	margin-left:0px;
}
.admindaybttn {
	position:relative;display:inline-block;float:left;margin:0px 7px;
}
#schedDef .admindaybttn {
	position:relative;
	display:inline-block;
	float:left;
	margin:0px 7px;	
	border-radius:5px;
}
#schedDef .admindaybttn.selectable {
	background-color:rgba(20,100,20,.5);
}
#schedDefEditPanel {
	position:absolute;
	width:0px;
	height:0px;
	left:50%;
	margin-left:-300px;
	top:50%;
	margin-top:-150px;
	background-color:#FFFFFF;
	z-index:1000;
	display:none;
	padding:20px;
}
#schedDefEdit-setall {
	position:relative;
	width:calc(100% - 0px);
	color:#444444;
	font-size:.8em;
	margin-left:0px;
	overflow-x:hidden;
	overflow-y:scroll;
	border-bottom:1px solid #444444;
}
#schedDefEdit-content {
	position:relative;
	width:calc(100% - 0px);
	height:calc(100% - 105px);
	/*outline:1px solid #EEEEEE;*/
	color:#444444;
	font-size:.8em;
	margin-left:0px;
	overflow-x:hidden;
	overflow-y:scroll;
	margin-bottom:20px;
}
#schedDefEdit-content div {
	/*outline:1px solid #CCCCCC;*/
}
#schedDefEditPanel.open {
	width:600px;
	height:330px;
	left:50%;
	margin-left:-320px;
	top:45%;
	border:2px solid #444444;
	border-radius:10px;
	box-shadow:4px 4px 4px rgba(0,0,0,.6);
	display:block;
}
#schedDefEdit-close {
	position:absolute;
	top:-12px;
	right:-12px;
	width:32px;
	height:32px;
	border-radius:16px;
	background-color:#FFFFFF;
	box-shadow:4px 4px 4px rgba(0,0,0,.6);
}

#schedDefEdit-dates-facebook:before {
  content: "\f09a";
  margin-right: 0.5em;
  font-family: "Font Awesome 5 Brands";
}

#schedDefEdit-dates-letter:before {
  content: "\f0e0";
  margin-right: 0.5em;
  font-family: "Font Awesome 5 Free";
}

#schedDefEdit-dates-portal:before {
  content: "\f3fa";
  margin-right: 0.5em;
  font-family: "Font Awesome 5 Free";
}

.schedDefEdit-slotsHolder {
	position:relative;
	height:auto;
	overflow:hidden;
}

.schedDefEdit-slotsHolder.closed {
	height:0px;
}




.daystatus {
	font-size:.5em;color:#666666;width:100%;height:5px;text-align:center;line-height:5px;margin-top:8px;
}

.installercountholder {
	font-size:.5em;
	position:absolute;
	right:2px;
	bottom:-2px;
	color:#BBBBBB;
}
#schedulegrid .odd {
	background-color:rgb(245,245,245);
}
#schedulegrid .even {
	background-color:rgb(235,235,235);
}

.admin-schedbttn {
	padding:0px 5px;
	margin:10px 0px 0px 4px;
	width:90%;
	height:25px;
	line-height:25px;
	color:#444444;
	border:1px solid #999999;
	border-radius:5px;
}
#schedDef .admin-schedbttn {
	padding:0px 5px;margin:10px 0px 0px 4px;width:90%;height:25px;line-height:25px;color:#444444;font-size:.7em;border:1px solid #999999;border-radius:5px;
} 

.admin-schedbttn.selected a {
	color:#FFFFFF;
}

.admin-schedday-bttn.full {
	background-color:rgba(51,102,0,.1);
	color:rgba(51,102,0,.8);
	border-color:rgba(51,102,0,.4);
}


#schedwrapper {
	white-space:nowrap;width:2000px;-ms-overflow-style:none;scrollbar-width:none;
}
::-webkit-scrollbar {
	display: none;
}

.admin-schedday-bttn {
	position:relative;
	width:30px;height:30px;
	text-align:center;line-height:30px;
	border-radius:5px;
	border:1px solid #CCCCCC;
	color:#444444;
	
}
.admin-schedday-bttn,
#schedDef .admin-schedday-bttn {
	position:relative;
	width:37px;
	height:37px;
	font-size:1.5em;
	text-align:center;
	line-height:37px;
	border-radius:5px;
	border:1px solid #CCCCCC;
	background-color:rgba(255,255,255,.4);
	color:#444444;
}
#schedDef .admin-schedday-bttn.holiday,
#schedDef .admin-schedday-bttn.weekend {
	background-color:rgba(255,255,255,1);
}
.schedbar {
	position: absolute;
	display: block;
	background-color: rgba(200,100,100,.4);
	border-radius: 2px 2px 2px 0px;
}
.schedbartab {
	position: absolute;
	display:inline-block;
	height: 15px;
	line-height: 15px;
	padding: 0px 10px 0px 10px;
	font-size: .2em;
	font-weight: 700;
	background-color: rgba(200,100,100,.4);
	color: #222222';
	border-radius: 0px 0px 5px 5px;
	white-space: nowrap; 
}
.schedbartab span { font-family:helvetica; }

#addDefHolder {
	position:relative;
}
#addDefHolder.closed {
	float:right;
	margin-right:15px;
}
#addDefHolder.open {
	float:left;
	width:100%;
	margin-left:15px;
}

#addDefForm {
	position:relative;
	display:inline-block;
	float:right;
	margin-left:10px;
	margin-top:2px;
	font-size:.7em;
	width:calc(100% - 160px);
}
#addDefHolder.closed #addDefForm { display:none; }
#addDefHolder.open #addDefForm { display:block; }
#addDefForm .bttn {
	font-size:.5em;
	padding:0px 10px;
	font-weight:700;
	line-height:20px;
	margin-top:8px;
	background-color:#000000;
	border:1px solid #999999;
	border-radius:5px;
}
#addDefForm input[type=text]{
	border:1px solid #FFFFFF;
	border-radius:5px;
}


#gototoday {
	position:absolute;
	right:5px;
	bottom:8px;
	z-index:900;
	padding:0px 10px;
	font-weight:700;
	line-height:20px;
	margin-top:8px;
	background-color:#222222;
	border:2px solid #FFFFFF;
	color:#FFFFFF;
	box-shadow:3px 3px 3px rgba(0,0,0,.3);
}
#schedDefEdit-delete {
	position:absolute;
	right:15px;
	top:25px;
	z-index:900;
	font-size:.5em;
	padding:0px 10px;
	font-weight:700;
	line-height:20px;
	margin-top:8px;
	background-color:#CCCCCC;
	border:2px solid #666666;
	color:#444444;
}







/* TABS */
#tabcontentholder {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}
#tabs {
  overflow: hidden;
  width: 100%;
  margin: 0;
  margin-left:20px;
  padding: 0;
  list-style: none;
  min-width:725px;
  width:calc(100% - 50px);
  padding-right:10px;
}
#tabs li {
  float: left;
  margin: 0px 20px 0px 0px;
}
#tabs a {
  position: relative;
  background: #FFFFFF;
  padding: 5px 15px 5px 25px;
  float: left;
  text-decoration: none;
  font-weight:700;
  color: #444;
  border-radius: 5px 0 0 0;
  box-shadow: 0 2px 2px rgba(0,0,0,.4);
}
#tabs .tab:NOT(.disabled) a:hover,
#tabs .tab:NOT(.disabled) a:hover::after {
  background: #222222;
  color:#FFFFFF;
}
#tabs a:after {
  content:'';
  position:absolute;
  z-index: 1;
  top: 0;
  right: -15px;
  bottom: 0;
  width: 25px;
  background: #FFFFFF;
  box-shadow: 4px 2px 4px rgba(0,0,0,.4);
  transform: skew(30deg);
  border-radius: 0 5px 0 0;
}
#tabs #current a,
#tabs #current a::after {
  background: #444444;
  color:#FFFFFF;
  font-weight:700;
  z-index: 3;
}
#tabscontent {
	height: calc(100% - 120px);
	background: #fff;
	padding: 45px 10px 10px 10px;
	height: calc(100% - 90px);
	min-width: 800px;
	position: relative;
	z-index: 2;
	border-radius: 10px;
	box-shadow: 1px 1px 5px 3px rgba(0, 0, 0, .5);
	overflow: hidden;
}
#tabs .tab.active a,
#tabs .tab.active a:after {
	background: #444444;
	color: #FFFFFF;
	font-weight: 700;
	z-index: 3;
}

/* Projects - Sidebar */
.sidebar-position {
	position:relative;
	font-size:13px;
	font-weight:700;
	margin-bottom:20px;
}
.sidebar-title {
	position:relative;
	font-size:12px;
	font-weight:700;
	border-bottom:1px solid #666666;
}
.sidebar-field-holder {
	position:relative;
	width:100%;
}
.sidebar-field-holder-50 {
	position:relative;
	float:left;
	width:50%;
}
.sidebar-field-content {
	position:relative;
	margin-top:5px;
	height:20px;
	border-bottom:1px solid #CCCCCC;
}
.sidebar-field-label {
	position:relative;
	font-size:10px;
	font-weight:400;
	color:#666666;
}
#sidebar-installer-add {
	position:relative;
	margin-top:20px;
	float:right;
	width:120px;
	height:30px;
	line-height:30px;
	border-radius:5px;
	font-size:12px;
	text-align:center;
	background-color:#444444;
	color:#FFFFFF;
}
#sidebar-installer-add:before {
	position:relative;
	display:inline-block;
	margin-right:10px;
	color:#FFFFFF;
	font-family: "Font Awesome 5 Free";
	font-size:12px;
	content: "\f234";
}

/* Projects - Calendar Page */
#overviewcalendar-holder {
	position:relative;
	float:left;
	height:calc(100% - 10px);
	width:100%;
}
			
/* Projects - Meters Page */
.metersection-header {
	position:relative;
	font-weight:700;
	font-size:14px;
	border-radius:5px;
	background-color:#444444;
	color:#FFFFFF;
	padding:7px 20px;
}
.metersection-header:after {
	position:absolute;
	right:10px;
	top:5px;
	color:#FFFFFF;
	font-family: "Font Awesome 5 Free";
	font-size:24px;
	content: "\f0d7";
}
.metersection-header.open {
	border-radius: 5px 5px 0px 0px;
}
.metersection-header.open:after {
	content: "\f0d8";
}
.metersection-content {
	height:0px;
	color:#444444;
	overflow:hidden;
}
.metersection-content.open {
	height:auto;
	padding:20px;
	border-radius: 0px 0px 5px 5px;
	border: 1px solid #444444;
}

#updateLocBttn {
	position:relative;float:right;border-radius:3px;background-color:#DDDDDD;color:#444444;font-size:.2em;padding:2px 5px;
}
#editNameBttn {
	position:relative;
	margin-left:5px;
	border-radius:3px;background-color:#DDDDDD;color:#444444;font-size:.2em;padding:2px 5px;display:inline-block;
}
#commedit-acctsdata {
	margin-bottom:50px;
}
#commedit-acctsdata tr {
	margin-bottom:10px;
}
#commedit-acctsdata td {
	vertical-align:top;
	font-size:.8em;
	color:#444444;
}
#commedit-acctsdata tr.spacer {
	height:10px;
}
/*
.tabcontentholder.hidden {
	display:none;
}
*/

/* BUILDER APP */
.build-num {
	width:50%;height:50px;line-height:45px;float:left;border-top:1px solid #666666;border-bottom:1px solid #666666;background-color:rgba(255,255,255,.2);
}
.build-num.focused {
	width:50%;height:50px;line-height:45px;float:left;border-top:1px solid #666666;border-bottom:4px solid #886666;background-color:rgba(200,250,0,.2);
}

/* INSTALLER APP */
.appoinment {
	position:relative;
	margin:5px;
	padding:10px;
	width:calc(100% - 30px);
	background-color:rgba(230,230,240,1);
	color:rgba(80,80,90,1);
	border:1px solid rgba(120,120,130,1);
	border-radius:10px;
	height:85px;
	overflow:hidden;
}
.appt-address {
	font-size:3em;
	font-weight:700;
}
.appt-name {
	font-size:2em;
	font-weight:400;
	margin-top:-10px;
}
.appt-acct {
	font-size:1em;
	font-weight:400;
	margin-top:15px;
}
.appt-time {
	font-size:3em;
	font-weight:700;
}
#appt-start-bttn {
	width:300px;
	padding:10px 0px;
	display:inline-block;
	background-color:#006600;
	color:#FFFFFF;
	border-radius:10px;
	text-align:center;
	font-size:3em;
}


.appt-map {
	position:relative;
	height:56px;
	line-height:56px;
	width:100px;
	text-align:center;
	display:inline-block;
	background-color:rgba(50,50,60,1);
	color:#FFFFFF;
	border-radius:10px;
	margin-right:25px;
}
.appt-phone {
	font-size:1em;
	line-height:54px;
	display:inline-block;
}
.appt-header,
.appt-body,
.appt-body-header,
.appt-body-notes,
.appt-body-meters,
.appt-body-footer {
	position:relative;
	width:100%;
}
.appt-body,
.appt-body-notes { margin-top:20px; }

.appt-notes-bttn {
	position: relative;
	display:inline-block;
	width:80px;
	height:80px;
	border:2px solid #FFFFFF;
	border-radius:42px;
	background-color:rgba(50,50,60,1);
	margin:0px 5px;
}
.appt-footer-bttn {
	position: relative;
	display:inline-block;
	width:80px;
	height:80px;
	border:3px solid #FFFFFF;
	border-radius:44px;
	background-color:#444444;
	margin:0px 10px;
}

.appt-notes-title {
	font-size:2em;
	font-weight:700;
	margin-top:5px;
}
.appt-notes-content {
	font-size:1.2em;
}

.appt-bttn,
.appt-meters-bttn  {
	position:relative;
	float:left;
	border:1px solid rgba(160,160,170,1);
	border-radius:10px;
	height:50px;
	line-height:50px;
}

.appt-meters-buttons {
	margin-left:10px;
}
.appt-meters-buttons {
	margin:15px 0px 10px 5px;
}
.appt-meters-bttn {
	width:20%;
	margin:0px 13px;
	padding-left:15px;
	display:inline-block;
	background-color:rgba(200,200,210,1);
}
.appt-meters-bttn-note {
	height:20px;
	width:20%;
	margin:5px 13px 0px 13px;
	padding-left:15px;
	display:inline-block;
	font-size:.8em;
	color:rgba(160,160,170,1);
	vertical-align:top;
}
.appt-meters-bttn>i,
.appt-meters-bttn>div {
	position:relative;
	display:inline-block;
	font-weight:700;
	height:50px;
	line-height:50px;
}
.appt-meters-bttn .appt-meters-bttn-label {
	top:-5px;
	margin-left:5px;
	font-size:1.2em;
}
.appt-meters-bttn .appt-meters-bttn-status {
	position:absolute;
	right:5px;
	bottom:3px;
	width:40px;
	height:40px;
	line-height:40px;
	border-radius:21px;
	border:1px solid rgba(160,160,170,1);
	color:#FFFFFF;
	background-color:rgba(160,160,170,1);
	text-align:center;
	font-size:1.3em;
	font-weight:700;
}
.appt-meters-bttn .appt-meters-bttn-status.complete {
	background-color: #006600;
	border:1px solid #006600;
}
.appt-meters-content {
	position:relative;
	width:calc(100% - 20px);
	height:200px;
	margin:10px 0px 20px 0px;
	padding:10px;
	border:1px solid rgba(160,160,170,1);
	border-radius:10px;
	background-color:rgba(220,220,230,1);
}

.appt-notes-bttn i {
	color:#FFFFFF;
	width:80px;
	text-align:center;
	line-height:80px;
}
.appt-footer-bttn i {
	color:#FFFFFF;
	width:80px;
	text-align:center;
	line-height:80px;
}
.appt-footer-bttn {
	margin:0px 20px;
}
.appt-footer-bttn-cancel		{ background-color:#660000; }
.appt-footer-bttn-reschedule	{ background-color:#222222; }
.appt-footer-bttn-photos		{ background-color:#222222; }
.appt-footer-bttn-done			{ background-color:#006600; }

.appt-footer-bttn-label {
	position:absolute;
	bottom:-25px;
	font-size:1em;
	color:#999999;
	width:80px;
	text-align:center;
}

@media (min-width: 800px) {

}


a[href^="tel:"] {
  color: #FFFFFF;
  text-decoration: none;
  font-weight:700;
  font-size:2em;
}
a[href^="tel:"]:before {
	font-family: "Font Awesome 5 Free";
  content: "\f87b";
  margin-right: 0.5em;
}