@font-face
{
	font-family: web_spine;
	src: url('../fonts/web_spine.eot');
	src: url("../fonts/web_spine.eot?#iefix") format("embedded-opentype"), url("../fonts/web_spine.woff") format("woff"), url("../fonts/web_spine.ttf") format("truetype"), url("../fonts/web_spine.svg#web01") format("svg");
	font-weight: normal;
	font-style: normal;
}
body
{
	padding: 0;
	margin: 0;
}
body *
{
	font-family: web_spine, Arial;
	box-sizing: border-box;
}
a
{
	text-decoration: none;
	outline: none;
}
.header
{
	height: 15vh;
	color: #FFF;
	font: normal 8vh web_spine, Arial;
	line-height: 15vh;
	white-space: nowrap;
	margin: 0;
	border-top: 0;
	border-right: 0;
	border-left: 0;
	box-shadow: 0 0.1rem 0.1rem rgba(0,0,0,0.1);
}
.header a
{
	color: #FFF;
	display: block;
	position: relative;
	height: 100%;
}
.header b
{
	font-weight: normal;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 19vh;
}
.header a:before {
	content: "";
	width: 13vh;
	height: 13vh;
	background: url("data:image/svg+xml;charset=UTF-8,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='50px' height='50px' viewBox='0 0 50 50' enable-background='new 0 0 50 50' xml:space='preserve'%3e%3clinearGradient id='SVGID_1_' gradientUnits='userSpaceOnUse' x1='137.6621' y1='-209.9595' x2='187.6623' y2='-259.9597' gradientTransform='matrix(1 0 0 -1 -137.6602 -209.96)'%3e%3cstop offset='0' style='stop-color:%2300A8DE'/%3e%3cstop offset='1' style='stop-color:%230095D8'/%3e%3c/linearGradient%3e%3crect fill='url(%23SVGID_1_)' width='50' height='50'/%3e%3cpolygon fill='%23BADCEE' points='16.112,27.029 19.25,35.539 33.177,16.198 '/%3e%3cpolygon fill='%2389CFE4' points='19.594,28.921 19.293,35.626 26.644,29.394 '/%3e%3cpath fill='%23E8F5FB' d='M36.581,12.931L9.133,23.359c-0.775,0.295-0.756,1.399,0.03,1.665l7.078,2.392l16.118-10.402 L19.594,28.921l9.939,7.539c1.032,0.785,2.531,0.26,2.848-1l5.372-21.489C37.926,13.278,37.246,12.677,36.581,12.931z'/%3e%3c/svg%3e") 0 0 no-repeat;
	background-size: cover;
	position: absolute;
	left: 2vh;
	top: 50%;
	transform: translateY(-50%);
	border-radius: 50%;
	box-shadow: 0.2vh 0.2vh 0.2vh rgba(0,0,0,0.3);
}
table
{
	background: #f9f9f9;
	border-spacing: 0;
	width: 100%;
	position: relative;
	border-collapse: collapse;
	height: 100%;
}
table td
{
	border: 1px solid #c3c3c3;
}
.main_info
{
	vertical-align: middle;
	text-align: center;
	border-left: 0;
	border-right: 0;
}
.main_info a
{
	width: 29vh;
	height: 29vh;
	border-radius: 50%;
	border: 1px solid #e8e8e8;
	position: relative;
	display: inline-block;
}
.main_info a > span
{
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	height: 100%;
	border-radius: 50%;
	position: relative;
}
.main_info td.avatar
{
	height: 35vh;
}
.main_info .avatar
{
	width: 30%;
	border-left: 0;
}
.main_info .value
{
	height: 15vh;
	font-size: 6vh;
	font-weight: bold;
}
.main_info .value > span
{
	font-size: 4vh;
	display: block;
	color: #999;
	font-weight: normal;
}
.main_info .value
{
	width: 20%;
}
.view
{
	text-align: center;
	vertical-align: middle;
	border-right: 0;
}
.main_info > td:last-child
{
	border-right: 0;
}
.view > div
{
	min-height: 21vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 21vh;
}
.view a
{
	position: relative;
	margin: 0 auto;
	width: 64vw;
	display: block;
	height: 15vh;
	box-sizing: border-box;
	border-radius: 2vh;
	border-top-right-radius: 0;
	border-bottom-left-radius: 0;
	color: #FFF;
}
.view a > b
{
	font-size: 6vh;
	font-weight: normal;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.img
{
	height: 100%;
	position: relative;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.img .publications
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	position: relative;
	height: 100%;
	width: 100%;
}
.publications > div
{
	position: relative;
}
.publications > div > a
{
	box-shadow: 0 1px 0 rgba(0,0,0,0.3);
	display: block;
	position: absolute;
	box-sizing: border-box;
	padding: 1.5vh;
	top: 1.5vh;
	left: 1.5vh;
	right: 1.5vh;
	bottom: 1.5vh;
}
.publications > div > a:hover,
.avatar > a:hover,
.view > div > a:hover
{
	opacity: 0.7;
}
.publications > div > a > img
{
	display: block;
	height: 100%;
	width: 100%;
	border-top-left-radius: 1.5vh;
	border-bottom-right-radius: 1.5vh;
	position: relative;
	object-fit: cover;
}
.publications > div > a:before,
.main_info a:before
{
	content: 'Loading';
	font: normal 4vh web_spine;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #555;
}
html[lang=ru] .publications > div > a:before,
html[lang=ru] .main_info a:before
{
	content: 'Загрузка';
}
.x0, .x1 {width: 100%;}
.x2 {width: 50%;}
.x3 {width: 33%;}
.x4 {width: 25%;}

.img_loaded:before {
	display: none;
}
/*error*/
.error {
	text-align: center;
	vertical-align: middle;
}
.error > div {
	display: inline-block;
	box-shadow: 0 0 1rem 0 rgba(0,0,0,0.1);
	padding: 2vh;
}
.error > div > div {
	padding: 4vh;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
#error_icon {
	width: 12vh;
	height: 12vh;
	display: block;
	border-radius: 50%;
	box-shadow: 0.2vh 0.2vh 0.2vh rgba(0,0,0,0.3);
}
#error_text {
	font: normal 4.25vh web_spine, Arial;
	padding: 0 0 0 4vh;
}
/*END error*/
.h100vh {
	height: 100vh;
}
/*color*/
.header,
.view a
{
	background: #4e8ec6;/*#36a5d2;*/
}
.error > div {
	background: #FFF;
}
.error > div > div {
	background: #e9f3f7;
}
#error_icon {
	background: #b0d15f url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='60px' height='50px' viewBox='0 0 60 50' enable-background='new 0 0 60 50' xml:space='preserve'%3E%3Cpath fill='%23FFFFFF' d='M22.122 6.369h20.002l-8.023 15.937h8.023L28.111 46.262V28.294h-5.989V6.369z'/%3E%3C/svg%3E") center center no-repeat;
	background-size: contain;
}
#error_text {
	color: #333;
}
/*color*/