.ts-fab-tab, ul.ts-fab-list li { box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24); transition: all .3s cubic-bezier(.25, .8, .25, 1) } .latest-see-all, .ts-fab-pure-button .text_over, .ts-fab-wrapper a { text-decoration: underline } .ts-fab-tabs, .ts-fab-text, .ts-fab-wrapper, .white_grace { position: relative } ul.ts-fab-list li { background-color: rgba(233, 233, 233, .32); padding: 5px!important; border-radius: 10px 10px 0 0; list-style: none !important; background-image: none !important; } ul.ts-fab-list li.active { background-color: #333; color: #FFF } ul.ts-fab-list li.ts-fab-bio-link.active { background-position: -279px 8px } ul.ts-fab-list li.ts-fab-bio-link { background-position: 8px 8px; } ul.ts-fab-list li.ts-fab-latest-posts-link.active { background-position: -280px -192px } ul.ts-fab-list li.ts-fab-latest-posts-link { background-position: 8px -192px } .ts-fab-wrapper { max-width: 700px; margin: 1em; clear: both } .ts-fab-wrapper img { border: none!important } .ts-fab-list { overflow: hidden; margin: 0!important; padding: 0!important } .ts-fab-list li { background-color: #333; border-color: #333; display: block; float: left; clear: none; list-style: none!important; margin: 0 5px 0 0!important; padding: 0!important } .ts-fab-list li:before { display: none!important } .ts-fab-list li.active a { background-color: #333; color: #fff; border-color: #333 } .ts-fab-pure-button, .ts-fab-pure-button:hover { color: inherit } .ts-fab-list li.ts-fab-bio-link a { background-position: 8px 8px; background-repeat: no-repeat; padding-left: 27px } .ts-fab-list li.ts-fab-bio-link.active a { background-position: -279px 8px; background-repeat: no-repeat; padding-left: 27px } .ts-fab-list li.ts-fab-twitter-link a { background-position: 8px -42px; background-repeat: no-repeat; padding-left: 35px } .ts-fab-list li.ts-fab-twitter-link.active a { background-position: -270px -42px; background-repeat: no-repeat; padding-left: 35px } .ts-fab-list li.ts-fab-facebook-link a { background-position: 8px -92px; background-repeat: no-repeat; padding-left: 23px } .ts-fab-list li.ts-fab-facebook-link.active a { background-position: -284px -92px; background-repeat: no-repeat; padding-left: 23px } .ts-fab-list li.ts-fab-googleplus-link a { background-position: 8px -142px; background-repeat: no-repeat; padding-left: 30px } .ts-fab-list li.ts-fab-googleplus-link.active a { background-position: -276px -142px; background-repeat: no-repeat; padding-left: 30px } .ts-fab-list li.ts-fab-latest-posts-link a { background-position: 8px -192px; background-repeat: no-repeat; padding-left: 27px } .ts-fab-list li.ts-fab-latest-posts-link.active a { background-position: -280px -192px; background-repeat: no-repeat; padding-left: 27px } .ts-fab-widget .ts-fab-list li a { text-indent: -9999em; padding: 8px 12px!important } .ts-fab-widget .ts-fab-list li.ts-fab-bio-link a { width: 4px } .ts-fab-widget .ts-fab-list li.ts-fab-twitter-link a { width: 12px } .ts-fab-widget .ts-fab-list li.ts-fab-googleplus-link a { width: 8px } .ts-fab-widget .ts-fab-list li.ts-fab-facebook-link a { width: 0 } .ts-fab-widget .ts-fab-list li.ts-fab-latest-posts-link a { width: 4px } .ts-fab-tab { padding: 12px 0 12px 12px; overflow: hidden border: none !important; } .ts-fab-content { padding: 0 1em 0 0 } .ts-tab:first-child { display: block } .ts-fab-widget .ts-fab-tab { padding: 8px } .ts-fab-avatar { display: block; float: left; width: 80px; margin-right: 5px } div.ts-fab-avatar>img { border-radius: 50% } .ts-fab-no-float .ts-fab-avatar { float: none; margin: 0 0 12px } .ts-fab-text { line-height: 1.5; display: inline-block; width: calc(100% - 5.625rem) } .ts-fab-no-float .ts-fab-text { margin-left: 0 } .ts-fab-avatar>img { width: 80px; max-width: 100%!important } .ts-fab-header { font-size: 1.2em; font-weight: 600 } .ts-fab-text h4 { clear: none!important; font-size: 18px; line-height: 1!important; font-weight: 700; margin: 0 0 .2em!important; padding: 0 } .ts-fab-description, .ts-fab-latest li span, .ts-fab-twitter-time { font-size: 12px } .ts-fab-follow { margin-top: 10px } .ts-fab-social-links { margin: 5px 0 0; text-align: center } .ts-fab-social-links a { display: inline-block; margin: 0 1px; opacity: .5; transition: opacity .2s; -moz-transition: opacity .2s; -webkit-transition: opacity .2s; -o-transition: opacity .2s } .ts-fab-social-links a:hover { opacity: 1 } .ts-fab-latest { margin: 0!important; padding: 0!important } .ts-fab-latest li { list-style: none!important; line-height: 1.2; margin: 0 0 .6em!important; clear: none!important; white-space: nowrap } .white_grace { background-image: url(../images/white_grace.png); width: 25px; height: 20px; float: right } .latest-see-all { font-weight: 400; float: left } .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute!important; left: -9999px } @media (max-width:480px) { .ts-fab-header { font-size: 1.2em } .ts-fab-tabs { position: relative } } .ts-fab-pure-button { background: 0 0; border: 0; box-sizing: border-box; box-shadow: inset 0 0 0 1px #ccc; font-size: .9em; font-weight: 300; padding: .7em; text-align: center; position: relative; vertical-align: middle; cursor: pointer; float: right; -webkit-transition: color 1.25s; transition: color 1.25s } .ts-fab-pure-button::before, .ts-fab-pure-button::after { box-sizing: border-box; content: ''; position: absolute; width: 100%; height: 100% } .ts-fab-pure-button::after, .ts-fab-pure-button::before { border: 1px solid transparent; width: 0; height: 0 } .ts-fab-pure-button::before { top: 0; left: 0 } .ts-fab-pure-button::after { bottom: 0; right: 0 } .ts-fab-pure-button:hover::after, .ts-fab-pure-button:hover::before { width: 100%; height: 100% } .ts-fab-pure-button:hover::before { border-top-color: #777; border-right-color: #777; -webkit-transition: width .25s ease-out, height .25s ease-out .25s; transition: width .25s ease-out, height .25s ease-out .25s } .ts-fab-pure-button:hover::after { border-bottom-color: #777; border-left-color: #777; -webkit-transition: border-color 0s ease-out .5s, width .25s ease-out .5s, height .25s ease-out .75s; transition: border-color 0s ease-out .5s, width .25s ease-out .5s, height .25s ease-out .75s } .ts-fab-pure-button .text_under { text-decoration: none!important; display: block; font-size: .7em; color: #333 } .ts-fab-text-no-auth { display: flex; align-items: center; justify-content: space-between } .text_image { float: left; width: 70% } .text_image:before { content: "Хотите пополнить команду авторов этого сайта?"; font-size: .9em; float: left } .text_image:after { content: "Проходите тесты – начинайте писать и зарабатывать на этом."; font-size: .9em; float: left } .text_under:before { content: "Мастерская контента \"Моника\"" } @media screen and (max-width:900px) { .text_image { float: none; width: 100%; text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column } .ts-fab-pure-button { float: none } .ts-fab-text-no-auth { flex-direction: column } .text_image:after, .text_image:before { font-size: 1em } }