@CHARSET "UTF-8";
.index h1 { text-align: center; }
.index .authors-little { float: left; width: 40%; margin-bottom: 30px; }
.index .authors-little.class { margin-right: 2%; width: 58%; }
.index .authors-little.class .col { float: left; width: 50%; }
.index .slog { line-height: 23px; margin: 32px auto 20px; max-width: 720px }
.index .wh-bl.std.big.authors-little .hdr { padding: 20px; }
.index .authors-little .author .name { font-size: 18px; }
.index .orange-bt { border-bottom: dashed 1px #f1f1f1; height: 20px; text-align: center; padding: 12px 0; }

.adv2{
	display:block;
	justify-content:center;
	align-items:center;
	margin:30px auto;
	max-width: 1000px;
}
@media screen and (max-width: 900px) { .index .authors-little.class .col { float: none; width: 100%; }
.index .authors-little.class,
.index .authors-little { width: 49%; }
}
@media screen and (max-width: 700px) { .index .authors-little.class, .index .authors-little { width: 100%; margin-right: 0; }
}
@media screen and (max-width: 660px) { .index h1, .index .slog { display: none; }
}

/* Others 2021 */
.nbtn {display: flex; align-items: center; text-decoration: none; border: 2px solid #eae9e9; line-height: 1; padding: 8px 12px; margin-bottom: 8px; border-radius: 3px; cursor: pointer;}
.nbtn svg {display: block; flex-shrink: 0; width: 24px; margin-right: 10px; fill: #3b5998}
.nbtn.subs:before {content: ''; display: inline-block; width: 24px; height: 24px; background-image: url('/content/images/bell-off.svg'); background-size: cover; flex-shrink: 0; margin-right: 10px;}
.nbtn.subs:hover:before {background-image: url('/content/images/bell-off2.svg')}
.nbtn.subs.active:before {background-image: url('/content/images/bell-on.svg');}
.nbtn:hover {color: #FF876E; border-color: #FF876E}
.nbtn:hover svg {fill: #FF876E}
.edit-btn {display: inline-block; text-decoration: none; border: 2px solid #f1f1f1; padding: 12px 24px; margin-bottom: 20px; border-radius: 21px; line-height: 1;}
.edit-btn:hover {color: #fff; background-color: #3b5998; border-color: #3b5998}

.alert {display: block; background-color: #ffe7e2;  padding: 20px 24px; border-radius: 4px; margin-bottom: 20px; line-height: 1.5;position: relative;}
.alert.answer-ok {background-color: #4caf50; color: #fff}
.alert-title {font-size: 20px; margin-bottom: 0px; font-family: "Bitter",Arial,serif; }
.alert-subtitle {color: #ff876e;}
.alert-subtitle span {font-weight: bold;}
.admin-block {display: block; margin-bottom: 20px;}
.alert a {
	display: inline-block;
	position: relative;
	right: 0;
	bottom: 0;
}
.alert.answer-ok a{
	color: #ffffff;
}
.alert.answer-ok a:hover{
	color: #ff876e;
}
a.admin-btn {display: block; font-size: 14px; font-family: 'Open Sans', sans-serif; text-decoration: none; text-align: center; background-color: #045398; color: #fff; padding: 10px 20px; border-radius: 4px; }
a.admin-btn:hover {color: #fff; background-color: #ff876e;}

/* Header 2021 */
.header-top {display: flex; justify-content: space-between; align-items: center; height: 72px;}
.header-logo {margin-bottom: 12px;}
.icon-item {display: inline-block; width: 24px; height: 24px; margin-left: 20px; position: relative}
span.icon-count {display: inline-block; padding: 1px 2px 2px; font-weight: 600; color: #fff; font-size: 10px; background-color: #FF876E; border-radius: 4px; position: absolute; top: -6px; left: 2px;}
.icon-item svg {fill: #262C37}
.icon-item:hover svg {fill: #3b5998}
.header-search {display: flex; align-items:center; justify-content: space-between; width: 100%; max-width: 560px; background-color: #F7F7F7; border: 2px solid #F7F7F7; height: 40px; box-sizing: border-box; padding: 0px 12px 0px 0px}
.header-search input[type="text"] {display: block; border: 0; line-height: 36px; height: 100%; width:calc(100% - 48px); box-shadow: none; padding-left: 12px }
.header-search input[type="text"]:focus {background-color: #fff}
.header-search button {border: 0; cursor: pointer} 
.header-search button svg {fill: #b8b7b7;} 
.header-search button:hover svg {fill: #262C37;} 
.m-header {display: flex; align-items: center; justify-content: space-between;}
.m-search, .header-mlogo {display: none;}
.menu-list {display: flex; justify-content: space-between;}
.header-menu-right li:nth-child(1):before {content: ''; display: inline-block; width: 2px; height: 16px; border-radius: 1px; background-color: rgba(255,255,255,0.4); margin-right: 14px; transform: translateY(3px);}


/* Стихи по темам */
.themes-list {display: flex; flex-wrap: wrap;}
.themes-list > a {display: block; width: calc(25% - 12px); margin: 0 16px 16px 0; padding: 24px; text-align: center; box-sizing: border-box; background-color: #fff; box-shadow: 0px 1px 10px 0px #f1f1f1; text-decoration: none;}
.themes-list > a:nth-child(4n) {margin-right: 0px;}
.themes-list > a h3 {margin-top: 12px}

/* Стих */
.poem-btns-wrap {display: flex; justify-content: center; border-top: 2px solid #f7f7f7; margin-top: 16px;}
.poem-btn {display: block; width: 24px; height: 24px; flex-shrink: 0; margin: 20px 12px; cursor: pointer; }
.poem-btn:hover svg {fill: #FF876E}

@media only screen and (max-width: 500px){
	.poem-btn {margin: 20px 5px;}
}

/* Пагинация */
.pagenavigator {display: flex; justify-content: center; padding: 20px 0;}
body .pagenavigator span a, body .pagenavigator span.page-active {display: block; flex-shrink: 0; width: 48px; height: 48px; background-color: #f1f1f1; margin: 6px; padding: 0; text-align: center; line-height: 48px; border-radius: 24px; color: #fff; font-size: 16px; box-sizing: border-box; text-decoration: none;}
body .pagenavigator span a {color: #888}
body .pagenavigator span.page-active, body .pagenavigator span a:hover {border: 2px solid #f1f1f1; background-color: #fff; color: #888; line-height: 44px;}

.container { width: 100%; max-width: 1020px; margin: 0 auto; padding: 0 20px; box-sizing: border-box}
#footer {margin-top: 40px; color: #fff; padding-top: 32px; border-top: solid 1px #f1f1f1; }
#footer, #footer .links a { color: #444; }
.footer-wrap {display: flex; justify-content: space-between;}
#footer .links {display: flex; flex-wrap: wrap;}
#footer .links a { text-decoration: none; display: inline-block; margin-right: 13px; }
#footer .links a:hover {color: #FF876E}

.dev {display: block; text-align: center; margin: 0 auto; padding: 32px 0; text-decoration: none; color: gray;}
.dev img {display: block; width: 165px; margin: 0 auto 6px;}
.dev p {font-size: 12px;}
.copyright {display: block; padding-left: 20px; border-left: 2px solid #f1f1f1}

.nopoem,
.addpoem.addpoembtn,
.adminn,
.add-poem-review.abs { position: fixed; bottom: 0; right: 10px; padding: 8px 14px; background: #419adf; color: #fff; border-radius: 5px 5px 0px 0px; cursor: pointer; text-align: center; }
.add-poem-review.abs { line-height: 18px; }
.addpoem.addpoembtn,
.add-poem-review.abs { right: 220px; background: #ef6c00; }
.addpoembtn:hover,
.add-poem-review.abs:hover { background: #ca5f08; }
.nopoem:hover,
.adminn:hover { background: #4172df; }
.nopoem-wrap,
.addpoem-wrap { width: 450px !important; }
.adminn-wrap { width: 560px !important; }
.nopoem-wrap .s-inp,
.addpoem-wrap .s-inp,
.adminn-wrap .s-inp { width: 100%; }
.nopoem-wrap .comment,
.addpoem-wrap .comment,
.adminn-wrap .comment { height: 52px; }
.scrollup { position: fixed; display: none; bottom: 100px; right: 10px; padding: 18px 14px; background: rgba(170, 170, 170, 0.5); border-radius: 5px; cursor: pointer; }

@media screen and (max-width: 1020px) {
	#footer {padding-top: 0}
	#footer .links {flex-direction: column; margin-bottom: 30px}
	#footer .links a {display: block; margin: 0; padding: 16px; border-bottom: 1px solid #f1f1f1; position: relative;}
	/*#footer .links a:after {content: ''; display: block; box-sizing: border-box; width: 12px; height: 12px; border-width: 6px; border-style: solid; border-color: transparent transparent transparent green; position: absolute; right: 12px; top: 12px;}*/
	#footer .links a:after {content: '›'; position: absolute; right: 15px; top: 6px; font-size: 30px; font-weight: 400; }
	.footer-wrap {flex-direction: column;}
	.copyright {border: none; padding: 0; text-align: center;}
	.dev {padding: 24px 0;}
}

@media screen and (max-width: 700px) { 
	.adminn-wrap { width: 96% !important; box-sizing: border-box; }
	#header .m-menu { display: block; width: auto;}
	#header .menu-con { background: #eee; width: 100%; padding: 0; background: #3b5998; }
	#header .menu li {border-top: 1px solid #6c85b9; text-align: center; }
	#header .menu li a { width: 100%; display: block; }
	#header .menu li:hover { background: #999; }
	#header .menu { display: none; }
}
@media screen and (max-width: 600px) {
	.nopoem-wrap, .addpoem-wrap { width: 96% !important; box-sizing: border-box; }
	.scrollup { bottom: 50px; }
	#footer .counts { display: none; }
}
@media screen and (max-width: 500px) { 
	#header.log { text-align: center; }
	#header.log .logo { float: none; background-color: gray; margin: 12px auto; }
	#header.log .top-right { display: inline-block; float: none; }
}

@media screen and (max-width: 959px) {
	.header-search {max-width: 360px}
	.filter .f-item {display: block}
	.filter .f-name {margin: 0 0 10px 0}
	.poems-list .poem .author {width: 124px}
	.poems-list .poem .mets {width: 100px}
	.one-author .author-info {flex-wrap: wrap}
	.one-author .author-desc {flex: auto; padding: 8px 0 0 24px; width: calc(100% - 200px); box-sizing: border-box; }
	.one-author.custom .author-stat .item { width: 25%; margin-bottom: 12px}
	.one-author.custom .author-stat .item:nth-child(4n) {border: 0}
	/* Стихи по темам */
	.themes-list > a, .themes-list > a:nth-child(4n) {width: calc(33.3% - 12px); margin-right: 18px;}
	.themes-list > a:nth-child(3n) {margin-right: 0px;}
}
@media screen and (max-width: 768px) {
	.filter {flex-direction: column;}
	.filter .f-item {border-right: 0!important; border-bottom: 2px solid #fff; padding: 12px 16px;}
}

@media screen and (max-width: 700px) {
	h1 {text-align: center; line-height: 1.25}
	.container {max-width: calc(100% - 32px); padding: 0;}
	.socials {text-align: center}
	.index .wh-bl.std.big.authors-little .hdr {padding: 20px; text-align: center; }
	.hdr h1 {text-align: center; line-height: 1.25; margin: 0}
	#crumbs {text-align: center}
	.submenu a { border: 2px solid #eaeaea; margin: 2px; border-radius: 4px; padding: 2px 10px; font-size: 14px;}
	.fantom-handler.submenu a {border: 0}
	.submenu.main-sub a.att {border-color: #FF876E}

	/* Шапка */
	.header-logo {display: none;}
	.m-header {height: 48px}
	.m-search, .header-mlogo {display: initial;}
	#header {display: flex; flex-direction: column;}
	#header > .container { max-width: 100%; width: 100%; padding: 0; box-shadow: 0 3px 10px rgba(81,96,126,.1);}
	#header .menu-wrap {order: 1}
	#header .addmenu-wrap {order: 2; margin: 0;}
	#header .header-top {order: 3; flex-direction: column; height: auto;}
	.header-search {display: none; margin: 10px 0}
	.header-search.active {display: flex;}
	.icon-wrap {margin: 10px 0}
	.menu-list {flex-direction: column}
	.icon-item {margin: 0 10px}
	.header-menu-right li:nth-child(1):before {display: none}
	
	/* Пагинация */
	body .pagenavigator span a, body .pagenavigator span.page-active {width: 28px; margin: 3px; font-size: 14px; }

	/* Стихи по темам */
	.themes-list > a, .themes-list > a:nth-child(3n), .themes-list > a:nth-child(4n) {width: 100%; margin: 0 0 8px 0; position: relative}
	a.themes-list-item {display: flex; align-items: center;  padding: 12px;}
	a.themes-list-item h3 {margin: 0; font-size: 16px}
	a.themes-list-item img {width: 56px; margin: 0 12px 0 0;}
	.themes-list > a:after {content: '›'; position: absolute; right: 23px; top: 23px; font-size: 30px;}

	/* Страница автора */
	.autor-btns {width: 100%;}
	.one-author .author-desc {padding: 0; text-align: left; margin-bottom: 12px;}
	.one-author .author-info .photo .admin-edit {top: auto; bottom: 24px;}
	.one-author .author-info .photo {margin-bottom: 12px; }
	.one-author.custom .author-stat .item {width: 50%;border-right: 2px dotted #eae9e9;}
	.one-author.custom .author-stat .item:nth-child(2n) {border: 0}
	.one-author.custom .hdr.u-views {flex-direction: column}
	.one-author.custom .u-views .details {width: 100%; border: 2px solid #f7f7f7; text-align: center; line-height: 40px; border-radius: 4px; text-transform: uppercase; margin-top: 12px;}
	.one-author.custom .u-views .it-wrap {justify-content: space-between; margin-top: 12px;}
	.one-author.custom .u-views .it {flex-direction: column; width: calc(33% - 3px); border: 2px solid #f1f1f1; box-sizing: border-box;}
	.one-author .poems-list .poem .name .val {padding: 0; margin: 0}
	.one-author .poems-list .poem {position: relative; padding: 16px 60px 16px 16px}
	.one-author .poems-list .poem .name img {position: absolute; right: 16px; top: 16px; margin-right: 0;}
	
	/* Современники */
	.author-block.top {padding: 18px 0}
	.author-block.top > div {flex-direction: column}
	.author-block.top .banner {margin: 0 0 12px;}
	.author-block.top .banner:last-child {margin: 0;}
	.poems-list .poem {flex-wrap: wrap; padding: 16px;}
	.poems-list .poem .ol-num {font-size: 16px; margin-bottom: 10px}
	.poems-list .poem .name {flex: calc(100% - 24px); padding: 0; font-size: 16px; margin-bottom: 10px; font-weight: 600}
	.poems-list .poem .author {width: 32px}
	.poems-list .poem .mets {width: 100px}
	.poems-list .poem .mets .score, .poems-list .poem .mets .comm, .poems-list .poem .mets .views {display: flex; align-items: center;}
	.poems-list .poem .mets .score span.elm, .poems-list .poem .mets .comm span.elm, .poems-list .poem .mets .views span.elm {margin-right: 4px}
	.poems-list .poem .mets {width: calc(100% - 36px);}
	.poems-list .poem .mets .elm-eye-blue,
	.poems-list .poem .mets .elm-star-blue,
	.poems-list .poem .mets .elm-comment-blue {width: 16px; height: 16px}

	/* Разное */
	.hdr.sort {justify-content: center}
	.hdr.sort select {margin-top: 12px}
	.column-wrap {padding: 16px;}
	.author-poems .one-column { width: 100%;}
	.edit-btn {margin: -8px auto 20px; display: block; width: 100px;}
	.one-author.custom .author-stat .item { width: 33%; float: left; text-align: center; }
}

@media screen and (max-width: 460px) {
	.one-author.custom .author-stat .item { width: 50%; }
}