html, body{
	height: 100%;
	width: 100%;
	padding-bottom: 60px;
	position: fixed;
	overflow: hidden;
	overscroll-behavior-x: none;
	overscroll-behavior-y: none;
	-ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none; 
}
body > .pageWrapper{
	position: relative;
	width: 100vw;
	height: calc(100vh - 60px);
	overflow-x: hidden;
	overflow-y: scroll; 
}
#settingsMenu{
	position: absolute;
	right: -400px;
	transition: all 0.5s;
}
#footerMenu.show #settingsMenu{
	right: 0px;
}
#footerMenu.show #actions{
	display: none;
}
#extendedLoading{
	color: #aaaaaa;
	opacity: 0;
	transition: 0.5s;
}
a.backheader, a.backheader:hover, a.visited, a.active{
	color: #000000 !important;
	text-decoration: none;
}
#extendedLoading.true{
	opacity: 1;
	color: #555555;
	transition: opacity 0.5s color 1s;
}
.groupInfo{
	font-size: 12px;
	color: #999999;
	margin-bottom: -10px;
}
#incognito, .incognito {
	width: 18px;
	height: 18px;
	display: inline-block;	
	background-image: URL("../img/incognito.svg");
	background-size: contain;
	background-repeat: no-repeat;
}
#incognito{
	width: 24px;
	height: 24px;
	display: none;
}
.ts-wrapper{
	flex-grow: 1;
}
.ts-control{
	min-height: 40px;
	height: auto;
}
.ts-control input{
	font-size: 12pt;
}
.ts-control .item{
	font-size: 12pt;
}
.ts-dropdown{
	font-size: 12pt;
}
a.settings{
	padding: 0px 15px 12px 15px;
	display: none;
	color: #004480;
	text-decoration: none;
}
#mainMenu, #closeMainMenu{
	display: inline-block;
}
a.settings:last-child{
	padding: 0px 20px 12px 15px;
}
#newInvite{
	color: rgb(0, 153, 0);
}
#inviteList .invite{
	border: 1px SOLID navy;
	border-radius: 3px;
	display: inline-block;
	padding: 6px 15px 6px 15px;
	margin-right: 8px;
	cursor: pointer;
}
.declineInvite{
	background-color: #f5c6cb;
}
.acceptInvite{
	background-color: #c3e6cb;
}
#inviteList .invite svg{
	margin-right: 5px;
	margin-top: -3px;
}
#groupUserList li div:first-child, #groupInviteList li div:first-child{
	padding: 6px 0px 6px 12px;
	
}
#groupUserList li.currentUser div{
	display: none;
}
#groupUserList li div, #groupInviteList li div{
	float: right;
	display: block;
	padding: 6px 12px;
	cursor: pointer;
	color: #b97d7d;
}
#groupUserList li div.adminRights{
	color: #7db2b9;
}
#groupUserList li div.adminRights.has{
	color: #000000;
}
#statusMsg{
	position: absolute;
	top: 0px;
	width: 250px;
	left: 50%;
	text-align: center;
	margin-left: -125px;
	border: 1px SOLID #CCCCCC;
	border-radius: 0px 0px 10px 10px;
	z-index: 9999;
	transition: all 0.5s;
	max-height: 0px;
	padding: 0x;
	opacity: 0;	
	visibility: hidden;
	transition: all 0.5s;
	line-height: normal;
}
#statusMsg hr{
	margin: 4px 0px;
}
#statusMsg hr ~ span{
	font-size: 14px;
	color: #999999;
}
#statusMsg.success{
	background-color: #c3e6cb;
}
#statusMsg.danger{
	background-color: #f5c6cb;
}
#statusMsg.warning{
	background-color: #ffeeba;
}
#statusMsg.info{
	background-color: #cff4fc;
}

#statusMsg.show{
	opacity: 1;
	visibility: visible;
	padding: 2px 10px 2px 10px;
	max-height: 120px;
}
#menu{
	padding-top: 15px;
}
footer{
	height: 60px;
	display: none;
}
footer div.container-lg div:first-child{
	padding-left: 10px;
}
footer div:not(.container-lg){
	padding: 0px!important;
}
#splash, #login{
	padding-top: 45px;
	text-align: center;
}
.view{
	position: absolute;
	left: 0px;
	width: 100%;
	padding: 0px 10px;
	padding-bottom: 20px;
	display: none;
	transition: all 0.25s;
	height: fit-content;
}
.preView{
	
	left: -150%;
}
.postView{
	
	left: 150%;
}
.notransition {
	-o-transition: none !important;
	-ms-transition: none !important;
	-moz-transition: none !important;
	-webkit-transition: none !important;
	transition: none !important;
  }
#menu{
	display: none;
}
#splash{
	display: block;
}
#removeFinished{
	display: none;
	padding: 7px 0px;
}
#removeFinished svg{
	margin-top: -3px;
}
.inputButton > input{
	border-radius: 0.25rem 0px 0px 0.25rem;
}
.inputButton > button{
	border-radius: 0px 0.25rem 0.25rem 0px;
}
ul.last li:last-child, .bottomSpacer{
	margin-bottom: 60px;
}
li.pending{
	background-image: url("../img/tmp.png");
}
span.reaccuring::before{
	position: absolute;
	display: block;
	left: 1px;
	top: 0px;
	width: 10px;
	height: 10px;
	content: "";
	background-image: URL("../img/arrowDown.svg");
	background-repeat: no-repeat;
	background-size: 10px 10px;
}
span.reaccuring{
	position: relative;
	display: inline-block;
	font-size: 0.7rem;
	padding-right: 7px;
	padding-left: 7px;
	margin-left: 3px;
	margin-right: 3px;
	background-color:rgb(250, 239, 224);
	border: 1px SOLID #DDDDDD;
	border-radius: 0px 0px 3px 3px ;
	border-top: 2px SOLID #FF0000;
}
span.reaccuring::after{
	position: absolute;
	display: block;
	right: 1px;
	bottom: 0px;
	width: 10px;
	height: 10px;
	content: "";
	background-image: URL("../img/arrowUp.svg");
	background-repeat: no-repeat;
	background-size: 10px 10px;
}
.toggleBulk div.btn{
	margin: 0px;
	position: relative;
	flex: 1 1 auto;
}
.toggleBulk{
	display: inline-flex;
}
.toggleBulk div.btn:nth-of-type(1){
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}
.toggleBulk div.btn:last-child{
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}
.toggleBulk div.btn:not(:first-child){
	margin-left: -1px;
}
.toggleBulk div.btn{
	color: #fff;
	background-color: #545b62;
    border-color: #4e555b;
}
.toggleBulk.bulk #bulkTrue, .toggleBulk:not(.bulk) #bulkFalse{
	background-color: #17a2b8;
    border-color: #17a2b8;
}
.hide{
	display: none !important;
}
form.was-validated :invalid,form.was-validated .manualInvalid{
	border-color: #FF0000 !important;
}
#offlineBanner{
	display: none;
	color: #FFFFFF;
}
footer.offline #offlineBanner{
	display: block;
}
footer.offline div:not(.container-lg,.row, #offlineBanner){
	display: none;
}
footer.offline{
	background-color: #008aca !important;
}

.boxIn {
    border: 1px SOLID #ccc;
	height: fit-content;
	visibility: visible;
	opacity: 1;
	color: #212529;
	margin-bottom: 15px;
}
.boxIn > .row:first-child{
	padding: 8px 5px 0px 5px;
}
.boxIn label{
	padding-top: 3px;
}
.dependant{
	color: #495057;
	background-color: #e9ecef;
}
.boxIn:not(.checked) .dependant{
	visibility: hidden;
	opacity: 0;
	padding: 0px;
	max-height: 0px;
	transition: all 0.25s; 
}
.boxIn.checked .dependant{
	transition: all 0.25s;
	padding: 8px 5px 0px 5px;
	max-height: 300px;
}
/*
* 	Loader
*/

.loaderText{
	line-height: 5px;
	position: relative;
	top: 60px;
	display: block;
}
.loader {
	display: inline-block;
	border: 16px solid #f3f3f3; /* Light grey */
	border-top: 16px solid #2196F3; /* Blue */
	border-radius: 50%;
	width: 120px;
	height: 120px;
	animation: spin 2s linear infinite;
  }
  
  #reload{
	color: #e6e6e6;
	padding: 5px 0px;
  }
  @keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
  }

  /* 
  *   Toggle related
  */

 .switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
  }
  input:checked + .switch::before{
	content: "On";
  }
  
  .switch input { 
	opacity: 0;
	width: 0;
	height: 0;
  }
  
  .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  .slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  input:checked + .slider {
	background-color: #28a745;
  }
  
  input:focus + .slider {
	box-shadow: 0 0 1px #28a745;
	outline: inital;
  }

  input:checked + .slider.blue {
	background-color: #2196F3;
  }
  
  input:focus + .slider.blue {
	box-shadow: 0 0 1px #2196F3;
  }

  input:checked + .slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
	border-radius: 34px;
  }
  
  .slider.round:before {
	border-radius: 50%;
  }

  /* Range slider */
  .rangeSlider{
	position: relative;
	width: 100%;
	height: 30px;
	padding: 5px;
	padding-top: 55px;
  }
  .rangeSlider input[type=range]{
	position: absolute;
	width: calc(100% - 10px);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	outline: none;
	background-color: transparent;
	pointer-events: none;
	top: 35px;
	bottom: 0px;
}
.rangeSlider .sliderTrack{
	position: absolute;
	top: 35px;
	bottom: 0px;
	width: calc(100% - 10px);
	margin: auto;
	height: 5px;
	border-radius: 5px;
}
.rangeSlider input[type=range]::-webkit-slider-runnable-track, .rangeSlider input[type=range]::-moz-range-track, .rangeSlider input[type=range]::-ms-track{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	height: 5px;
}
.rangeSlider input[type=range]::-webkit-slider-thumb{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	height: 15px;
	width: 15px;
	background-color: #3264Fe;
	cursor: pointer;
	border-radius: 15px;
	pointer-events: auto;

}
.rangeSlider input[type=range]::-moz-range-thumb, .rangeSlider input[type=range]::-ms-thumb{
	-moz-appearance: none;
	appearance: none;
	height: 15px;
	width: 15px;
	background-color: #3264Fe;
	cursor: pointer;
	border-radius: 15px;
	pointer-events: auto;
}
.rangeSlider input[type=range]:active::-webkit-slider-thumb{
	background-color: #FFF;
	border: 3px SOLID #3264Fe;
}
.rangeSlider .values{
	background-color: #3264fe;
	position: relative;
	top: -55px;
	margin: auto;
	width: fit-content;
	padding: 3px 10px;
	border-radius: 5px;
	color: #FFFFFF;
}
.rangeSlider .values::before{
	content: "";
	position: absolute;
	height: 0px;
	width: 0px;
	border-top: 15px solid #3264Fe;
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	margin: auto;
	bottom: -10px;
	left: 0px;
	right: 0px;
}

[data-swipeDelete] li{
	overflow: scroll;
	overscroll-behavior-x: none;
	-ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;
}
[data-swipeDelete] li::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}
#copyRight{
	margin-top: 30px;
	font-size: 12px;
	color: #CCCCCC;
	display: block;
}
#infoPage span.code{
	font-family: "Courier New";
	background-color: #EEEEEE;
}
li .deleteListItem{
	position: absolute;
	right: 0px;
	top: 0px;
	display: block;	
	text-align: center;
	padding: 20px 0px;
	color: #FFFFFF;
	width: 100px;
	margin-right: -101px;
	height: 100%;
	background-color: #FF0000;
	cursor: pointer;
}