body{
	margin: 0px;
	background-color: rgba(240,240,240,1);
	overflow: hidden;
	font-family: 'Nunito', sans-serif;
}

html,
body {
	height: 100%;
}

h1,h2,h3,h4,h5,h6 {
    line-height: 1.2;
    color: #313131;
    padding: 0px;
    margin: 0px;
    font-family: 'Nunito', sans-serif;
}

span, p {font-family: 'Nunito', sans-serif;}

footer{
	display: table;
	background-color: white;
	width: calc(100% - 40px);
	padding: 9px 20px;
	color: rgba(0,0,0,0.6);
	font-size: 10px;
	font-weight: 700;
	background-color: white;
	font-style: italic;
	-webkit-box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
    box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
    border-top: 2px solid rgba(0,0,0,0.06);
    z-index: 0;
}
strong{font-weight: 800; opacity: 0.9;}
fieldset {
	border-radius: 5px;
	border: none;
	background-color: white;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
}

legend {
	font-size: 14px; 
	color: #757575;
	padding: 5px 10px;
	font-weight: 600;
}

legend span{
	background-color: white;
	margin: 0px 10px;
	cursor: pointer;
}

.popupMessage {position: fixed; bottom: 50px; left: 0px; width: 100%; display: none;}
.popupMessage.correct span{background-color: #b3ffbb; color: #0a4510;}
.popupMessage.error span{background-color: #f29999; color: #630303;}
.popupMessage.warning span{background-color: #ffdaa3; color: #915609;}
.popupMessage span{
	z-index: 999;
	font-size: 12px;
	font-weight: 700;
	font-family: 'Nunito', sans-serif;
	padding: 20px 40px;
	margin: 0px auto;
	display: table;
	max-width: 600px;
	border: 2px solid rgba(0,0,0,0.06);
	-webkit-box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
	box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
}

.popupConfirm {
	height: 100vh;
	width: 100%;
	position: fixed;
	display: flex;
	align-items: center;
	background-color: rgba(0,0,0,0.4);
	z-index: 9;
	backdrop-filter: blur(3px);	
}

.popupConfirm div{
	max-width: 800px;
	min-width: 300px;
	background-color: white;
	border-radius: 3px;
	padding: 25px 30px;
	margin: 0px auto;
	text-align: center;
	z-index: 10; 
}

.popupConfirm div span{
	font-size: 15px;
	font-weight: 800;
	color: rgba(0,0,0,0.7);
}

.popupConfirm div div{
	margin: 10px auto 0px auto;
	padding: 0px;
}

.popupConfirm .button{
	margin: 0px 2px;
}

.tab {padding: 15px 20px 20px 20px; max-width: 1400px; display: table; width: calc(100% - 40px);}
.tab.table {padding: 30px; max-width: 1400px; display: block !important; overflow-x: auto; width: calc(100% - 60px);}

.w10{width:10%;}
.w15{width:15%;}
.w20{width:20%;}
.w30{width:30%;}
.w33{width:33.33%;}
.w40{width:40%;}
.w50{width:50%;}
.w60{width:60%;}
.w70{width:70%;}
.w80{width:80%;}
.w90{width:90%;}
.w100{width:100%;}
.wAuto{width: auto !important;}

.h100{min-height:100px !important;}
.h200{min-height:200px !important;}
.h300{min-height:300px !important;}
.h400{min-height:400px !important;}
.h500{min-height:500px !important;}
.h600{min-height:600px !important;}
.h700{min-height:700px !important;}
.h800{min-height:800px !important;}
.h900{min-height:900px !important;}
.h1000{min-height:1000px !important;}

.h150{min-height:150px !important;}
.h250{min-height:250px !important;}
.h350{min-height:350px !important;}
.h450{min-height:450px !important;}
.h550{min-height:550px !important;}
.h650{min-height:650px !important;}
.h750{min-height:750px !important;}
.h850{min-height:850px !important;}
.h950{min-height:950px !important;}
.h1050{min-height:1050px !important;}

.table{display: table !important;}
.block{display: block !important;}
.flex{display: flex !important;}
.hidden{display: none !important;}

.itemsCenter {align-items: center;}
.verticalAlignMiddle {vertical-align: middle !important;}

.floatLeft{float: left !important;}
.floatRight{float: right !important;}

.textRight{text-align: right !important;}
.textLeft{text-align: left !important;}
.textCenter{text-align: center !important;}
.textJustify{text-align: justify !important;}

.noWrap {white-space: nowrap;}
.noSort {background-image: none !important;}

.marginAuto{margin-left: auto !important; margin-right: auto !important; }
.margin0{margin:0px !important;}

.paddingLeft5px{padding-left: 5px;}
.paddingLeft10px{padding-left: 10px;}
.paddingLeft15px{padding-left: 15px;}
.paddingLeft20px{padding-left: 20px;}

.paddingBottom5px{padding-bottom: 5px;}
.paddingBottom10px{padding-bottom: 10px;}
.paddingBottom15px{padding-bottom: 15px;}
.paddingBottom20px{padding-bottom: 20px;}

.cursorPointer {cursor: pointer !important;}

.opacity05{opacity: 0.05;}
.opacity10{opacity: 0.1;}
.opacity15{opacity: 0.15;}
.opacity20{opacity: 0.20;}
.opacity25{opacity: 0.25;}
.opacity30{opacity: 0.30;}
.opacity35{opacity: 0.35;}
.opacity40{opacity: 0.40;}
.opacity45{opacity: 0.45;}
.opacity50{opacity: 0.50;}
.opacity55{opacity: 0.55;}
.opacity60{opacity: 0.60;}
.opacity65{opacity: 0.65;}
.opacity70{opacity: 0.70;}
.opacity75{opacity: 0.75;}
.opacity80{opacity: 0.80;}
.opacity85{opacity: 0.85;}
.opacity90{opacity: 0.90;}
.opacity95{opacity: 0.95;}

.button {
	margin-top: 5px;
	cursor: pointer;
	font-family: 'Nunito', sans-serif;
	font-size: 13px;
    padding: 8px 20px;
    display: inline-block;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
    border-radius: 5px;
    outline: none;
    border: 1px solid gray;
    color: rgba(0,0,0,0.7);
    text-decoration: none;
}

.button.icon {
	padding: 8px 20px 8px 15px;
}

.button.icon:after{
	content: "";
	background-position: center center;
    background-repeat: no-repeat;
	display: table;
    width: 15px;  height: 15px;
    float: left;
    margin-right: 5px;
}

.button.blue.icon:after, .button.red.icon:after, .button.green.icon:after{filter: invert(1);}

.button.disabled {filter: grayscale(0.6) brightness(1.4); opacity: 0.8;}
.button.gray.disabled {filter: grayscale(0.6) brightness(1); opacity: 0.6;}
.button.disabled:hover {cursor: not-allowed;}

.button.blue, .button.blue.disabled:hover{
	background-color: #4466f2;
    border-color: #4466f2;
    color: #fff;
}
.button.blue:hover {background-color: #143fef; border-color: #143fef;}

.button.red, .button.red.disabled:hover{
	background-color: #e64444;
    border-color: #e64444;
    color: #fff;
}
.button.red:hover {background-color: #d23030; border-color: #d23030;}

.button.green, .button.green.disabled:hover{
	background-color: #2ca92f;
    border-color: #2ca92f;
    color: #fff;
}
.button.green:hover {background-color: #309e32; border-color: #309e32;}

.button.gray, .button.gray.disabled:hover{
	background-color: #e4e4e4;
    border-color: #e4e4e4;
    color: black;
}
.button.gray:hover {background-color: #d8d8d8; border-color: #d8d8d8;}





.button.icon.delete:after{
	background-image: url('../../data/icons/trash.png');
	background-size: 70%;
}
.button.icon.cross:after{
	background-image: url('../../data/icons/cross.png');
	background-size: 65%;
	margin-top: 1px;
}
.button.icon.check:after{
	background-image: url('../../data/icons/check.png');
	background-size: 70%;
	margin-top: 1px;
}
.button.icon.plus:after{
	background-image: url('../../data/icons/plus.png');
	background-size: 70%;
	margin-top: 1px;
}
.button.icon.save:after{
	background-image: url('../../data/icons/save.png');
	background-size: 70%;
	margin-top: 1px;
}
.button.icon.back:after{
	background-image: url('../../data/icons/back.png');
	background-size: 70%;
	margin-top: 1px;
}
.button.icon.play:after{
	background-image: url('../../data/icons/play.png');
	background-size: 60%;
	margin-top: 1px;
}
.button.icon.pause:after{
	background-image: url('../../data/icons/pause.png');
	background-size: 60%;
	margin-top: 1px;
}
.button.icon.download:after{
	background-image: url('../../data/icons/download.png');
	background-size: 80%;
	margin-top: 0px;
}

.simpleButton{
	font-weight: 700; 
	text-decoration: none; 
	padding: 1px 0px !important;
	font-size: 12px;
	color: blue;
	margin: 1px 0px 2px 0px;
	line-height: 1;
	display: table;
	cursor: pointer;
}

.simpleButton:hover{
	border-style: solid;
	border-width: 0px 0px 2px 0px;
	margin-bottom: -2px !important;
}

.simpleButton.disabled {cursor: not-allowed; color: gray !important; opacity: 0.7;}





.input{
	font-family: 'Nunito', sans-serif;
	outline: none;
	display: block;
    width: calc(100% - 32px);
    padding: 6px 15px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: .25rem;
    -webkit-transition: border-color 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
	resize: vertical;
}
.input.required{
	border: 1px solid #e32f1b;
	-webkit-box-shadow:inset 0px 0px 0px 1px #e32f1b;
    -moz-box-shadow:inset 0px 0px 0px 1px #e32f1b;
    box-shadow:inset 0px 0px 0px 1px #e32f1b;
}
label{width: 100%;display: table; padding: 0px 0px 3px 0px; margin: 0px; font-size: 14px;font-weight: 600;color: #757575;}
textarea{min-height: 86px;}
select{width: 100% !important;}
input[type="date"],input[type="datetime-local"],input[type="time"]{padding: 5px 15px; resize: none !important;}


input[colorPicker]
{
	color: transparent;
	display: table;
    float: left;
    margin-right: 5px;
    background-color: #a9a9a9;
    background-image: url(images/arrow-fill.png);
	background-position: right center;
    background-repeat: no-repeat;
    background-size: contain;
 	cursor: pointer;
 	font-size: 0px;
 	height: 21px;
}

.input::-webkit-input-placeholder {color: rgba(0,0,0,0.3); font-weight: 600;}
.input:-ms-input-placeholder {color: rgba(0,0,0,0.3); font-weight: 600;}
.input::placeholder {color: rgba(0,0,0,0.3); font-weight: 600;}

/* Bubliny s textovou nápovědou */
[data-tooltip] {position: relative; top:-2px;z-index: 2;cursor: pointer; padding:1px 6px;font-size: 11px;background-color: rgb(200,200,200);border-radius: 100%;border:none;display: inline-block;font-weight: 800;color: white;margin: 0px 0px 0px 3px;}
[data-tooltip]:before, [data-tooltip]:after {visibility: hidden;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);opacity: 0;pointer-events: none;}
#addable [data-tooltip]:before{position: absolute;bottom: 110%;left:50%;width: 150px;}
#addable [data-tooltip]:after {bottom: 110%;left: 50%;} [data-tooltip]:before {position: absolute;bottom: 150%;left: 50%;margin-bottom: 5px;margin-left: -80px;padding: 7px;width: 300px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;background-color: #000;background-color: hsla(0, 0%, 20%, 0.9);color: #fff;content: attr(data-tooltip);text-align: center;font-size: 13px;font-weight: normal;line-height: 1.2;}
[data-tooltip]:after {position: absolute;bottom: 150%;left: 50%;margin-left: -5px;width: 0;border-top: 5px solid #000;border-top: 5px solid hsla(0, 0%, 20%, 0.9);border-right: 5px solid transparent;border-left: 5px solid transparent;content: " ";font-size: 0;line-height: 0;}
[data-tooltip]:hover:before, [data-tooltip]:hover:after {visibility: visible;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);opacity: 1;}


/*Bublina s chybovou hláškou*/
.message{
	border-radius: 4px;
	border: 2px solid rgba(0,0,0,0.06);
	-webkit-box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
	box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
	position: absolute;
	bottom: 20px;
	right: 20px;
	z-index: 999;
	font-size: 12px;
	font-weight: 700;
	font-family: 'Nunito', sans-serif;
	text-align: left;
	background-color: white;
	max-width: 300px;
}
.message small{opacity: 0.7; display: table;}

.message.correct{background-color: #b3ffbb; color: #0a4510;}
.message.correct small{display: none;}
.message.error{background-color: #f29999; color: #630303;}
.message.warning{background-color: #ffdaa3; color: #915609;}

.message div{
	position: relative;
	width: calc(100% - 70px);
	height: 100%;
	display: block;
	padding: 20px 40px 20px 30px; 
}

.message div img{
	position: absolute;
	top: 10px;
	right: 10px;
	width: 10px;
	cursor: pointer;
	opacity: 0.6;
}
	



.colorRed{color: red;}
.colorGreen{color: #307010;}
.colorBlue{color: blue;}

.strong{font-weight: bold;}
.text{font-size: 12px; font-weight: 700; color: rgba(0,0,0,0.6);}

label.error {visibility: hidden; display: none !important;}



.tag{
	border-radius: 5px;
	width: auto;
	padding: 4px 12px 3px 12px;
	background-color: #9e9e9e;
	font-size: 11px;
	display: table;
	float: left;
	min-height: 9px;
	min-width: 20px;
	margin: 1px 2px;
	font-weight: 700 !important;
	letter-spacing: 0.2px;
	color: white;
	white-space: nowrap;
}

.tag.green{background-color: #4cb050;}
.colorTag{
	float: left;
	height: 100%;
	width: 12px;
	border-radius: 3px;
	background-color: gray;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
}


/* Popup container */
.temporaryPopup {
  position: relative;
  cursor: pointer;
  top: -10px;
  display: none;
}

/* The actual popup (appears on top) */
.temporaryPopup span {
  width: 110px !important;
  background-color: #555;
  color: #fff !important;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -55px;
  font-size: 11px;

}

/* Popup arrow */
.temporaryPopup span::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.tooltip 
{
position: absolute;
bottom: 0px;
display: none;
z-index: 999;
box-shadow:0px 0px 10px rgba(0,0,0,0.1);
}

.tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: white transparent transparent transparent;
}

.tooltip.dark{
	background-color: rgb(50,50,50);
	border-radius: 4px;
}

.tooltip.dark::after{
	  border-color: rgb(50,50,50) transparent transparent transparent;	
}

.sidebar .tooltip .fullProjectName{
	margin: 10px 15px !important;
	width: 200px;
	text-align: center;
	display: table;
	white-space: pre-wrap;
	font-size: 12px !important;
}

.tooltip div {
background-color: white;
border-radius: 5px;
padding: 15px 20px;
display: table;
}

.tooltip div span {
font-size: 12px;
white-space: nowrap;
display: flex;
align-items: center;
color: rgba(0,0,0,0.5);
font-weight: 600;
}

.tooltip div span:nth-child(odd){font-weight: 700; color:#575757; margin-top: 7px;}

.tooltip div span:nth-child(odd):before {
	content: "";
	display: table;
	width: 8px;
	height: 15px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	float: left;
	margin-right: 5px;
}


.tooltip div .address:nth-child(odd):before {background-image: url("/data/icons/home.png");}
.tooltip div .phone:nth-child(odd):before {background-image: url("/data/icons/phone.png");}
.tooltip div .email:nth-child(odd):before {background-image: url("/data/icons/e-mail.png");}
.tooltip div .user:nth-child(odd):before {background-image: url("/data/icons/user.png");}




.sidebar{
	width: 255px;
	float: left;
	display: block;
	box-shadow: 0 0 11px rgb(69 110 243 / 13%);
	background-color: #394959;
	height: calc(100vh - 40px);
	overflow-y: auto;
	overflow-x: hidden;
	padding: 20px 0px;
}

.sidebar .logo{
	margin: 0px auto;
	display: table;
	margin: 10px 20px 20px 20px;
	text-align: center;
}

.sidebar .logo img{
	width: 70%;
	filter: invert(100%);
}

.sidebar .userInfo
{
	background-color: rgba(0,0,0,0.1);
	color: rgba(255,255,255,0.85);
	text-align: center;
	padding: 20px;
	margin-bottom: 15px;
}

.sidebar .userInfo img
{
	border-radius: 100px;
	width: 60px;
	height: 60px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	margin-bottom: 5px;
}

.sidebar .userInfo .name, .sidebar .userInfo .role{
	color: rgba(255,255,255,0.85);
	padding-top: 5px;
}

.sidebar .userInfo .name{
	font-weight: 800;
}


.sidebar header a{
	font-size: 14px;
    font-weight: 600;
    color: rgba(255,255,255,0.85);
    font-family: Nunito;
    text-decoration: none;
    display: flex;
    align-items: center;
    width: calc(100% - 40px);
    padding: 8px 20px; 
    position: relative;
    cursor: pointer;
}

.sidebar header a span::-moz-selection, .sidebar header a img::-moz-selection { /* Code for Firefox */
  background: transparent !important;
}

.sidebar header a span::selection, .sidebar header a img::selection {
  background: transparent !important;
}


.sidebar header span{
	display: block;
	height: 100%;
	float: left;
}

.sidebar header a img{
	width: 14px;
	float: left;
	margin-right: 14px;
	filter: invert(90%);
}

.sidebar header a .arrow{
	width: 10px;
	filter: invert(90%);
	position: absolute;
	right: 0px !important;
	transition: 0.1s all;
}

.sidebar header a:hover, .sidebar a.active{
	color: white;
    background-color: rgba(255,255,255,0.05);
}

.sidebar header a:hover img, .sidebar a.active img{
	filter: invert(100%);
}

.sidebar header .dropdown-container{
	display: none;
	background-color: rgba(0,0,0,0.1);
}

.sidebar header .dropdown-container a {
	color: rgba(255,255,255,0.7);
	padding-left: 40px;
	width: calc(100% - 60px)!important;
}

.sidebar header .dropdown-container a div{
	width: 5px;
	height: 5px;
	display: table;
	background-color: rgba(255,255,255,0.7);
	border-radius: 10px;
	float: left;
	margin-right: 15px;
}

.sidebar header .dropdown-container a:hover {
	color: rgba(255,255,255,1);
}

.sidebar header .dropdown-container a:hover div{
	background-color: rgba(255,255,255,1);
}


.sidebar header a.active .arrow{
	transform: rotate(90deg);
}

.sidebar::-webkit-scrollbar-track
{
	background-color: rgba(0,0,0,0.1);
}

.sidebar::-webkit-scrollbar
{
	width: 6px;
	background-color:rgba(0,0,0,0.1);
}

.sidebar::-webkit-scrollbar-thumb
{
	border-radius: 20px;
	background-color: #5b6b7c;
	border: none;
	opacity: 0.9;
}

::-webkit-scrollbar
{
	width: 12px;
	height: 12px;
	background-color: white;
}

::-webkit-scrollbar-thumb
{
	border-radius: 20px;
	background-color: rgba(0,0,0,0.3);
	opacity: 0.9;
	border:1px solid white;
}

.sidebar .projects{
	margin-top: 20px;
}

.sidebar .projects span{
	font-size: 14px;
	font-weight: 700;
	opacity: 0.3;
	color: white;
	padding: 0px 20px 5px 20px;
}


.sidebar .projects a span{
	color: white;
	display: inline-block;
	padding: 0px;
	margin: 0px;
	float: left;
	opacity: 0.85;
	font-weight: 600;
	width: 200px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.sidebar .projects a div:nth-child(1){
	height: 20px;
	width: 7px;
	border-radius: 2px;
	background-color: gray;
	display: table;
	float: left;
	margin-right: 10px;
}

.sidebar .projects a div:nth-child(3){
	height: 8px;
	width: 8px;
	border-radius: 50%;
	background-color: gray;
	display: table;
	margin-left: 10px;
}


.sidebar .projects a div.active:nth-child(3){
	background-color: #10c115;
}




















.contentHeader{
	width: 100%;
	height: 40px;
	background-color: #394959;
	-webkit-box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
    box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
    border-bottom: 2px solid rgba(0,0,0,0.06);
    z-index: 2;
}

.menuIcon{
	width: 20px;
	position: fixed;
	left: 0px;
	top: 10px;
	opacity: 1;
	cursor: pointer;
	display: none;
	filter: invert(1);
	transition: 0.2s all;
	z-index: 999;
	box-shadow: 0 0 11px rgb(69 110 243 / 13%);
	background-color: #cbbeb2;
 	padding: 10px 18px 10px 10px;
 	border-top-right-radius: 50px;
 	border-bottom-right-radius: 50px;
}

.menuIcon:hover{
	opacity: 1;
}

.main{
	overflow-y: auto;
	overflow-x: hidden;
	width: calc(100% - 255px);
	float: right;
	height: 100vh;
}


.main .content {
	width: calc(100% - 0px);
	min-height: calc(100vh - 35px);
	color: #313131;
}

.main .content .note{
	font-size: 12px;
	color: rgba(0,0,0,0.4);
	font-style: italic;
	padding: 0;
	margin: 5px 0px 5px 0px;
	font-weight: 500;
	width: 100%;
	display: table;
}

.main .content .headline{
	width: calc(100% - 60px);
	padding: 30px 30px 20px 30px;
	background-color: white;
	display: table;
}

.main .content .headline h1{
	margin-right: 20px;
	font-size: 23px;
	font-weight: 700;
}
.main .content .headline span{
	font-size: 12px;
	font-weight: 700;
	color: rgba(0,0,0,0.6);
	padding-top: 5px;
}
.main .content .headline span img{
	width: 10px;
	opacity: 0.6;
}
.main .content .headline .note{
	color: rgba(0,0,0,0.7);
}

.main .content .tabButtons{
	width: 100%;
	display: table;
	padding: 0px 30px 0px 30px;
	background-color: white;
}

.main .content .tabButtons span{
	padding: 10px 20px;
	margin-right: 5px; 
	float: left;
	display: table;
	cursor: pointer;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-width: 1px 1px 0px 1px;
	border-style: solid;
	border-color: rgba(0,0,0,0.1);
	color: rgba(0,0,0,0.6);
	font-size: 12px;
	font-weight: 700;
}

.main .content .tabButtons span:hover{
	color: rgba(0,0,0,0.8);

}

.main .content .tabButtons span.active{
	background-color: rgba(240,240,240,1);
	cursor: default;
	border-color:rgba(240,240,240,1);
	color: rgba(0,0,0,0.8) !important;
}

.wrap {
	margin: 10px;
	background-color: white;
	border: 0px;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    border-radius: 4px;
    border: 2px solid rgba(0,0,0,0.06);
    -webkit-box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
    box-shadow: 1px 5px 15px 0 rgba(0,0,0,0.01);
    min-height: 100px;
}

.wrap .header
{
	width: calc(100% - 60px);
	background-color: #fff;
    border-bottom: none;
    padding: 20px 30px 15px 30px;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.wrap .header h4{
	color: rgba(0,0,0,0.7);
	font-size: 17px;
	padding: 0;
	margin: 0;
}

.wrap .header p{
	color: rgba(0,0,0,0.4);
	font-size: 12px;
	font-weight: 600;
	padding: 0;
	margin: 0;
	font-style: italic;
	margin-top: 5px;
}

.wrap.w10{width:calc(10% - 24px);}
.wrap.w15{width:calc(15% - 24px);}
.wrap.w20{width:calc(20% - 24px);}
.wrap.w30{width:calc(30% - 24px);}
.wrap.w33{width:calc(33.33% - 24px);}
.wrap.w40{width:calc(40% - 24px);}
.wrap.w50{width:calc(50% - 24px);}
.wrap.w60{width:calc(60% - 24px);}
.wrap.w70{width:calc(70% - 24px);}
.wrap.w80{width:calc(80% - 24px);}
.wrap.w90{width:calc(90% - 24px);}
.wrap.w100{width: calc(100% - 24px);}

.wrap .wrapContent{
	width: calc(100% - 60px);
	padding: 10px 20px 30px 30px;
	display: table;
}

.wrap .wrapContent .inputWrap {margin: 0px 10px 0px 0px; padding: 5px 0px; display: block;}
.wrap .wrapContent .inputWrap.w10{width:calc(10% - 10px);}
.wrap .wrapContent .inputWrap.w15{width:calc(15% - 10px);}
.wrap .wrapContent .inputWrap.w20{width:calc(20% - 10px);}
.wrap .wrapContent .inputWrap.w30{width:calc(30% - 10px);}
.wrap .wrapContent .inputWrap.w33{width:calc(33% - 10px);}
.wrap .wrapContent .inputWrap.w35{width:calc(35% - 10px);}
.wrap .wrapContent .inputWrap.w40{width:calc(40% - 10px);}
.wrap .wrapContent .inputWrap.w50{width:calc(50% - 10px);}
.wrap .wrapContent .inputWrap.w60{width:calc(60% - 10px);}
.wrap .wrapContent .inputWrap.w70{width:calc(70% - 10px);}
.wrap .wrapContent .inputWrap.w80{width:calc(80% - 10px);}
.wrap .wrapContent .inputWrap.w90{width:calc(90% - 10px);}
.wrap .wrapContent .inputWrap.w100{width:calc(100% - 10px);}

.editContact .content .inputWrap {margin: 0px 10px 0px 0px; padding: 5px 0px; display: block;}
.editContact .content .inputWrap.w10{width:calc(10% - 10px);}
.editContact .content .inputWrap.w20{width:calc(20% - 10px);}
.editContact .content .inputWrap.w30{width:calc(30% - 10px);}
.editContact .content .inputWrap.w33{width:calc(33% - 10px);}
.editContact .content .inputWrap.w35{width:calc(35% - 10px);}
.editContact .content .inputWrap.w40{width:calc(40% - 10px);}
.editContact .content .inputWrap.w50{width:calc(50% - 10px);}
.editContact .content .inputWrap.w60{width:calc(60% - 10px);}
.editContact .content .inputWrap.w70{width:calc(70% - 10px);}
.editContact .content .inputWrap.w80{width:calc(80% - 10px);}
.editContact .content .inputWrap.w90{width:calc(90% - 10px);}
.editContact .content .inputWrap.w100{width:calc(100% - 10px);}

.wrap .wrapContent fieldset {
	border-radius: 5px;
	border: 1px solid rgba(0,0,0,0.2);
	margin: 5px 10px 5px 0px;
	background-color: transparent;
	box-shadow: none;
}

.wrap .wrapContent legend {
	font-size: 14px; 
	color: #757575;
	padding: 5px 10px;
	font-weight: 600;
}

.wrap .wrapContent .fieldset {width: 100%; padding: 0; margin: 0;}
.wrap .wrapContent .fieldset .inputWrap {padding: 1px 0px;}
.wrap .wrapContent .fieldset .input {margin-bottom: 3px;}
.wrap .wrapContent .fieldset .inputGroup{width: calc(100% - 10px);}
.wrap .wrapContent .fieldset .deleteGroup{width: 10px;}

.wrap .wrapContent .fieldset .deleteGroup img {
	width: 10px;
	cursor: pointer;
	filter: invert(50%) sepia(100) saturate(100) hue-rotate(25deg);
}

.wrap .wrapContent .fieldset .deleteGroup img:hover {opacity: 0.7;}

.wrap .wrapContent fieldset.w10{width: calc(10% - 35px);}
.wrap .wrapContent fieldset.w20{width: calc(20% - 35px);}
.wrap .wrapContent fieldset.w30{width: calc(30% - 35px);}
.wrap .wrapContent fieldset.w33{width: calc(33% - 35px);}
.wrap .wrapContent fieldset.w40{width: calc(40% - 35px);}
.wrap .wrapContent fieldset.w50{width: calc(50% - 35px);}
.wrap .wrapContent fieldset.w60{width: calc(60% - 35px);}
.wrap .wrapContent fieldset.w70{width: calc(70% - 35px);}
.wrap .wrapContent fieldset.w80{width: calc(80% - 35px);}
.wrap .wrapContent fieldset.w90{width: calc(90% - 35px);}
.wrap .wrapContent fieldset.w100{width: calc(100% - 35px);}





.contentTable{
	font-family: "Nunito";
	border-radius: 5px;
	display: table;
	border-width: 10px 20px 20px 20px;
	border-color: white;
	border-style: solid;
	width: calc(100% - 40px) !important;
}

.contentTable input, .contentTable select{
	background-color: white !important;
}

.contentTable .dataTable{
	margin: 20px 0px;
}

.contentTable tr{
	padding: 0px 20px;
}

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate{
	font-family: "Nunito";
	font-size: 13px;
}

.dataTables_wrapper .dataTables_length select, .dataTables_wrapper .dataTables_filter input{
	background-color: white !important;
	outline: none;
}

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter{margin-bottom: 10px;}
.dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate{margin-top: 15px;}

.contentTable thead{
	color:#c3c3c3;
	text-align: left;
	background-color: white;
	font-size: 13px;
}

.contentTable thead .sorting{
	background-position: bottom 14px right 10px !important;
	background-size: 15px;
}

.contentTable thead tr th{
	padding-top: 20px !important;
	border-bottom: 1px solid rgba(0,0,0,0.1) !important;
}

.contentTable tfoot{
	display: none;
}

.contentTable tbody td{
	border-bottom: 1px solid rgba(0,0,0,0.05);
	padding: 18px !important;
	font-size: 12px;
	font-weight: 600;
	color: #575757;
	position: relative;
}

.contentTable tbody tr.checked{
	background-color: #f8f9fe;
}

.contentTable tbody tr:hover{
	background-color: #f8f9fe;
}

.contentTable tbody tr:nth-last-child(1) td{
	border-bottom: none !important;
}

.contentTable tbody td span{
	display: table;
}

.contentTable tbody td span:nth-child(1){
	font-weight: 700;
}

.contentTable tbody td span:nth-child(2){
	color: rgba(0,0,0,0.5);
	font-weight: 600;
}

.contentTable tbody td .motto{
	max-width: 385px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
}

.contentTable tbody td:nth-last-child(1), .contentTable thead th:nth-last-child(1){
	text-align: right;
	width: 1px;
	padding: 12px 20px 9px 0px !important;
}

.contentTable tbody td:nth-last-child(2), .contentTable thead th:nth-last-child(2){
	text-align: right;
	padding-right: 30px;
}

.contentTable .simpleButton{
	margin-right: 10px !important;
	margin-left: 0px !important;
}


.contentTable .buttonEditRecord{
	height: 17px;
	opacity: 0.3;
	transform: rotate(90deg);
	cursor: pointer;
	visibility: hidden;
}

.contentTable .buttonEditRecord:hover{
	opacity: 0.5;
}

.contentTable tbody tr:hover .buttonEditRecord{
	visibility: visible;
}

.contentTable .editRecordMenu{
	width: auto;
	height: auto;
	background-color: white;
	border-radius: 5px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
	position: absolute;
	right: -28px;
	z-index: 9;
	text-align: left;
	display: none;
}

.contentTable .editRecordMenu.two{top: -75px;}
.contentTable .editRecordMenu.three{top: -120px;}

.contentTable .editRecordMenu.active {display: block;}

.contentTable .editRecordMenu a{
	white-space: nowrap;
	font-size: 12px;
	font-weight: 700;
	width: calc(100% - 50px);
	padding: 13px 25px;
	display: table;
	text-decoration: none;
	color: rgb(100,100,100);
	cursor: pointer;
}

.contentTable .editRecordMenu a:hover{
	background-color: rgba(0,0,0,0.05);
}

.contentTable .editRecordMenu::after {
	content: "▼";
	position: absolute;
	top: 100%;
	left: 50%;
	text-shadow: 0px 10px 10px rgba(0,0,0,0.1);
	padding: 0px;
	margin: -4px;
	color: white;
	-webkit-transform:scale(2.0, 1.0);
	-moz-transform:scale(2.0, 1.0);
	-ms-transform:scale(2.0, 1.0);
	-o-transform:scale(2.0, 1.0);
	transform:scale(2.0,1.0);
}

.contentTable .editRecordMenu a:last-child{
	color: red;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.contentTable .editRecordMenu a:first-child{
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.dataTables_wrapper .simpleButton{
	margin: 7px 0px 7px 10px;
}







.simpleTable{border: solid 1px rgba(0,0,0,0.15); margin: 10px 0px;}
.simpleTable td{border: solid 1px rgba(0,0,0,0.15); padding: 3px 10px;}


.meetingContainer{
	display: flex;
	align-items: center;
	width: 100%;
	height: 100vh;
	background-color: black;
}


.meetingContainer .wrapContainer{
	position: fixed; 
	display: flex; width: 100%; 
	height: 100%; 
	align-items: center;
	z-index: 999;
}



@media(max-width: 1500px)
{
	.sidebar{
		position: fixed;
		z-index: 99;
		left: -255px;
		transition: 0.2s all;
		box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	}

	.sidebar.show{left: 0px;}
	.menuIcon.show{position: fixed; top: 10px; left: 255px;}
	.main{width: 100%;}
	.menuIcon{display: table;}
}

.loaderWrap{
	width: 100%;
	height: 100vh;
	position: fixed;
	background-color: rgba(0,0,0,0.5);
	top: 0px; left: 0px;
	display: flex;
	align-items: center;
	z-index: 9999;
	backdrop-filter: blur(3px);	
}

.loaderWrap span{
	color: white;
	font-weight: 700;
	padding-top: 30px;
	display: table;
}

.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1s infinite ease-in-out;
  animation: load7 1s infinite ease-in-out;
}
.loader {
  color: #ffffff;
  font-size: 5px;
  margin: 80px auto;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
  margin: 0px auto;

}
.loader:before,
.loader:after {
  content: '';
  position: absolute;
  top: 0;
}
.loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader:after {
  left: 3.5em;
}
@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}



/*Color picker*/
.colorPicker{
	background-color: white;
	border-radius: 2px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
	border:1px solid rgba(0,0,0,0.2);
	display: table;
	max-width: 132px;
	height: auto;
	padding: 20px;
	z-index: 99999;
	position: absolute;
	margin: 10px;
}

.colorPicker span{
	font-size: 14px;
	padding-bottom: 5px;
	padding-left: 3px;
	display: table;
	width: 100%;
	font-weight: 600;
}

.colorPicker .colorButton{
	width: 20px; 
	height: 20px;
	margin: 3px;
	float: left;
	cursor: pointer;
	border-radius: 50%;
}

.colorPicker .colorButton:hover{
	filter: brightness(1.1);
}

.colorPicker .colorButton.active{
	background-image: url("icons/check-white.png");
	background-size: 40%;
	background-position: center center;
	background-repeat: no-repeat;
}
/*Color picker*/


.editContactBlur{
	width: 100%;
	height: 100%;
	z-index: 10;
	display: none;
	position: absolute;
	cursor: pointer;
	background-color: rgba(0,0,0,0.2);
}

.editContact{
	width: 600px;
	height: 100vh;
	position: fixed;
	z-index: 9999;
	top: 0px;
	right: -600px;
	transition: all 0.15s;
	display: table;
	background-color: white;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
}

.editContact.active{right: 0px;}

.editContact .header{
	width: calc(100% - 60px);
	padding: 20px 30px 13px 30px;
	font-weight: 700;
	border-bottom: 1px solid rgba(0,0,0,0.1);
}

.editContact .content{
	width: calc(100% - 55px);
	height: calc(100vh - 237px);
	min-height: calc(100% - 237px); 
	padding: 30px 25px 30px 30px;
	overflow-y: auto;
	overflow-x: hidden;
}

.editContact .footer{
	width: calc(100% - 60px);
	padding: 10px 30px;
	font-weight: 700;
	border-top: 1px solid rgba(0,0,0,0.1);
	display: flex;
	align-items: center;
}

.editContact .footer .button:last-child{
	margin-right: 5px !important;
}

.editContact .header h4{
	margin-top: 3px; white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 375px;}

.editContact .header .note{
	font-size: 12px;
	color: rgba(0,0,0,0.4);
	font-style: italic;
	padding: 0;
	font-weight: 500;
	width: 100%;
	display: table;
}

.editContact .header .profileImage{
	width: 40px;	
	height: 40px;
	border-radius: 10%;
	margin-right: 15px;
}

.editTabButtons{
	width: calc(100% - 10px);
	background-color: rgba(240,240,240,1);
	display: table;
	margin: 0px;
	padding: 5px 5px 0px 5px;
}

.editContact .tab{
	padding: 0px;
    width: 100%;
}


.editTabButtons span{
	float: left;
	padding: 10px;
	text-align: center;
	display: table;
	text-decoration: none;
	font-size: 12px;
	font-weight: 600;
	color: #575757;
	cursor: pointer;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
}

.editTabButtons span.active{
	background-color: white;
	cursor: default;
	border-color: rgba(0,0,0,0.2);
	border-width: 1px 1px 0px 1px;
	border-style: solid;
	padding: 9px 10px 10px 10px; 
}

.editTabButtons span.w25{width: calc(25% - 20px);}
.editTabButtons span.w33{width: calc(33.33% - 20px);}

.editTabButtons span.w25.active{width: calc(25% - 22px);}
.editTabButtons span.w33.active{width: calc(33.33% - 22px);}

.editContact form{
	height: 100%;
	width: 100%;
	display: table;
}

.editContact .tab .contactHistoryWrap{
	width: calc(100% - 50px);
	padding: 20px;
	display: block;
	min-height: 200px;
	max-height: 700px;
	margin-top: 5px;
	border-radius: 7px;
	background-color: rgba(0,0,0,0.05);
	overflow-y: auto;
}

.editContact .tab .contactHistoryWrap .record{
	margin-bottom: 20px;
	display: table;
	width: 100%;
}

.editContact .tab .contactHistoryWrap .record .recordInfo{
	font-size: 12px;
	display: table;
	width: calc(100% - 4px);
	font-weight: 700;
	padding: 0px 2px;
}

.editContact .tab .contactHistoryWrap .record .recordInfo span:first-child{
	float: left;
	width: calc(100% - 55px);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	opacity: 0.4;
}

.editContact .tab .contactHistoryWrap .record .recordInfo span:last-child{
	float: right;
	width: 30px;
	height: 10px;
	border-radius: 5px;
	background-color: gray;
	display: table;
	margin-top: 3px;
	box-shadow: 0px 0px 4px rgba(0,0,0,0.2);
}

.editContact .tab .contactHistoryWrap .record .content{
	background-color: white;
	border-radius: 5px;
	margin: 10px 0px 0px 0px;
	display: table;
	width: 100%;
	font-size: 13px;
	padding: 0px;
	overflow: hidden;
	border: 1px solid rgba(0,0,0,0.1);
	height: auto !important;
}

.editContact .tab .contactHistoryWrap .record .content p{
	width: calc(100% - 40px);
	padding: 10px 20px;
}

.editContact .tab .contactHistoryWrap .record .content .header{
	padding: 10px 20px 10px 20px;
	width: calc(100% - 40px);
	background-color: rgba(0,0,0,0.01);
	border-bottom: 1px solid rgba(0,0,0,0.05);
	display: table;
}

.editContact .tab .contactHistoryWrap .record .content .header img{
	width: 25px;
	height: 25px;
	margin-right: 15px;
	float: left;
	border-radius: 50%;
}

.editContact .tab .contactHistoryWrap .record .content .header span{
	font-weight: 700;
	font-size: 12px;
	padding-top: 5px;
	float: left;
	display: table;
	opacity: 0.7;
}

.editContact .tab .contactHistoryWrap .record .content .header span:last-child{
	float: right;
}

.editContact .tab fieldset{
	box-shadow: none;
	border: 1px solid rgba(0,0,0,0.15);
	padding: 15px 20px;
	margin-bottom: 15px;
	width: calc(100% - 55px);
}

.editContact .tab fieldset legend{
	margin-left: -10px;
	color: rgba(0,0,0,0.5);
	font-weight: 700;
}

.editContact .tab fieldset table{
	width: 100%;
	border:none;
}

.editContact .tab fieldset table tr:hover{
	background-color: #f8f9fe;
}

.editContact .tab fieldset table tr td:first-child{
	text-align: right;
	padding-right: 10px; 
	width: 10px;
    white-space: nowrap;
    vertical-align: top;
}

.editContact .tab fieldset table tr td:last-child{
	font-size: 13px;
	text-align: left;
}

.editContact .tab fieldset table tr td:first-child label{color: black; font-size: 13px;}
.editContact .tab fieldset table tr td:last-child span{color: rgba(0,0,0,0.55); font-weight: 600;}

.editContact .tab fieldset table tr td br:last-child{
	display: block;
   	margin: 10px 0;
   	content: " ";
   	line-height:10px;
}

.loadingEdit{
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}


.lds-dual-ring {
  display: inline-block;
  width: 80px;
  height: 80px;
  margin: 0px auto;
}
.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 44px;
  height: 44px;
  margin: 8px;
  border-radius: 50%;
  border: 6px solid gray;
  border-color: gray transparent gray transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


.popupWrap {
	height: 100vh;
	width: 100%;
	top: 0px;
	left: 0px;
	position: fixed;
	display: none; 
	align-items: center;
	background-color: rgba(0,0,0,0.4);
	z-index: 9;
	backdrop-filter: blur(3px);	
}

.popupWrap .popup{
	max-width: 800px;
	min-width: 300px;
	background-color: white;
	border-radius: 3px;
	padding: 25px 30px;
	margin: 0px auto;
	text-align: center;
	z-index: 10;
}

.popupWrap .popup span{
	font-size: 15px;
	font-weight: 800;
	color: rgba(0,0,0,0.7);
}

.popupWrap .popup .buttons{
	margin: 10px auto 0px auto;
	display: table;
}

.popupWrap .popup .buttons .button{
	margin: 0px 2px;
}

.popupWrap .popup .projectList{
	width: 100%;
	border: 1px solid rgba(0,0,0,0.1);
	margin: 20px 0px 30px 0px;
	text-align: left;
	overflow-y: auto;
	overflow-x: hidden;
	max-height: 150px;
}

.popupWrap .popup .projectList label{
	padding: 10px;
	width: 400px;
	text-overflow: ellipsis;
	display: block;
	overflow:hidden;
	white-space: nowrap;
}

.popupWrap .popup .projectList label:hover{
	background-color: rgba(0,0,0,0.05);
	cursor: pointer;
}

.popupWrap .popup .projectList label input[type="checkbox"]{
	margin-right: 8px;
}

.popupWrap .popup .projectList label span{
	font-weight: 600;
	font-size: 13px;
}


















.quickFindButton{
	background-color: rgba(0,0,0,0.6);
	position: fixed;
	right: 20px;
	bottom: 40px;
	width: 22px;
	height: 22px;
	border-radius: 100px;
	padding: 12px;
	cursor: pointer;
}

.quickFindButton img{
	filter: invert(1);
	width: 100%;
}

.quickFindButton:hover{
	background-color: rgba(0,0,0,0.7);
}


.quickFindWrap{
	background-color: rgba(0,0,0,0.5);
	position: fixed;
	top: 0px;
	left: 0px;
	height: 100vh;
	display: none;
}

.quickFindWrap.active{
	display: flex;
}

.quickFindWrap .quickFindPopup{
	width: 700px;
	cursor: normal;
}

.quickFindWrap .quickFindPopup .quickFindResults{
	width: calc(100% - 10px);
	height: 200px;
	background-color: rgb(240,240,240);
	border-radius: 5px;
	margin-top: 10px;
	overflow-y: auto;
	padding: 5px;
	margin-bottom: 10px;
}

.quickFindResults .result{
	width: calc(100% - 30px);
    display: table;
    height: auto;
    background-color: rgb(246,246,246);
    border-bottom: 1px solid rgb(230,230,230);
    font-family: "Open Sans";
    padding: 13px 15px;
    cursor: pointer;
}

.quickFindResults .result:hover{
	background-color: white;
}

.quickFindResults .result .resultName{
	font-size: 12px;
	color: rgba(0,0,0,0.8);
	padding: 0px;
	margin:0px;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.quickFindResults .result .resultType{
	font-size: 12px;
	opacity: 0.5;
	font-weight: 500;
	padding: 0px;
	margin:0px;
}

.quickFindResults .result .resultContact{
	font-size: 11px;
	font-weight: 400;
	opacity: 0.7;
	padding: 0px;
	margin-top:2px;
	width: 585px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}








.calendar{
	display: table;
}

.calendar .calendarDayList{
	background-color: red;
	height: 40px;
	overflow: auto;
	width: 700px;
}

.calendar .calendarDayList .slider{
	display: inline-table;
	background-color: green;
}

.calendar .calendarDayList .slider div{
	background-color: blue;
	border-radius: 50px;
	padding: 5px 7px;
	margin: 4px;
	float: left;
	display: table;
}

.calendar .wrapContent{
	min-height: calc(100vh - 355px);
	padding: 30px 30px;
}

.calendar .task{
	height: auto;
	display: flex;
	align-items: center;
	position: relative;
}

.calendar .task .divider{
	position: absolute;
	left: 17px;
	top: 0px;
	height: 100%;
	display: table;
	width: 3px;
	background-color: #d8d8d8;
}

.calendar .task:first-child .divider{
	top: 50%;
	height: 50%;
	bottom: 0px;
}

.calendar .task:last-child .divider{
	top: 0px;
	height: 50%;
	bottom: 50%;
}

.calendar .task .time{
	width: 70px;
	float: left;
	background-color: white;
	z-index: 1;
	padding: 5px 0px;
	font-weight: bold;
	color: #b7b7b7;
	font-size: 14px;
}

.calendar .task .taskContent{
	width: calc(100% - 70px);
	background-color: white;
	float: right;
	padding: 20px 30px;
	border-radius: 4px;
	border-left: 10px solid;
	margin: 10px 0px;
	position: relative;
	border-right: 1px solid rgba(0,0,0,0.2);
	border-top: 1px solid rgba(0,0,0,0.2);
	border-bottom: 1px solid rgba(0,0,0,0.2);
	overflow: hidden;
}

.calendar .task .taskContent h4{
	width: 100%;
	margin-bottom: 5px;
}

.calendar .task .taskContent p{
	margin: 0px 0px 0px 0px;
	opacity: 0.6;
	font-size: 14px;
	width: 100%;
}

.calendar .task .taskContent .taskMenuWrap{
	width: auto;
	height: 100%;
	position: absolute;
	top: 0px;
	right: -25%;
	display: flex;
	align-items: center;
	z-index: 1;
	transition: 0.1s;
	overflow: hidden;
}

.calendar .task .taskContent:hover .taskMenuWrap
{
	right: 0px;
}

.calendar .task .taskContent .taskMenuWrap .taskMenu{
	width: 100%;
	height: auto;
	background-color: white;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	display: table;
	margin-left: 10px;
}



.calendar .task .taskContent .taskMenu .TaskButton{
	width: 20px;
	height: 20px;
	display: table;
	cursor: pointer;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	opacity: 0.6;
	padding: 10px;
	background-size: 40%;
	float: left;
}

.calendar .task .taskContent .taskMenu .TaskButton.check{
	background-image: url(../icons/check.png);
}


.calendar .task .taskContent .taskMenu .TaskButton.check:hover{
	opacity: 1;
}

.calendar .task .taskContent .taskMenu .TaskButton.delete{
	background-image: url(../icons/cross.png);
}

.calendar .task .taskContent .taskMenu .TaskButton.delete:hover{
	opacity: 1;
}


.setDateCalendarPopupWrap{
	background-color: rgba(0,0,0,0.5);
	position: fixed;
	top: 0px;
	left: 0px;
	height: 100vh;
	display: none;
	z-index: 99;
}

.setDateCalendarPopupWrap.active{
	display: flex;
}

.setDateCalendarPopupWrap .setDateCalendarPopup{
	width: 300px;
	cursor: normal;
	position: relative;
}

.setDateCalendarPopupWrap .setDateCalendarPopup .close{
	position: absolute;
	right: 10px;
	top: 10px;
	width: 14px;
	height: 14px;
	opacity: 0.7;
	cursor: pointer;
}

.setDateCalendarPopupWrap .setDateCalendarPopup .close:hover{
	opacity: 1;
}




/*

.calendar .task .taskContent .taskMenu .checkTaskButton:hover{
	background-image: url(../icons/check-ring-full.png);
	opacity: 1;
}

.calendar .task .taskContent .taskMenu .deleteTaskButton{
	width: 23px;
	height: 23px;
	display: table;
	cursor: pointer;
	opacity: 0.6;
	margin: 5px;
	float: left;
}

.calendar .task .taskContent .taskMenu .deleteTaskButton:hover{
	opacity: 1;
}
*/



/*
.calendar .task .content{
	width: calc(100% - 60px);
	height: auto;
	
	margin-bottom: 20px;
	
}


.calendar .task .taskHeader h4{
	width: calc(100% - 80px);
	float: left;
}

.calendar .task p{
	margin: 0px;
	opacity: 0.6;
	font-size: 14px;
	width: calc(100% - 80px);
}*/