body{
font-family: 'Roboto', sans-serif;
font-family: Helvetica;
min-width:1170px;	
overflow-x:hidden;

background:#fff;
padding-top: 65px;

}
a,a:hover, a:focus {
	color:#5ECDEC;
}
.container {
    width: 1170px;
	position:relative;
}





.allprofiles{
width:100%;	
}
.allprofiles td {
   
	border:1px solid;
}
.allprofiles input {
    padding: 10px;
	    width: 100%;
		background: #fff;
   
   
}
.allprofiles button {
 
	    width: 100%;
		
   
   
}
.postbefore {
    width: 645px;
	margin-right:10px;
}
.statpost{
width:300px;	
}

.masno2 {
    display: flex;
}


.message {
    font-size: 20px;
    background: rgba(20, 189, 0, 0.65);
    padding: 10px;
    color: #fff;
    border-radius: 3px;
    display: block;
	margin-bottom:10px;
}
.error {
    font-size: 20px;
    background: rgba(189, 0, 0, 0.65);
    padding: 10px;
    color: #fff;
    border-radius: 3px;
    display: block;
	margin-bottom:10px;
}

.menu {
    background: rgba(0,0,0,0);
    border-radius: 20px;
}

.content {
    background: #fff;
   // padding: 5px;
    border-radius: 3px;
	margin-bottom:10px;
	font-size: 15px;
	
}

.menuul  {
    list-style: none;
    padding: 0;
}

.menuul li a{
    color: #000;
	text-decoration:none!important
	
}
.menuul li {
    color: #000;
    //border-bottom: 1px solid #c7c7c7;
    padding: 10px 0;
    font-size:13px;
}

#vkwidget1, #vkwidget2, #vkwidget3,#vkwidget4, #vkwidget5, #vkwidget6{
	width:100%!important;
}


.sticky {
  position: fixed;
  z-index: 101;
  
}

.stop {
  position: relative;
  z-index: 101;
}

.title {
/*
       font-weight: 500;
    text-align: left;
    border-left: 7px solid #5ECDEC;
    height: 52px;
    line-height: 52px;
    padding-left: 15px;
    margin: 50px 0 30px 0;
*/
}


.grid-item {
  float: left;
  width: 450px;
  height: auto;

  display:block;
}
.navbar-default
{
/* Body: */
background: #FFFFFF;
box-shadow: 0 2px 2px 0 #E1E6EE;
}
.menuul li:hover a{
    color: #f57b20!important;	
	text-decoration:none!important
}
.active a{
color:#f57b20!important;	
}


.topnumber {
    margin: 0;
    font-size: 20px;
}

.top {
    height: 130px;
        box-shadow: 2px 2px 5px #afafaf;
    padding: 20px;
}


.logogroup {
    width: 50px;
    border-radius: 100%;
    display: block;
    margin-right: 20px;
	overflow: hidden;
}
.shapka {
    display: inline-flex;
}
.namegroup {
    line-height: 19px;
    font-size: 14px;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #42648b;
}
.namegroup h3{
	margin: 0;
	    line-height: 19px;
    font-size: 14px;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #42648b;
}
.namegroup p{
	font-weight: 300;
	margin: 0;
	    color: #939393;
    margin-top: 1px;
}
.post {
    padding: 15px;
    border: 1px solid #ddd;
	overflow: hidden;
	position: relative;
}
.textpost{
margin-top:15px;	
margin-bottom:10px;
font-size:15px;
}
.likes{
 
    font-size: 14px;

    padding: 4px 7px;
    margin: -4px -7px;
    height: 14px;
    color: #7996b5;
	font-weight:700;
    white-space: nowrap;
    border-radius: 2px;	
	    line-height: 16px;
		    margin-right: 20px;
}
.likes i{
    display: inline-block;
    vertical-align: middle;
    background: url('data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"%20width%3D"16"%20height%3D"14"%20viewBox%3D"0%200%2016%2014"%20style%3D"fill%3A%233D6899%3B"><path%20d%3D"M8%203.2C7.4-0.3%203.2-0.8%201.4%201%20-0.5%202.9-0.5%205.8%201.4%207.7%201.9%208.2%206.9%2013%206.9%2013%207.4%2013.6%208.5%2013.6%209%2013L14.5%207.7C16.5%205.8%2016.5%202.9%2014.6%201%2012.8-0.7%208.6-0.3%208%203.2Z"%2F><%2Fsvg>') no-repeat;
    opacity: 0.4;
    filter: alpha(opacity=40);
    height: 15px;
	width:16px;
	    margin-right: 5px;
}
.reposts{
 
    font-size: 14px;

    padding: 4px 7px;
    margin: -4px -7px;
    height: 14px;
    color: #7996b5;
	font-weight:700;
    white-space: nowrap;
    border-radius: 2px;	
	    line-height: 16px;
		    margin-right: 20px;
}
.reposts i{
    display: inline-block;
    vertical-align: middle;
    background: url('data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"%20width%3D"14"%20height%3D"14"%20viewBox%3D"0%200%2014%2014"%20style%3D"fill%3A%233D6899%3B"><path%20d%3D"M0%205.5L0%206.5C0%208%201.6%209%203%209L8%209C8.4%209%209.1%209.2%2010.7%2010.3%2011.7%2011.1%2012.9%2012%2012.9%2012L14%2012%2014%206%2014%206%2014%206%2014%200%2012.9%200C12.9%200%2011.7%200.9%2010.7%201.7%209.1%202.8%208.4%203%208%203L3%203C1.6%203%200%204%200%205.5ZM7.5%2012L6.4%209%204%209%205.3%2014C7.3%2014%207.5%2013.3%207.5%2012Z"%2F><%2Fsvg>')  no-repeat;

    opacity: 0.4;
    filter: alpha(opacity=40);
    height: 15px;
	width:16px;
	    margin-right: 5px;
}
.comments{
 
    font-size: 14px;

    padding: 4px 7px;
    margin: -4px -7px;
    height: 14px;
    color: #7996b5;
	font-weight:700;
    white-space: nowrap;
    border-radius: 2px;	
	    line-height: 16px;
		    margin-right: 20px;
			float:right;
}
.comments i{
    display: inline-block;
    vertical-align: middle;
    background: url('data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"%20width%3D"14"%20height%3D"14"%20viewBox%3D"5%206%2014%2014"%20style%3D"fill%3A%233D6899%3B"><path%20d%3D"M5%207C5%206.4%205.4%206%206%206L18%206C18.5%206%2019%206.5%2019%207L19%2015C19%2015.6%2018.6%2016%2018%2016L6%2016C5.5%2016%205%2015.5%205%2015L5%207ZM9%2016L9%2020%2014%2016%209%2016Z"%2F><%2Fsvg>')  no-repeat;

    opacity: 0.4;
    filter: alpha(opacity=40);
    height: 15px;
	width:16px;
	    margin-right: 5px;
}

.views{
 
    font-size: 14px;

    padding: 4px 7px;
    margin: -4px -7px;
    height: 14px;
    color: #7996b5;
	font-weight:700;
    white-space: nowrap;
    border-radius: 2px;	
	    line-height: 16px;
		    margin-right: 20px;
			float:right;
}
.views i{
    display: inline-block;
    vertical-align: top;
    background: url('data:image/svg+xml;charset=utf-8,<svg%20xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"%20width%3D"14"%20height%3D"10"%20viewBox%3D"1%202%2014%2010"%20style%3D"fill%3A%23828a99%3B"><path%20d%3D"M8%2012C3.8%2012%201%208%201%207%201%206%203.8%202%208%202%2012.2%202%2015%206%2015%207%2015%208%2012.2%2012%208%2012ZM8%2010.5C9.9%2010.5%2011.5%208.9%2011.5%207%2011.5%205.1%209.9%203.5%208%203.5%206.1%203.5%204.5%205.1%204.5%207%204.5%208.9%206.1%2010.5%208%2010.5ZM8%208.6C7.1%208.6%206.4%207.9%206.4%207%206.4%206.1%207.1%205.4%208%205.4%208.9%205.4%209.6%206.1%209.6%207%209.6%207.9%208.9%208.6%208%208.6Z"%2F><%2Fsvg>') no-repeat;
        width: 14px;
    height: 11px;
    margin: 2px 0 0;
    opacity: 0.5;
	    margin-right: 5px;
}



.activsoc {
    margin-top: 15px;
	    display: inline-flex;
}

[data-tooltip] {
  position: relative;
  z-index: 2;
  cursor: pointer;
      border: 1px solid;
    height: 21px;
    width: 21px;
        display: inline-flex;
		    font-weight: 500;
    vertical-align: middle;
    margin-left: 10px;
    border-radius: 50%;
    font-size: 15px;
    line-height: 20px;
    padding: 0 6px;
    text-decoration: none!important;
        color: #5ecdec;
}

/* Hide the tooltip content by default */
[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;
}

/* Position tooltip above the element */
[data-tooltip]:before {
  position: absolute;
  top: 100%;
  left: 50%;
  font-weight:300;
  margin-bottom: 5px;
  margin-left: -100px;
  padding: 7px;
  width: 200px;
  -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;
  line-height: 1.2;
}

/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
      position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    width: 0;
    margin-top: -5px;
    border-bottom: 5px solid #000;
    border-bottom: 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;
    
}

/* Show tooltip content on hover */
[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;
}

.masno{
//width:470px;	
}

#page-preloader {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(255,255,255,1);
    z-index: 100500;
}

#page-preloader .spinner {
    width: 50px;
    height: 50px;
    position: absolute;
    left: 50%;
    top: 50%;
	z-index:99999999;
	
		background-image: url('http://maffrigby.com/wp-content/uploads/2014/03/gettestr-large-spinner-orange.gif');
		background-image: url('/img/spinner.gif');
	background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    margin: -16px 0 0 -16px;
}


 .modal-preloader {
	 display: none;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width:100%;
    height:100%;
    background: rgba(255,255,255,1);
    z-index: 100500;
}
.modal-preloader .spinner {
    width: 50px;
    height: 50px;
    position: absolute;
    left: 50%;
    top: 50%;
	z-index:99999999;
	
		background-image: url('http://maffrigby.com/wp-content/uploads/2014/03/gettestr-large-spinner-orange.gif');
		background-image: url('/img/spinner.gif');
	background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    margin: -16px 0 0 -16px;
}


a.sorting {
    font-size: 20px;
    font-weight: 100;
    border: 1px solid;
    margin-right: 10px;
    padding: 0 10px;
    cursor: pointer;
    text-decoration: none;
    transition:0.3s;
}
.sorting:hover{
	color: #4292a9;
}
.activesort{
color: #682c94;	
}

.topsoc {
    position: relative;
    min-height:60px;
}
.grouphead {
    position: absolute;
    top: 0;
	left:0;
    display: flex;
	padding:10px;
	background: #fff;
    border-bottom-right-radius: 10px;
}
.grouphead .photo {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    overflow: hidden;
    border:1px solid #000;
}
.grouphead .photo img{
	 width: 40px;
    height: 40px;
}

.textheader {
    color: #fff;
    color: #000;
    font-size: 20px;
    font-weight: 100;
    line-height: 40px;
    margin-left: 10px;
}

.textheader i {
    vertical-align: middle;
    margin-left: 10px;
}
.projectmenu {
    display: inline-flex;
}

.projectmenu button{
margin-right:15px;	
}
form.deletepost {
    position: absolute;
    right: 5px;
    top: 5px;
}

form.deletepost button {
    background:url("data:image/svg+xml,%3Csvg width%3D%2220%22 height%3D%2220%22 viewBox%3D%220 0 20 20%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M8.586 10L.102 18.484l1.414 1.414L10 11.414l8.484 8.484 1.414-1.414L11.414 10l8.484-8.484L18.484.102 10 8.586 1.516.102.102 1.516 8.586 10z%22 fill-opacity%3D%22.5%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E");
    width: 20px;
    height: 20px;
    border: none;
	outline:none;
}

form.deletepost button:hover {
    background:url("data:image/svg+xml,%3Csvg width%3D%2220%22 height%3D%2220%22 viewBox%3D%220 0 20 20%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M8.586 10L.102 18.484l1.414 1.414L10 11.414l8.484 8.484 1.414-1.414L11.414 10l8.484-8.484L18.484.102 10 8.586 1.516.102.102 1.516 8.586 10z%22 fill%3D%22%23F00%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E");
	
}

.sortir{
	margin-top:50px;
	margin-bottom: 30px;
}
.lscbox input {
    margin-right: 6px;
}
.lscbox span {
    margin-right: 20px;
}

.reportmain {
    box-shadow: 1px 1px 5px #b7b7b7;
    text-align: center;
        background: #fff;
    color: #000;
    margin-bottom: 25px;
        margin-right: 20px;
    font-size: 15px;
    height: 50px;
    line-height: 50px;
    text-decoration: none!important;
    transition:0.3s;
}
.reportmain:before{
	content:'';
	width: 35px;
    height: 35px;
    display: block;
    background: #62ccea;
    z-index: -9999999;
    top: -10px;
    position: absolute;
    left: -5px;
}
.reportmain:hover {
    margin-top: -8px;
    margin-left: -8px;
}
.fb .reportmain:before{
	background:#FB8E00;
}

.inst .reportmain:before{
	background:#573690;
}
.odnoc .reportmain:before{
	background:#62ccea;
}

.titleonmain {
    margin-bottom: 30px;
    margin-left: -6px;
}

.toppanelmain {
    border-bottom: 1px solid #b7b7b7;
    width: 800px;
    margin-left: -5px;
    padding-bottom: 10px;
    font-weight: 100;
}


.profile {
    box-shadow: 1px 1px 5px #949494;
    padding: 10px;
    margin-top: 25px;
    display: inline-block;
}

.profile h1{
	font-size: 25px;
	font-weight: 100;
	
	margin-top: 0;
}

.profile  hr{
    margin: 0;
    margin-bottom: 20px;
    width: 190px;
    border-color: #b7b7b7;
    }
    
.profile td {
    padding: 5px 0;
}

.profile button {
    background: #62ccea;
    border: none;
    color: #fff;
    padding: 3px 20px;
    margin-top: 0px;
    float: right;
}


.linemain{
	height:75px;
}

.monthofreport {
    position: absolute;
    right: 0;
    top: 0;
    padding: 10px;
    background: #fff;
    border-bottom-left-radius: 10px;
}

.groups {
    box-shadow: 1px 1px 5px #949494;
    padding: 10px;
    margin-top: 25px;
    display: inline-block;
    width:100%;
}

.background{
	box-shadow: 1px 1px 5px #949494;
    padding: 10px;
    margin-top: 25px;
   // display: inline-block;	
}
.background .title{
	margin: 0;
	line-height:40px;
	height:40px;
}
.groupOfComment h2{
	font-size:18px;
	text-align: center;
	font-weight: 300;

}
.groupOfComment a{
background: #62ccea;
    border: none;
    display: block;
    text-decoration: none;
    text-align: center;
    color: #fff;
    padding: 3px 10px;
    margin-top: 0px;
    width: 100%;
    transition:0.3s;
    }
    
    .groupOfComment a:hover{
	    background:#4b9eb5;
	    }
	    
	   
.oneComment{
    padding: 10px 0;
      
    border-bottom: 1px solid #ececec;
}
	.oneComment .commenterImg img{
	border-radius: 50%;
	vertical-align: top;
	width:34px;
	height:34px;
		
	}
	.oneComment .commenterImg{
		
		float:left;
		display:block;
	}
	.oneComment .commentContent{
		
	    margin-left: 44px;
    word-wrap: break-word;
    min-height: 34px;
    }
    
    .oneComment .commentAction{
	    outline: none!important;
	    float:right;
	     background: url('https://vk.com/images/post_icon_2x.png?6') no-repeat 1px -46px;
    background-size: 20px 369px;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer;
    height: 13px;
    width: 13px;
    margin-left: 7px;
    transition: visibility 100ms ease, opacity 100ms ease;
    border: none;
    outline: hidden!important;
    }
    .oneComment:hover .commentAction{
	    opacity: 1;
    filter: alpha(opacity=1);
    }
    
    .oneComment .commentAuthor{
        font-size: 12.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    }
    .oneComment .commentAuthor a{
    color:#2a5885;
    font-weight: 600;
    }
    .oneComment .commentText{
	    font-size:13px;
	        padding: 2px 0 0;
	            word-wrap: break-word;
    overflow: hidden;
        line-height: 1.308;
    }
    
    .oneComment .commentFooter{
	        font-size: 12.5px;
    padding: 3px 0 0;
    margin-bottom: -1px;
        display: block;
    }
     .oneComment .commentFooter .commentData{
	         float: left;
    padding-right: 8px;
    color: #939393;
    
	     }
	     
	     
	     .oneComment .commentFooter:after {
    content: '.';
    display: block;
    height: 0;
    font-size: 0;
    line-height: 0;
    clear: both;
    visibility: hidden;
}
.noComment {
    opacity: 0.15;
}
.commentScroll{
	padding-right:30px;
	margin-top:10px;
	max-height: 500px;
	overflow: scroll;
}


.newPost {
    display: initial;
}

.addpost {
    float: right;
    margin-right: 15px;
}










#modal_form {
	  width: 700px;
  height: 510px;
  /* border-radius: 5px; */
  //border: 6px #20AA73 solid;
  background: #fff;
  position: fixed;
  top: 45%;
  left: 50%;
  margin-top: -255px;
  margin-left: -350px;
  display: none;
  opacity: 0;
  z-index: 99999;
  padding: 15px;
  overflow: scroll;
}
/* Кнопка закрыть для тех кто в танке) */
#modal_form #modal_close {
	width: 21px;
	height: 21px;
	position: absolute;
	top: 10px;
  right: 10px;
	cursor: pointer;
	display: block;
	background: url('data:image/svg+xml,<svg width%3D"20" height%3D"20" viewBox%3D"0 0 20 20" xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"><path d%3D"M8.586 10L.102 18.484l1.414 1.414L10 11.414l8.484 8.484 1.414-1.414L11.414 10l8.484-8.484L18.484.102 10 8.586 1.516.102.102 1.516 8.586 10z" fill-opacity%3D".5" fill-rule%3D"evenodd"%2F><%2Fsvg>') no-repeat 0px 0px;
}

#modal_form #modal_close:hover{
background: url('data:image/svg+xml,<svg width%3D"20" height%3D"20" viewBox%3D"0 0 20 20" xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"><path d%3D"M8.586 10L.102 18.484l1.414 1.414L10 11.414l8.484 8.484 1.414-1.414L11.414 10l8.484-8.484L18.484.102 10 8.586 1.516.102.102 1.516 8.586 10z" fill%3D"%23F00" fill-rule%3D"evenodd"%2F><%2Fsvg>') no-repeat 0px 0px;
}





#modal_form_upload {
	  width: 700px;
  height: 510px;
  /* border-radius: 5px; */
  //border: 6px #20AA73 solid;
  background: #fff;
  position: fixed;
  top: 45%;
  left: 50%;
  overflow: hidden;
  margin-top: -255px;
  margin-left: -350px;
  display: none;
  opacity: 0;
  z-index: 99999;
  
}
/* Кнопка закрыть для тех кто в танке) */
#modal_form_upload #modal_close_upload {
	width: 21px;
	height: 21px;
	position: absolute;
	top: 10px;
  right: 10px;
	cursor: pointer;
	display: block;
	background: url('data:image/svg+xml,<svg width%3D"20" height%3D"20" viewBox%3D"0 0 20 20" xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"><path d%3D"M8.586 10L.102 18.484l1.414 1.414L10 11.414l8.484 8.484 1.414-1.414L11.414 10l8.484-8.484L18.484.102 10 8.586 1.516.102.102 1.516 8.586 10z" fill-opacity%3D".5" fill-rule%3D"evenodd"%2F><%2Fsvg>') no-repeat 0px 0px;
}

#modal_form_upload #modal_close_upload:hover{
background: url('data:image/svg+xml,<svg width%3D"20" height%3D"20" viewBox%3D"0 0 20 20" xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"><path d%3D"M8.586 10L.102 18.484l1.414 1.414L10 11.414l8.484 8.484 1.414-1.414L11.414 10l8.484-8.484L18.484.102 10 8.586 1.516.102.102 1.516 8.586 10z" fill%3D"%23F00" fill-rule%3D"evenodd"%2F><%2Fsvg>') no-repeat 0px 0px;
}


.dragFile {
    width: 100%;
    height: 100%;
    opacity: 0.9;
    position: absolute;
    background: #507299;
    top: 0;
    left: 0;
    padding: 40px;
    opacity: 0;
    transition:0.5s;
}
.dragFile.active{
    opacity: 0.7;
    z-index: 99999999;
}

.dragFile.superActive{
    opacity: 1;
}
.drag_text span {
    margin: auto auto;
}
.drag_text {
    border: 10px dashed #fff;
    height: 100%;
    border-radius: 40px;
    opacity: 1;
    color: #fff;
    font-size: 40px;
    text-align: center;
    display: flex;
}
/* Подложка */
#overlay {
	  z-index: 9999;
	position: fixed; /* всегда перекрывает весь сайт */
	background-color: #000; /* черная */
	opacity: 0.8; /* но немного прозрачна */
	width: 100%; 
	height: 100%; /* размером во весь экран */
	top: 0; 
	left: 0; /* сверху и слева 0, обязательные свойства! */
	cursor: pointer;
	display: none; /* в обычном состоянии её нет) */
}

.popuptitle{
	margin: 0;
}
.postForAgreementLeft{
	box-shadow: 1px 1px 5px #949494;
    padding: 10px;
    margin-top: 25px;
	
    width:100%;
}
.postForAgreement{
	 box-shadow: 1px 1px 5px #949494;
    padding: 10px;
    margin-top: 25px;
   // display: inline-block;

   
     padding-bottom: 45px;
     
    width:100%;
}


/*
.addNewPost{
	transition:4s ease-in;
	height: 125px;
}
.addNewPost:hover{
	height: auto;	
	transition:3s ease-out;
}
*/
	.postForAgreement .head .time {
    font-size: 13px;
    float: left;
}
	.postForAgreement .head .sociate {
    float: right;
}
.postForAgreement .head {
    min-height: 20px;
}
	.postForAgreement .head .sociate i {
    padding: 0 5px;
}
.postForAgreement .content .text {
    font-size: 14px;
    margin:10px 0;
    text-align: left;
}
.postForAgreement .content .attach {
    margin-top: 10px;
}
.instagramLocation{
	position: relative;
	display: none;
}
.instagramLocation.active{
	display: block;
}
.instagramLocation .locationList.active{
	display: block;
}
.instagramLocation .locationList {
	z-index: 1000;
    position: absolute;
    background: #fff;
    width: 100%;
    border: 1px solid #d3d9de;
    border-top: none;
    list-style: none;
    padding: 5px;
    display: none;
    max-height: 300px;
    overflow-x: scroll;
}
.locationElement {
    border-bottom: 1px solid #d3d9de;
    padding: 10px;
    font-weight: 100;
    cursor: pointer;
    transition:0.3s;
}
.locationElement:hover{
	background: #eee;
}
.locationElement:last-child{
	border: none;
}
.postForAgreement .content .url, .postForAgreement .content .instagramLocation {
    margin-top: 20px;
}
.postForAgreement .head .sociate i:last-child {
    padding-right: 0px;
}



.dropdown-menu {
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

.delet_post {
    float: left;
}
.edit_post {
    float: right;
}

.footer_post {
    min-height: 35px;
    
}


.button-comment {
    float: right;
    margin-left: 10px;
}
.comment_text_for_post{
	width:100%;
	resize: none;
	outline: none;
	transition:0.3s;
	padding-right: 30px;
	//padding:10px 30px 10px 10px;
	border-radius: 0px;
	border: solid 1px #c4c4ca;
	box-shadow: none;
}

.btn{
	outline:none;
}

.buttonSuccess,.buttonBack {
    float: right;
}

.clienttimeAction {
    float: right;
    color: #b3b3b3;
    font-weight: 100;
}


.progressUploadPhoto {
    display: block;
    width: 100px;
}
.oneAttach img {
    height: 100px;
    display: block;
    margin: 0 auto;
}
.oneAttach video {
    height: 100%;
    display: block;
    margin: 0 auto;
}


.oneAttach {
        display: -webkit-inline-box;
    height: 100px;
    width: 100px;
    overflow: hidden;
    margin: 2px;
    border: 1px solid #eee;
        position: relative;
        cursor: -webkit-grab;
}
.oneAttach:focus{
	cursor: -webkit-grabbing;
}
.oneAttach:active{
	cursor: -webkit-grabbing;
}


.ui_thumb_pe_button, .ui_thumb_x_button, .ui_thumb_x_button_activity, .ui_thumb_x_button_campaign, .ui_thumb_x_button_photoSet {
    position: absolute;
    top: 5px;
    right: 5px;
    background: rgba(29,32,34,.6);
    border-radius: 50%;
    padding: 5px;
    cursor: pointer;
    outline: none;
    z-index: 999;
}
.ui_thumb_x_button .ui_thumb_x, .ui_thumb_x_button_activity .ui_thumb_x, .ui_thumb_x_button_campaign .ui_thumb_x, .ui_thumb_x_button_photoSet .ui_thumb_x {
    display: block;
    background: url('https://vk.com/images/attach_icons_2x.png?4') no-repeat 0 -40px;
    background-size: 32px 254px;
    opacity: 0.85;
    filter: alpha(opacity=85);
    width: 8px;
    height: 8px;
    
}
.ui_thumb_x_button:hover .ui_thumb_x, .ui_thumb_x_button_activity:hover .ui_thumb_x,  .ui_thumb_x_button_photoSet:hover .ui_thumb_x {
    opacity: 1;
    -webkit-filter: none;
    filter: none;
}

textarea#text_for_post {
    width: 100%;
    height:230px;
    padding:5px;
}

#modal_form_upload .title {
    margin-top: 5px;
    margin-left: 5px;
    margin-bottom: 10px;
    font-size: 20px;
}

.oneUploadBefore {
    width: 98px;
    overflow: hidden;
    display: inline-block;
    height: 98px;
    position: relative;
    margin: 1px;
    margin-top: -4px;
    border: 1px solid #c7c7c7;
    text-align: center;
}
.oneUploadBefore img{
	height: 100px;
}
.oneUploadBefore video{
	//width: 100%;
	height: 100%;
}
.beforeUploads{
	margin-top:5px;
	overflow: scroll;
    height: 396px;
    padding-top: 4px;
    position: relative;
}
.button-upload {
    text-align: center;
    background: #f0f2f5;
    color: #2a5885;
    line-height: 40px;
    font-size: 17px;
    cursor: pointer;
    position: relative;
}
.button-upload:hover {
	background: #e9ebf0;
	}


.media_check_btn {
	    display: block;
    padding: 8px;
    position: absolute;
    top: 5px;
    left: 5px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    opacity: 0.7;
    -o-transition: opacity 60ms linear;
    transition: opacity 60ms linear;
    height: 22px;
    width: 22px;
    background-image: url('https://vk.com/images/icons/media_check_uncheck_2x.png');
    background-size: 22px 48px;
    background-position: 0 -26px;
    cursor: pointer;
}
.media_check_btn:hover {
    opacity: 0.9;
}

.media_check_btn.selected{
	opacity: 1;
    background-position: 0 0;
}

.addNewContent {
    position: absolute;
    right: 10px;
    bottom: -35px;
    opacity: 0;
    transition: 0.3s;
}

.blackopacity {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 1);
    position: absolute;
    top: 0;
    opacity: 0;
    left: 0;
    transition:0.3s;
}
.attachUpload{
    display: none!important;
    }
    
    .button-upload i {
    margin-right: 10px;
    font-size: 30px;
    font-family: arial;
    vertical-align: sub;
}


.top input {
    font-size: 35px;
    width: 100%;
    margin-top: 10px;
}


/*
.introText {
    background: #5ecdec;
    padding: 15px;
    color: #fff;
    display: flex;
}
*/


/*
.introText .title {
    margin: 0;
    border-left: 7px solid #f60;
    margin-bottom: 30px;
}
*/
/*
.contentText {
    width: 60%;
    padding-bottom: 40px;
    position: relative;
    padding-right: 10px;
}
*/
/*
.contentImg {
    width: 39%;
}
.contentImg .uploadFileButton{
	color:#fff;
}
*/

.contentImg .oneAttach{
	border: none;
	display: block;
	width: 100%;
	height: 100%;
}
.contentImg .oneAttach img{
	border: none;
	width: 100%;
	height: 100%;
	display: block;
}
.contentImg .oneAttach video{
	border: none;
	width: 100%;
	height: auto;
	display: block;
}

.introText input,.introText textarea{
	color:#000;
}
/*
.introText button{
	position: absolute;
	bottom: 0;
	left: 0;
}
*/

/*
.introText textarea{
	width: 90%;
}
*/
.introText input{
	font-size: 30px;
	width: 90%;
	margin-bottom: 20px;
}

.sixColumnTitle {
    font-weight: 500;
    text-align: left;
    height: 52px;
    line-height: 52px;
    padding-left: 15px;
    width: 100%;
    font-size: 30px;
    margin: 50px 0 30px 0;
}



.activities{
	width:100%;
}
.activities thead{
	font-size: 30px;
}
.activities td:first-child{
	width: 70%;
}
.activities tbody td{
	padding: 10px 23px;
	position: relative;
}
.activities tr{
	border-bottom: 1px solid #e2e2e4;
}
/*
.activities tbody tr:nth-child(2n+1){
	background: #eee;
	}
*/
	
	
	.textpost a{
		    word-wrap: break-word;
	}
	
.campaing{
	width: 100%;
	
}
.campaing td{
	width: auto;
	
}
/*

.titleCampaign{
	text-align: center;
	    position: relative;
}
*/


.campaing{
	width:100%;
}
.campaing thead{
	font-weight: 800;
}
.campaing thead td{
	padding: 2px 10px;
	background-color: #f6f7f9;
    background-image: linear-gradient(#fff, #efefef);
}
.campaing td:first-child{
	
	padding: 10px 23px;

}
.campaing td{
	
	padding: 10px 10px;
	position: relative;
	border: 1px solid #d3d3d3;
}

.campaing td:first-child{
	text-align: left;
}
.campaing tr{
	border-bottom: 1px solid #eee;
	text-align: right;
}
.campaing tbody tr:nth-child(2n){
	background: rgba(60,61,79,0.3);
	}
.campaing td i {
        font-size: 24px;
    vertical-align: bottom;
    margin-right: 10px;
    transition:0.3s;
    cursor: pointer;
}
.rotate{
	    transform: rotate(90deg);
	    vertical-align: inherit;
}

tr.subTable {
       display: none;
}
tr.subTable td {
    font-size: 12px;
    font-weight: 100;
    height: 0px;

}
.subTableNotHidden{
	display: table-row!important;
}
tr.subTable td:first-child {
    padding-left: 60px;
    padding-right: 0px;
}

.campaignForm label {
    margin-left: 5px;
    margin-right: 20px;
}

.shortvalue{
	width:100px;
}


.instagramLikes {
    //display: none;
}
.instagramLikes.active{
	display: block;
}
.instagramLikes p input {
    margin-left: 10px;
    width: 30px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #d3d9de;
}



.loginPage {
    background: #682C94;
	height:80vh;  
	padding: 0px;
	position: relative;
	display: flex;
	padding: 0 50pt;
    align-items: center;
}
form.loginFromTelegram {
    display: block;

    text-align: center; 
	
}
.loginFromTelegram input {
        background: rgba(255, 255, 255, 0);
    border: 1px solid #fff;
    border-radius: 50px;
    padding: 5pt 10pt;
    font-weight: 100;
    width: 100%;
    color: #fff;
    text-align: center;
    font-size: 45pt;
    margin-top: 20px;
    outline: none;
}
.loginFromTelegram button {
    margin-top: 15pt;
    width: 100%;
    border-radius: 50px;
    border: 1px solid #fff;
    font-size: 45pt;
    color: #fff;
    padding: 5pt;
    background: #ff6600;
    outline: none;
}

input::-webkit-input-placeholder       {text-indent: 0px;   transition: text-indent 0.3s ease;}
input::-moz-placeholder                {text-indent: 0px;   transition: text-indent 0.3s ease;}
input:-moz-placeholder                 {text-indent: 0px;   transition: text-indent 0.3s ease;}
input:-ms-input-placeholder            {text-indent: 0px;   transition: text-indent 0.3s ease;}
input:focus::-webkit-input-placeholder {text-indent: 1000px; transition: text-indent 0.3s ease;}
input:focus::-moz-placeholder          {text-indent: 1000px; transition: text-indent 0.3s ease;}
input:focus:-moz-placeholder           {text-indent: 1000px; transition: text-indent 0.3s ease;}
input:focus:-ms-input-placeholder      {text-indent: 1000px; transition: text-indent 0.3s ease;}




.addTelegramBot{
	width: 100%;
}
.addTelegramBot input, .addTelegramBot button{
	width: 100%;
}
.addTelegramBot td{
	width: auto;
}


.datepicker{
	z-index: 9999999999!important;
}


.postForAgreement .content .url input, .postForAgreement .content .instagramLocation input{
	width: 100%;
}

.addNewPost{
	border: 2px solid #5cb85c;
	padding: 10px;
}

.timers {
	display:flex;
}
.timer{
	//display: none;
	
}
.timer input {
    width: 100%;
    font-size: 15px;
    font-weight: 100;
    margin-bottom: 10px;
    border-radius: 4px;
    border: 1px solid #d3d9de;
    padding: 5px 10px;
}
.timer a, .timer button {
    width: 100%;
    padding: 2px 5px;
    font-size: 16px;
    font-weight: 100;
    margin-bottom: 10px;
   
}
.activeTimer{
	display: block;
}

.buttonSuccess i, .buttonBack i{
    margin-right: 10px;
    display: none;
}
.url p, .instagramLocation p{
    margin-bottom: 0px;
}
/*
.url input, .instagramLocation input{
    padding: 5px 10px;
    font-size: 14px;
    font-weight: 100;
    border-radius: 4px;
    outline: none;
    border: 1px solid #d3d9de;
}
*/
.postForAgreement .uploadFiles {
    margin-top: 15px;
}
.postForAgreement .head .sociate label{
	margin-left: 10px;
}
.postForAgreement .head .sociate label i {
    padding: 0;
}
.oneComment:last-child{
	border: none;
}

.equalTime input {
    margin-left: 5px;
    margin-top: 20px;
}
.equalTime{
	display: none;
}
.equalTime label {
    font-weight: 100;
    margin-left: 5px;
    margin-bottom: 0px;
}
.equalTimeActive{
	display: block;
}

h3.draftHeader {
    margin: 0;
    margin-bottom: 10px;
    border-left: 4px solid #5ecdec;
    padding-left: 10px;
}

.storyInstagram label {
    font-weight: 100;
    font-size: 14px;
}
.storyInstagram input {
    width: 20px;
}

.access_table td {
    padding: 0px 10px;
    font-weight: 100;
}
.access_sub_header td {
    padding: 20px 0 5px 0;
    font-weight: 700;
}
.access_table tr {
    border-bottom: 1px solid #ececec;
}


.calendarBlock {
    margin: 0 5px;
    background: #f5f5f5;
    padding: 10px;
    width: 13.53%;
    border-radius: 5px;
    border: 1px solid #ccc;
    margin-bottom:10px;
}

.calendarBlock:first-child, .calendarBlock:nth-child(7n+1) {
	margin-left: 0;
}
.calendarBlock:nth-child(7n) {
	margin-right: 0;
}

.calendar {
    display: flex;
    flex-wrap: wrap;
}

.calendarBlock hr {
    margin: 5px 0;
    width: 40%;
    border-top: 1px solid #9e9e9e;
}
.calendarBlock p {
    margin-bottom: 3px;
}
.calendarBlock i {
    width: 15px;
    text-align: center;
}



.standart-button {
    background: #FF5607;
    border-radius: 3px;
    border: 1px solid #ff5607;
    font-size: 16px;
    color: #FFFFFF;
    width: 100%;
    display: block;
    text-align: center;
    font-weight: 300;
    position: relative;
    padding: 10px 0;
    letter-spacing: 1px;
    text-decoration: none!important;
    transition:0.3s;
    cursor: pointer;
        margin: 30px 0;
        outline: none!important;
    
}

.standart-button .plus {
    margin-left: 10px;
}
.standart-button:hover{
	color:#FF5607;
	background: rgba(0,0,0,0);
}
.projectListHeader {
    font-size: 14px;
    color: #84858B;
}
.projectListHeader.firstTitle{
	margin-left: 10px;
}
.blockOneProject {
    background: #FFFFFF;
    border: 1px solid rgba(60,61,79,0.15);
    border-radius: 2px;
        padding: 15px 0;
            display: flex;
            min-height: 100px;
                margin-bottom: 22px;
                position: relative;
                cursor:pointer;
}
.numberOfProject{
	display: inline-block;
	width: 25px;
	 color: #84858B;
	 font-size: 14px;
	
}

.allColumns{
	display: flex;
}
.oneColumns{
	margin: auto 0;
}

.titleOfProject {
    font-size: 16px;
    margin: 0;
    margin-left: 10px;
}


.responsibles {
    margin: 0;
    padding: 0;
    font-size: 14px;
    color: #84858B;
    list-style: none;
}
.responsibles li{
	margin-bottom: 5px;
}
.responsibles li:before { 
content:''; 
display:inline-block; 
height:1em; 
width:1em; 
background-image:url('data:image/svg+xml;utf8,<svg width="11px" height="14px" viewBox="0 0 11 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.400000006"> <g id="Projects_list" transform="translate(-561.000000, -249.000000)" fill-rule="nonzero" fill="#3C3D4F"> <g id="Item_1" transform="translate(269.000000, 222.000000)"> <g id="avatar" transform="translate(292.000000, 27.000000)"> <g id="Group"> <circle id="Oval" cx="5.5" cy="3.10292118" r="3.10292118"></circle> <path d="M5.5,6.93596059 C2.4758399,6.93596059 0.0242487685,9.38757882 0.0242487685,12.4117118 C0.0242487685,13.2181527 0.678017241,13.8719212 1.48445813,13.8719212 L9.51556897,13.8719212 C10.3220099,13.8719212 10.9757783,13.2181527 10.9757783,12.4117118 C10.9757512,9.38757882 8.5241601,6.93596059 5.5,6.93596059 Z" id="Shape"></path></g></g></g></g></g></svg>');
background-size:contain; 
background-repeat:no-repeat; 
padding-left: 2em; 
}

.projectSoc {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
}

.projectSoc li{
	    line-height: 0;
    
    margin: auto 0;
    margin-right: 16px;
}


.contentPlanOfThisProject {
    border: 1px solid #ff5607;
    padding: 12px 25px;
    border-radius: 3px;
    color: #ff5607;
    font-size: 16px;
    text-decoration: none!important;
    cursor: pointer;
    transition:0.3s;
}

.contentPlanOfThisProject:hover {
	background:#ff5607;
	color:#fff;
}

.morebuttons {
   height: 23px;
    cursor: pointer;
    margin: auto 0;
    margin-left: 15px;
    width: 30px;
    position: relative;
    text-align: right;
}
.projectButtons {
    display: flex;
    justify-content: flex-end;
    padding-right: 10px;
    
}

.listProjectHint {
    box-shadow: 0 2px 2px 0 rgba(60, 61, 79, 0.20);
	text-align: left;
    background: #3C3D4F;
    border-radius: 3px;
    padding: 15px 22px;
    
    width: 200px;
    bottom: 100%;
    right: -20px; 
    //margin-left: -73px; 
    
    
    visibility: hidden;
    position: absolute;
    z-index: 1;

}

.listProjectHint svg {
    position: absolute;
    right: 8%;
    bottom: -10px;
}

.morebuttons:hover .listProjectHint {
    visibility: visible;
}


.listProjectHint ul li a {
    color: #D8D8DB;
        display: block;
}
.listProjectHint ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.listProjectHint ul li {
    margin-bottom: 6px;
}
.listProjectHint ul li:last-child {
    margin-bottom: 0px;
}





.cardOfproject {
    background: #FFFFFF;
    border: 1px solid rgba(60,61,79,0.15);
    border-radius: 2px;
    margin-top: 32px;
    padding: 32px 67px;
}

.back svg {
    margin-right: 10px;
}

.back {
    color: #8e8f98;
    margin-bottom: 25px;
    display: block;
}
.back:hover {
    color: #8e8f98;
}

.ProjectTitle {
    font-size: 24px;
}

.projectsUsersBlock hr {
    margin: 14px 0;
    border-color: rgba(0,0,0,0.3);
}


.projectsUsersBlock h3 {
    font-size: 16px;
    margin: 0;
    margin-top: 43px;
}
.oneUser {
    display: flex;
    padding: 10px 0;
    border-bottom: 1px solid rgba(60, 61, 79, 0.30);
}
.oneUser:nth-child(2n) {
background-image: linear-gradient(-90deg, rgba(242, 244, 248, 0.3) 8%, rgba(225, 230, 238, 0.3) 100%);
}
.oneUser:last-child{
	border: none;
}
.oneUser div {
    margin: auto 0;
}
.oneUser p {
    margin: 0 20px;
}
.oneUser div:last-child {
margin-left: auto;
    
}
.userPosotion {
    color: #3C3D4F;
    text-transform: capitalize;
    width: 150px;
    display: flex;
    justify-content: space-between;
    padding-right: 10px;
}
.userPosotion p{
	margin-right: 10px;
	    margin-left: 0;
}
.userPosotion svg{
	float: right;
	cursor: pointer;
}




.noPhoto {
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 7px;
    background: #000;
    color: #fff;
    text-transform: uppercase;
    -moz-user-select: none;
}

.separator {
    border-color: rgba(60, 61, 79, 0.3);
        margin: 35px 0;
}
.projectPageTitle {
    margin-top: 0;
    margin-bottom: 32px;
    font-size: 20px;
    
}

.socBlock h4 svg {
    margin-right: 10px;
    vertical-align: bottom;
    height: 20px;
}

.socBlock h4 {
    margin: 0;
    margin-bottom: 18px;
}
.socBlock p span {
    color: rgba(0,0,0,0.5);
    margin-right: 2px;
}


.socBlock p {
    font-size: 15px;
    color: #000;
}
.socInstagram p span {
    width: 120px;
    display: inline-block;
}

input.inputTitleOfProject {
    background: #FFFFFF;
    border: 1px solid rgba(60,61,79,0.30);
    width: 100%;
    padding: 10px 15px;
    font-size: 15px;
    outline: none;
}

.blockHint svg {
    width: 50px;
    margin-right: 5px;
}


.blockHint {
    display: flex;
    color: rgba(60, 61, 79, 0.6);
}




.usersAddBlock {
    margin-top: 15px;
}


.usersAddBlock svg {
    vertical-align: bottom;
    margin-left: 7px;
}

.usersAddBlock a {
	text-decoration: none!important;
	cursor: pointer;
    margin-right: 40px;
    font-weight: 100;
    font-size: 16px;
    line-height: 20px;
    height: 20px;
    display: inline-block;
    outline: none;
}

.socBlock input {
    width: 250px;
    background: #FFFFFF;
    border: 1px solid rgba(60,61,79,0.30);
    padding: 8px;
    outline: none;
    font-size: 15px;
    margin-bottom: 15px;
}
.input-box {
    position: relative;
    display: flex;
}
.input-box p {
    position: absolute;
    top: 9px;
    left: 10px;
    color: rgba(0, 0, 0, 0.5);
}
.input-box label {
    position: absolute;
    top: 9px;
    left: 10px;
    color: rgba(0, 0, 0, 0.5);
    font-weight: 100;
    margin: 0;
    font-size: 15px;
}
.socBlock input.inputVk {
    padding-left: 61px;
}
.socBlock input.inputFb {
    padding-left: 109px;
}
.hintUnderInput {
    color: rgba(60, 61, 79, 0.6);
}
.hint_right {
    margin-left: 20px;
    display: flex;
    color: rgba(60, 61, 79, 0.6);
    max-width: 253px;
}
.hint_right svg{
	margin-right: 10px;
}
.socBlock input.wrongData{
	background: rgba(208, 2, 27, 0.09);
    border-color: #D0021B;
}


#popupAddClient {
	background: white;
	text-align: left;
	width: 327px;
	margin: 40px auto;
	position: relative;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

form.addClientForm {
    padding: 17px 29px 56px 29px;
}

.addClientForm .standart-button{
	margin: 0;
}
.addClientForm h3 {
    font-size: 16px;
    margin: 0;
    margin-bottom: 27px;
}



form.addClientForm input {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid rgba(60,61,79,0.30);
    padding: 8px;
    outline: none;
    font-size: 15px;
    margin-bottom: 18px;
}




#popupAddUsers {
	background: white;
	border: 1px solid rgba(60, 61, 79, 0.15);
	text-align: left;
	width: 860px;
	margin: 40px auto;
	position: relative;
}


.my-mfp-zoom-in .zoom-anim-dialog {
	opacity: 0;

	-webkit-transition: all 0.2s ease-in-out; 
	-moz-transition: all 0.2s ease-in-out; 
	-o-transition: all 0.2s ease-in-out; 
	transition: all 0.2s ease-in-out; 



	-webkit-transform: scale(0.8); 
	-moz-transform: scale(0.8); 
	-ms-transform: scale(0.8); 
	-o-transform: scale(0.8); 
	transform: scale(0.8); 
}

/* animate in */
.my-mfp-zoom-in.mfp-ready .zoom-anim-dialog {
	opacity: 1;

	-webkit-transform: scale(1); 
	-moz-transform: scale(1); 
	-ms-transform: scale(1); 
	-o-transform: scale(1); 
	transform: scale(1); 
}

/* animate out */
.my-mfp-zoom-in.mfp-removing .zoom-anim-dialog {
	-webkit-transform: scale(0.8); 
	-moz-transform: scale(0.8); 
	-ms-transform: scale(0.8); 
	-o-transform: scale(0.8); 
	transform: scale(0.8); 

	opacity: 0;
}

/* Dark overlay, start state */
.my-mfp-zoom-in.mfp-bg {
	opacity: 0;
	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-zoom-in.mfp-ready.mfp-bg {
	opacity: 0.8;
}
/* animate out */
.my-mfp-zoom-in.mfp-removing.mfp-bg {
	opacity: 0;
}



/**
 * Fade-move animation for second dialog
 */

/* at start */
.my-mfp-slide-bottom .zoom-anim-dialog {
	opacity: 0;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-moz-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-ms-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-o-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );

}

/* animate in */
.my-mfp-slide-bottom.mfp-ready .zoom-anim-dialog {
	opacity: 1;
	-webkit-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-moz-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-ms-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-o-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
}

/* animate out */
.my-mfp-slide-bottom.mfp-removing .zoom-anim-dialog {
	opacity: 0;

	-webkit-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-moz-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-ms-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-o-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
}

/* Dark overlay, start state */
.my-mfp-slide-bottom.mfp-bg {
	opacity: 0;

	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-slide-bottom.mfp-ready.mfp-bg {
	opacity: 0.8;
}
/* animate out */
.my-mfp-slide-bottom.mfp-removing.mfp-bg {
	opacity: 0;
}

.modal-cross{
	background:url('data:image/svg+xml,<svg width="15px" height="15px" viewBox="0 0 15 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch --><desc>Created with Sketch.</desc><defs></defs><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.699999988"><g id="New_Project_Modal_window" transform="translate(-1299.000000, -408.000000)" fill-rule="nonzero" fill="#181821"><g id="Modal_Window" transform="translate(470.000000, 392.000000)"><polygon id="Shape" points="844 17.5 842.5 16 836.5 22 830.5 16 829 17.5 835 23.5 829 29.5 830.5 31 836.5 25 842.5 31 844 29.5 838 23.5"></polygon></g></g></g></svg>') no-repeat center center!important;
}

#popupAddClient .modal-cross{
	background:url('data:image/svg+xml,<svg width="15px" height="15px" viewBox="0 0 15 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch --> <desc>Created with Sketch.</desc> <defs></defs> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.699999988"> <g id="New_Project_Modal_window_add_client" transform="translate(-972.000000, -712.000000)" fill-rule="nonzero" fill="#FFFFFF"> <g id="Modal_Window_v2" transform="translate(677.000000, 696.000000)"> <polygon id="Shape" points="310 17.5 308.5 16 302.5 22 296.5 16 295 17.5 301 23.5 295 29.5 296.5 31 302.5 25 308.5 31 310 29.5 304 23.5"></polygon> </g> </g> </g> </svg>') no-repeat center center!important;
}





.contentOfPopUp {
    height: 600px;
    display: flex;
}
.left-column, .right-column{
	width:50%;
	position: relative;
	
}

.titleOfColumn {
    padding: 46px 23px 0px 23px;
}
.titleOfColumn h3{
	margin: 0;
    color: #3C3D4F;
    font-size: 16px;
	
}
.left-column {
    border-right: 1px solid rgba(60, 61, 79, 0.30);
    height: 600px;
    
    overflow-y: scroll;
}

.listOfUsers {

}

.searchBox input {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #E1E6EE;
    border-radius: 4px;
    outline: none;
    padding: 5px 30px 5px 10px;
}

.searchBox {
    margin: 19px 0;
    position: relative;
}

.searchBox svg {
    position: absolute;
    top: 9px;
    right: 9px;
}

.buttonsBlock {
    position: absolute;
    width: 100%;
    padding: 19px 38px;
        bottom: 0;
        display: flex;
    justify-content: space-between;
}
.buttonsBlock .standart-button {
    margin: 0;
    width: 190px;
}

.clear {
    margin: auto 0;
    color: rgba(60, 61, 79, 0.30);
    font-size: 16px;
    font-weight: 100;
    cursor: pointer;
}
.listOfUsers .oneUser, .listOfUsersCheck .oneUser {
    padding-left: 23px;
    border: none;
    cursor: pointer;
    transition:0.3s;
}

.listOfUsers .oneUser span, .listOfUsersCheck .oneUser span {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.3);
}
.listOfUsers .deleteThisUser{
	display: none;
}

.deleteThisUser {
    padding-right: 23px;
}
.users .deleteThisUser{
	padding: 0;
}
.listOfUsers .oneUser p, .listOfUsersCheck .oneUser p {
    margin: 0 20px;
    line-height: 14px;
    font-size: 14px;
}

.listOfUsersCheck {
    max-height: 420px;
    margin-top: 20px;
    overflow-y: scroll;
}

.listOfUsers .oneUser .userName, .listOfUsersCheck .oneUser .userName {
    margin: auto 10px;
    line-height: 13px;
}
.listOfUsers .oneUser:hover, .listOfUsersCheck .oneUser:hover{
	background: #F2F4F8;
}


.blockLetter {
    padding: 20px 23px 5px 23px;
    font-size: 20px;
}



/*******************************************************
Slider B-flat
*******************************************************/
.checkbox-slider--b-flat {
  position: relative;
}
.checkbox-slider--b-flat input {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 0%;
  margin: 0 0;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
}
.checkbox-slider--b-flat input + span {
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.checkbox-slider--b-flat input + span:before {
  position: absolute;
  left: 0px;
  display: inline-block;
}
.checkbox-slider--b-flat input + span > h4 {
  display: inline;
}
.checkbox-slider--b-flat input + span {
  padding-left: 40px;
}
.checkbox-slider--b-flat input + span:before {
  content: "";
  height: 20px;
  width: 40px;
  background: rgba(100, 100, 100, 0.2);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.8);
  transition: background 0.2s ease-out;
}
.checkbox-slider--b-flat input + span:after {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 0px;
  top: 0;
  display: block;
  background: #ffffff;
  transition: margin-left 0.1s ease-in-out;
  text-align: center;
  font-weight: bold;
  content: "";
}
.checkbox-slider--b-flat input:checked + span:after {
  margin-left: 20px;
  content: "";
}
.checkbox-slider--b-flat input:checked + span:before {
  transition: background 0.2s ease-in;
}
.checkbox-slider--b-flat input + span {
  padding-left: 40px;
}
.checkbox-slider--b-flat input + span:before {
  border-radius: 20px;
  width: 40px;
}
.checkbox-slider--b-flat input + span:after {
  background: #ffffff;
  content: "";
  width: 20px;
  border: solid transparent 2px;
  background-clip: padding-box;
  border-radius: 20px;
}
.checkbox-slider--b-flat input:not(:checked) + span:after {
  -webkit-animation: popOut ease-in 0.3s normal;
          animation: popOut ease-in 0.3s normal;
}
.checkbox-slider--b-flat input:checked + span:after {
  content: "";
  margin-left: 20px;
  border: solid transparent 2px;
  background-clip: padding-box;
  -webkit-animation: popIn ease-in 0.3s normal;
          animation: popIn ease-in 0.3s normal;
}
.checkbox-slider--b-flat input:checked + span:before {
  background: #5cb85c;
}
.checkbox-slider--b-flat.checkbox-slider-md input + span:before {
  border-radius: 30px;
}
.checkbox-slider--b-flat.checkbox-slider-md input + span:after {
  border-radius: 30px;
}
.checkbox-slider--b-flat.checkbox-slider-lg input + span:before {
  border-radius: 40px;
}
.checkbox-slider--b-flat.checkbox-slider-lg input + span:after {
  border-radius: 40px;
}
.checkbox-slider--b-flat input + span:before {
  box-shadow: none;
}

/*#####*/
.checkbox-slider-info.checkbox-slider--b input:checked + span:before,
.checkbox-slider-info.checkbox-slider--b-flat input:checked + span:before,
.checkbox-slider-info.checkbox-slider--c input:checked + span:before,
.checkbox-slider-info.checkbox-slider--c-weight input:checked + span:before {
  background: #5bc0de;
}


.checkbox-slider-warning.checkbox-slider--b input:checked + span:before,
.checkbox-slider-warning.checkbox-slider--b-flat input:checked + span:before,
.checkbox-slider-warning.checkbox-slider--c input:checked + span:before,
.checkbox-slider-warning.checkbox-slider--c-weight input:checked + span:before {
  background: #f0ad4e;
}

.checkbox-slider-danger.checkbox-slider--b input:checked + span:before,
.checkbox-slider-danger.checkbox-slider--b-flat input:checked + span:before,
.checkbox-slider-danger.checkbox-slider--c input:checked + span:before,
.checkbox-slider-danger.checkbox-slider--c-weight input:checked + span:before {
  background: #d9534f;
}

/*******************************************************
Sizes
*******************************************************/
.checkbox-slider-sm {
  line-height: 10px;
}
.checkbox-slider-sm input + span {
  padding-left: 20px;
}
.checkbox-slider-sm input + span:before {
  width: 20px;
}
.checkbox-slider-sm input + span:after,
.checkbox-slider-sm input + span:before {
  height: 10px;
  line-height: 10px;
}
.checkbox-slider-sm input + span:after {
  width: 10px;
  vertical-align: middle;
}
.checkbox-slider-sm input:checked + span:after {
  margin-left: 10px;
}
.checkbox-slider-md {
  line-height: 30px;
}
.checkbox-slider-md input + span {
  padding-left: 70px;
  color: #c1c1c1;
}
.checkbox-slider-md input + span:before {
  width: 60px;
}
.checkbox-slider-md input + span:after,
.checkbox-slider-md input + span:before {
  height: 30px;
  line-height: 30px;
}
.checkbox-slider-md input + span:after {
  width: 30px;
  vertical-align: middle;
}
.checkbox-slider-md input:checked + span:after {
  margin-left: 30px;
}
.checkbox-slider-lg {
  line-height: 40px;
}
.checkbox-slider-lg input + span {
  padding-left: 80px;
}
.checkbox-slider-lg input + span:before {
  width: 80px;
}
.checkbox-slider-lg input + span:after,
.checkbox-slider-lg input + span:before {
  height: 40px;
  line-height: 40px;
}
.checkbox-slider-lg input + span:after {
  width: 40px;
 }



.checkbox__input {
  position: absolute;
  top: 4px;
  left: 0;
  width: 16px;
  height: 16px;
  opacity: 0;
  z-index: 0;
}
.checkbox__label {
  display: block;
  padding: 0 0 0 24px;
  cursor: pointer;
}
.checkbox__label:before {
  content: '';
  position: absolute;

      top: 17px;
    left: 10px;
  width: 16px;
  height: 16px;
  background-color: transparent;
  border: 1px solid #E1E6EE;
  z-index: 1;
  -webkit-transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition-property: background-color, border-color;
  transition-property: background-color, border-color;
}
.checkbox__label:after {
  content: '';
  position: absolute;

      top: 18px;
    left: 15px;
  width: 6px;
  height: 12px;
  border-bottom: 2px solid transparent;
  border-right: 2px solid transparent;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  z-index: 2;
  -webkit-transition: border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  transition: border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}
.checkbox__input:checked + .checkbox__label:before {
      background-color: #fff;
  //border-color: #fafbfc;
}
.checkbox__input:checked + .checkbox__label:after {
  border-color: #00BCD6;