.all_seo_text { float: right; padding: 0 13px 0 7px; position: relative; height: 16px; display: block; &:before { width: 7px; height: 4px; background: url(../images/ico-all/arrow-down-small.png) 50% 50% no-repeat; content: ''; position: absolute; top: 50%; margin-top: -2px; right: 0; @include Transition(0.3) } &.show { &:before { @include Rotate(180); } } } .posts-line-wr div { overflow: hidden; } .posts-line-wr div span { width: 100%; height: 12px; border-bottom: 1px solid $seo-border; display: block; } .seo-text { $mTop:19 + px; margin-bottom: 8px; max-height: 359px; overflow: hidden; position: relative; @include Transition(0.4); &:before { content: ''; display: block; position: absolute; bottom: 0; right: 0; left: 0; height: 45px; background: -moz-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,0)),color-stop(100%,#fff)); background: -webkit-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%); background: -o-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%); background: -ms-linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%); background: linear-gradient(top,rgba(255,255,255,0) 0,#fff 100%); } h1 { font-size: 18px; font-weight: 700; margin-top: $mTop; } h2 { font-size: 16px; font-weight: 700; margin-top: $mTop; } h3 { font-size: 15px; font-weight: 700; margin-top: $mTop; } p { margin-top: $mTop; } ul, ol { margin-top: $mTop; } ol { list-style: inherit; list-style-type: decimal; li { list-style-position: inside; } } ul { li { padding-left: 12px; position: relative; &:before { content: ''; display: block; $H:6; width: $H + px; height: $H + px; position: absolute; left: 0; top: 50%; margin-top: -($H/2) + px; background: $ulColor; border-radius: 100%; } } } &.show { max-height: 1500px; &:before { display: none; } } } @media (max-width: 992px) { .seo-text { max-height: 227px; } } @media (max-width: 767px) { .seo-text { max-height: 259px; } }