/*Reset*/
* {
	padding: 0;
	margin: 0;
	border: 0;
}

*,
*:before,
*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

:focus,
:active {
	outline: none;
}

a:focus,
a:active {
	outline: none;
}

nav,
footer,
header,
aside {
	display: block;
}

html,
body {
	height: 100%;
	width: 100%;
	font-size: 100%;
	line-height: 1;
	font-size: 14px;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

input,
button,
textarea {
	font-family: inherit;
}

input::-ms-clear {
	display: none;
}

button {
	cursor: pointer;
}

button::-moz-focus-inner {
	padding: 0;
	border: 0;
}

a,
a:visited {
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

ul li {
	list-style: none;
}

img {
	vertical-align: top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: inherit;
	font-weight: 400;
}

/*--------------------*/

/* Fonts */
@font-face {
	font-family: 'Montserrat Light';
	src: url('/fonts/Montserrat-Light.eot');
	src: local('Montserrat Light'), local('Montserrat-Light'),
		url('/fonts/Montserrat-Light.eot?#iefix') format('embedded-opentype'),
		url('/fonts/Montserrat-Light.woff') format('woff'),
		url('/fonts/Montserrat-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat Medium';
	src: url('/fonts/Montserrat-Medium.eot');
	src: local('Montserrat-Medium'), local('Montserrat-Medium'),
		url('/fonts/Montserrat-Medium.eot?#iefix') format('embedded-opentype'),
		url('/fonts/Montserrat-Medium.woff') format('woff'),
		url('/fonts/Montserrat-Medium.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat Bold';
	src: url('/fonts/Montserrat-Bold.eot');
	src: local('Montserrat Bold'), local('Montserrat-Bold'),
		url('/fonts/Montserrat-Bold.eot?#iefix') format('embedded-opentype'),
		url('/fonts/Montserrat-Bold.woff') format('woff'),
		url('/fonts/Montserrat-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

/*--------------------*/


body {
	font-family: 'Montserrat Medium';
	font-size: calc(0.5vw + 3px);
	line-height: 1.3;
	color: #111111;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Montserrat Bold';
	font-size: calc(1.1vw + 16px);
	line-height: 1.3;
}

textarea,
select,
input{
	padding:10px;
	background-color:#f6f6f6;
	border-radius:5px;
	-webkit-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.1) inset;
	-moz-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.1) inset;
	box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.1) inset;
	width:100%;
	margin:10px 0;
	transition-duration:.3s;
}

textarea:focus,
select:focus,
input:focus{
	background-color:#fff;
	-webkit-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.1) inset;
	-moz-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.1) inset;
	box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.1) inset;
	transition-duration:.3s;
}

.checkbox{
	background-color:#fff;
	width:30px;
	box-shadow:0px 0px 8px 0px rgba(255, 255, 255, 0.1) inset;
}


.button__submit{
	padding:10px 15px;
	background-color:#54BD77;
	border-radius:5px;
	color:#fff;
	transition-duration:.3s;
}

.button__submit:hover{
	background-color:#031B77;
	transition-duration:.3s;
}

.button__submit2{
	padding:10px 15px;
	background-color:#2DC177;
	border-radius:5px;
	color:#fff;
	transition-duration:.3s;
}

.button__submit2:hover{
	background-color:#5FE86C;
	transition-duration:.3s;
}

.button__warning{
	padding:10px 15px;
	background-color:#EB483C;
	border-radius:5px;
	color:#fff;
	transition-duration:.3s;
}

.button__warning:hover{
	background-color:#EB6158;
	transition-duration:.3s;
}

.button__dop{
	padding:10px 15px;
	background-color:#F6F6F6;
	border-radius:5px;
	color:#111;
	transition-duration:.3s;
}
.button__dop:hover{
	background-color:#ccc;
	transition-duration:.3s;
}

.sub__btn{
	padding:5px 10px;
}

.ht{
	font-family: 'Montserrat Bold';
	font-size: calc(0.8vw + 4px);
	line-height: 1.5;
	color: #111111;
}

#clients_table_container a,
.bread__crumbs a{
	color:#111111;
	border-bottom:1px dashed transparent;
	transition-duration:.3s;
}

#clients_table_container a:hover,
.bread__crumbs a:hover{
	color:#62BADD;
	border-bottom:1px dashed #62BADD;
}

.login__screan{
	position:relative;
	top:0;
	left:0;
	bottom:0;
	right:0;
	background:linear-gradient(45deg, #1E0001, #700004, #8D0005);
	width:100%;
	min-height:100%;
	padding-top:10%;
	animation:loginscrean linear 15s infinite;
	background-size:300%;
}

@keyframes loginscrean{
	0%{
		background-position:0 50%;
	}
	50%{
		background-position:100% 50%;
	}
	100%{
		background-position:0 50%;
	}
}

.login__logo__count{
	position:absolute;
	top:5%;
	left:3%;
	width:8%;
}

.login__logo__img{
	width:100%;
}

.login__screan__count{
	width:35%;
	margin:0 auto;
	padding:3% 5%;
	background-color:#fff;
	border-radius:10px;
	-webkit-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
	-moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
	box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
}

.crm__info{
	position:absolute;
	bottom:2%;
	right:3%;
	color:#fff;
	font-size: calc(0.6vw + 2px);
}

.navbar{
	background:#1F2226;
	padding:10px;
}

.nav__container{
	width:70%;
	max-width:1600px;
	margin:0 auto;
	font-family:sans-serif;
	display:flex;
	justify-content:space-between;
	align-items:center;
	color:#fff;
}

.filters__tasks{
	display:grid;
	grid-template-columns:24% 24% 24% 24%;
	gap:1%;
}

.filters__tasks2{
	display:grid;
	grid-template-columns:19% 19% 19% 19% 19%;
	gap:1%;
}

.filters__button__count{
	padding-top:30px;
	text-align:center;
}

.clients__search{
	display:grid;
	grid-template-columns:89% 9%;
	gap:1%;
}

.bread__crumbs{
	background-color:#F6F6F6;
	padding:5px 10px;
	border-radius:5px;
}

.nav__breadcrumbs__body{
	display:flex;
	gap:6px
}

.task__edit__checkbox__grid{
	display:grid;
	grid-template-columns:25% 25% 25% 25%;
}

.task__edit__checkbox__grid input{
	background-color:#fff;
	width:30px;
	box-shadow:0px 0px 8px 0px rgba(255, 255, 255, 0.1) inset;
}

.navbar a{color:#fff; margin-right:15px; text-decoration:none;}
.navbar .user-block{display:flex; align-items:center; gap:10px;}
.navbar img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #fff;}


.container{width:80%;max-width:1650px;margin:0 auto;font-family:sans-serif;}
.nav{display:flex;gap:16px;margin-bottom:20px;}
.nav a{text-decoration:none;padding:8px 12px;border-radius:6px;background:#e7e7e7;color:#000;}
.nav .logout{background:#e53935;color:#fff;}
table{border-collapse:collapse;width:100%;}
td,th{border:1px solid #ddd;padding:8px;text-align:left;}
.gray { background: #f6f6f6; }    /* в работе */
.green { background: #2DC177; color:#fff; }   /* выполнена */
.red { background: #EB483C;color:#fff; }     /* просрочена */
.btn{padding:6px 12px;background:#4caf50;color:#fff;border:none;border-radius:4px;text-decoration:none;}
.nav { display:flex; gap:16px; margin-bottom:20px; }
.nav a { text-decoration:none; padding:8px 12px; border-radius:6px; background:#e7e7e7; }
.nav .logout { background:#e53935;color:#fff; }