﻿@charset "UTF-8";
@import url('bootstrap/bootstrap.css');
@import url('fonts.css');

html,
body {
	width     : 100%;
	height    : 100%;
	overflow-x: hidden
}

ul, ol {
	margin      : 0;
	padding-left: 0.5rem
}

form dl {
	width   : 100%;
	display : table;
	padding : 5px 10px;
	border-bottom: 1px solid #fff
}

form dt {
	width         : 25%;
	display       : table-cell;
	vertical-align: middle
}

form dd {
	width         : 60%;
	display       : table-cell;
	vertical-align: middle
}

label.error,
label sup {
	color: red
}

label.error {
	color     : red;
	font-size : 12px;
	margin-top: -8px;
}

input[type='url']:focus::placeholder,
input[type='tel']:focus::placeholder,
input[type='file']:focus::placeholder,
input[type='text']:focus::placeholder,
input[type='email']:focus::placeholder,
input[type='number']:focus::placeholder,
input[type='search']:focus::placeholder,
input[type='password']:focus::placeholder, 
textarea:focus::placeholder {
	opacity: 0
}

input[type="text"]:required.error,
input[type="search"]:required.error,
input[type="number"]:required.error,
input[type="password"]:required.error,
input[type="email"]:required.error,
input[type="tel"]:required.error,
select:required.error,
textarea:required.error {
	border: solid 1px rgb(255, 0, 0); color : rgba(245, 9, 9, 0.932);
}

input.error::-webkit-input-placeholder {
	color  : red !important;
	opacity: 1.0;
}

input.error::-moz-placeholder {
	color  : red !important;
	opacity: 1.0;
}

input.error:-ms-input-placeholder {
	color  : red !important;
	opacity: 1.0;
}

textarea.error::-webkit-input-placeholder {
	color  : red !important;
	opacity: 1.0;
}

textarea.error::-moz-input-placeholder {
	color  : red !important;
	opacity: 1.0;
}

textarea.error::-ms-input-placeholder {
	opacity: 1.0;
	color  : red !important;
}

input[type="checkbox"],
input[type="radio"] {
	-moz-appearance   : none;
	-webkit-appearance: none;
	-ms-appearance    : none;
	appearance        : none;
	display           : block;
	float             : left;
	margin-right      : -2em;
	opacity           : 0;
	width             : 1em;
	z-index           : -1;
}

input[type="checkbox"]+label,
input[type="radio"]+label {
	text-decoration: none;
	color          : #646464;
	cursor         : pointer;
	display        : inline-block;
	font-size      : 1em;
	font-weight    : 400;

	position: relative;

	width         : 1.6em;
	height        : 1.6em;
	display       : inline-block;
	background    : #fff;
	border        : solid 1px #ced4da;
	vertical-align: middle;
}

input[type="checkbox"]+label:before,
input[type="radio"]+label:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing : antialiased;

	font-style    : normal;
	font-variant  : normal;
	text-rendering: auto;
	line-height   : 1;
	text-transform: none !important;
	font-family   : 'FontAwesome';
	font-weight   : 400;
}

input[type="checkbox"]+label:before,
input[type="radio"]+label:before {

	content    : '';
	display    : inline-block;
	font-size  : 1.05em;
	top        : 0;
	left       : 0;
	right      : 0;
	line-height: 1.45em;
	position   : absolute;
	text-align : center;
}

input[type="checkbox"]:checked+label:before {
	*background : #0d6efd;
	border-color: #3c3b3b;
	*color      : #ffffff;
	color       : #3c3b3b;
	content     : '\f00c';
}

input[type="radio"]:checked+label:before {
	content: '\f111';
}

input[type="checkbox"]:focus+label:before,
input[type="radio"]:focus+label:before {
	border-color: #0d6efd;
}

input[type="radio"]+label {
	border-radius: 100%;
}

.tab-pane .modal-body {
	padding: 0;
}

.tab-pane .modal-footer {
	padding         : 0;
	text-align      : left;
	background-color: #fff;
	border-top      : 0px
}

/**/
table.users>thead>tr>th:first-child,
table.users>thead>tr>th:last-child,
table.users>tbody>tr>td:first-child,
table.users>tbody>tr>td:last-child {
	width     : 2rem;
	text-align: center;
	height    : 31px;
}

table.users>thead>tr>th,
table.users>tbody>tr>td {
	vertical-align: baseline;
}

table.users>thead>tr>th:nth-child(3) {
	width: 200px;
}

table.users>thead>tr>th:nth-child(4) {
	width: 160px;
}

table.users>thead>tr>th:nth-child(5) {
	width: 35px
}

table.users>tbody>tr>td:nth-child(5) {
	padding: 1px 6px;
}

table.users>tbody>tr>td:nth-child(5)>figure {
	margin    : 1px;
	width     : 40px;
	height    : 40px;
	*overflow : hidden;
	background: url('../img/ajax-loader.gif') 50% 50% no-repeat;
}

table.users>tbody>tr>td:nth-child(5)>figure>img {
	z-index   : 10;
	width     : 100%;
	height    : 100%;
	object-fit: cover;
	position  : relative;

	-webkit-transform: scale(1.0);
	-moz-transform   : scale(1.0);
	-o-transform     : scale(1.0);
	transform        : scale(1.0);

	-webkit-transition-duration: 0.3s;
	/*Webkit                   : длительность анимации*/
	-moz-transition-duration   : 0.3s;
	/*Mozilla                  : длительность анимации*/
	-o-transition-duration     : 0.3s;
	/*Opera                    : длительность анимации*/
	transition-duration        : 0.3s;
}

table.users>tbody>tr>td:nth-child(5)>figure>img:hover {
	-webkit-transform: scale(1.25);
	/*Webkit         : увеличиваем размер до 1.2x*/
	-moz-transform   : scale(1.25);
	/*Mozilla        : масштабирование*/
	-o-transform     : scale(1.25);
	/*Opera          : масштабирование*/
	transform        : scale(1.25);

	-webkit-box-shadow: 0 0 5px #999;
	-moz-box-shadow   : 0 0 5px #999;
	-o-box-shadow     : 0 0 5px #999;
	box-shadow        : 0 0 5px #999;
}

#srcImage {
	width    : 100%;
	height   : auto;
	max-width: 200px;
}

.objectFit {
	width        : 100%;
	height       : 100%;
	object-fit   : cover;
	-o-object-fit: cover;
}

.labelFile>input[type="file"] {
	width   : .1px;
	height  : .1px;
	opacity : 0;
	overflow: hidden;
	position: absolute;
	z-index : -1
}

#xhrStatus {
	padding    : 4px;
	line-height: 1.5;
	display    : inline-block;
}

.labelFile>.icon:before {
	content: "\f093"
}

.labelFile>.icon.value:before {
	content: "\f00c";
	*color  : green
}

#showOverlay:empty {
	height    : 0;
	opacity   : 0;
	width     : auto;
	display   : none;
	background: none;
}

#showOverlay {
	top       : 0;
	left      : 0;
	bottom    : 0;
	width     : 100%;
	height    : 100%;
	z-index   : 1000;
	opacity   : 1;
	display   : block;
	position  : fixed;
	background: rgba(0, 0, 0, 0.7)
}

.fullscreen-pic:empty {
	height    : 0;
	display   : none;
	background: none
}

.fullscreen-pic {
	top       : 0;
	left      : 0;
	bottom    : 0;
	width     : 100%;
	height    : 100%;
	z-index   : 1000;
	position  : fixed;
	background: rgba(0, 0, 0, 0.7)
}

.fullscreen-pic-inner {
	width          : 100%;
	height         : 100%;
	display        : flex;
	align-items    : center;
	flex-direction : column;
	justify-content: center;
}

#fullscreen-pic-img {
	width     : auto;
	height    : auto;
	transition: 0.3s;
	max-height: 100%;
	animation : zoom linear 0.5s;
}

@keyframes zoom {
	from {
		transform: scale(0)
	}

	to {
		transform: scale(1)
	}
}

@keyframes fade {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.fullscreen-pic-caption:empty {
	width     : 0;
	padding   : 0;
	display   : none;
	background: none
}

.fullscreen-pic-caption {
	color     : #FFF;
	width     : 100%;
	text-align: center;
	font-size : 14px;
	padding   : 15px;
	animation : fade linear 0.5s;
	bottom    : 0;
	left      : 0;
	position  : absolute;
	background: rgba(0, 0, 0, 0.4);
}

.fullscreen-pic-close {
	cursor         : pointer;
	position       : absolute;
	color          : #FFFFFF;
	font-size      : 54px;
	font-weight    : 600;
	top            : 0;
	right          : 30px;
	transition     : 0.8s;
	text-decoration: none;
}