/* Theme Name: Hypnosis Theme URI: https://goodwinpress.ru/hypnosis Author: GoodwinPress Author URI: http://www.goodwinpress.ru Description: Hypnosis (Гипнозис) - новая адаптивная тема, предназначенная для ведения блога на WordPress. Ячейки анонсов созданы при помощи Masonry. Вывод анонсов в 3 или 4 колонки. Форматы постов - стандартный, аудио, видео, цитата. Отключаемый сайдбар в блоге и публикациях. Посчет просмотра публикаций и создание рейтинга популярных записей в виде встроенного виджета. Встроенный виджет для соц. кнопок с подсказками. Возможность создать статическую страницу с masonry-галереей. Бесконечная прокрутка или постраничная навигация, на выбор. Липкое меню. Похожие записи. Кнопки для расшаривания (интегрирован скрипт share42). Возможность изменять цвета шаблона из консоли. Встроенный загрузчик плагинов. Отличное мобильное меню. Древовидные комментарии с навигацией. Встроенная блокировка replytocom. Встроенная блокировка REST API. Отключаемый прелоадер. Готова к локализации. Version: 1.2 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: gpprime */ /* * Таблица стилей содержит: * * 01 Обнуление стилей браузера 02 Вспомогательные селекторы 03 body 04 Предзагрузка 05 Основной контейнер 06 Шапка 07 Заголовок сайта / логотип 08 Основная колонка и сайдбар 09 Главное меню 10 Поиск в шапке 11 Мобильное меню 12 Masonry в блоге 13 Masonry на статической главной 14 Текстовый блок на статической главной 15 Бесконечная прокрутка 16 Хлебные крошки 17 Информация о публикации 18 post format - цитата 19 Страница вложения 20 Заголовки 21 Архивы 22 Публикации и страницы 23 Кнопки 24 Виджеты сайдбара 25 Списки 26 Подвал 27 Оформление изображений 28 Постраничная навигация 29 Кнопка вверх 30 Комментарии 31 Похожие записи 32 Расшаривание записей (share42.com/ru) 33 Виджет Популярные записи 34 Виджет Социальные кнопки 35 Всплывающие подсказки 36 Адаптивные стили * */ @import url("css/jquery.mmenu.css"); /* 01 Обнуление стилей браузера*/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}body{line-height:1}strong{font-weight:700}em,i{font-style:italic}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}.clear{clear:both;display:block;content:" ";height:0;visibility:hidden}img,video,object,embed,iframe{max-width:100%}img{height:auto}p{margin-bottom:15px}p:last-child{margin-bottom:0}img{border:0}a{transition:all .2s linear;-o-transition:all .2s linear;-moz-transition:all .2s linear;-webkit-transition:all .2s linear}.aligncenter{display:block;margin:0 auto 20px}.alignleft{float:left}.alignright{float:right} /* 02 Вспомогательные селекторы (таблица, жирность, ссылки, ввод, WC, CF7 */ html{font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; overflow-x:hidden} dl{margin:0 0 24px} dt{font-weight:bold} dd{margin-bottom:18px} strong{font-weight:bold} em, i{font-style:italic} big{font-size:131.25%} ins{text-decoration:none} blockquote{padding:30px 40px; margin:20px 0 25px 0; font-weight:400; display:block; background:#fcfcfc; box-shadow:0 0 1px #bbb; font-size:16px} abbr, acronym{border-bottom:1px dotted #666; cursor:help} sup, sub{height:0; line-height:1; position:relative; vertical-align:baseline} sup{bottom:1ex} sub{top:.5ex} input, textarea{color:#888; font-size:16px; border:1px solid #fff; background:#f4f4f4; vertical-align:middle} pre{border:1px solid rgba(0,0,0,0.1); margin-bottom:24px; max-width:100%; overflow:auto; padding:12px; white-space:pre; white-space:pre-wrap; word-wrap:break-word} table{width:100%; margin:20px 0 40px} table th{color:#777; text-align:left; padding:15px 14px; font-size:16px; font-weight:bold; border:1px solid #eaeaea} table td{padding:13px 14px; border:1px solid #eaeaea; vertical-align:top} table tr:nth-of-type(even){background:#fff} table tr:nth-of-type(odd){background:#fafafa} a{ text-decoration:underline} a:hover{ text-decoration:underline; cursor:pointer} hr{display:block; width:100%; height:1px; background:#eee; margin:30px auto; clear:both; border:0} input:focus{border:1px solid #ff6b6b} .woocommerce ul.products li.product .button{font-size:12px} .woocommerce ul.products li.product h3{height:120px; overflow:hidden} .woocommerce .product_meta span{display:block; margin-bottom:10px} .woocommerce .single_add_to_cart_button{display:block; float:left; margin:20px 0} .sr-box-list ul, sr-box-list li{padding:0!important; margin:0 !important} .wpcf7 input, .wpcf7 textarea{width:90%; padding:8px; color:#333; border:1px solid #ddd; background:#fff; margin-bottom:10px} .wpcf7 textarea{height:150px} /* 03 body */ body{font-family: Arial,sans-serif; font-weight:normal; font-size:16px; line-height:24px; word-wrap:break-word; background:#f4f4f4} /* 04 Предзагрузка */ #preloader{position:fixed; left:0; top:0; z-index:999; width:100%; height:100%; overflow:visible; background:#fff} #preloader .spinner{text-align:center; position:absolute; left:50%; margin-left:-45px; top:45%; width:80px; height:80px; font-size:52px} /* 05 Основной контейнер */ .wrap{width:100%; max-width:1400px; margin:110px auto 0} /* 06 Шапка */ .header{float:left; width:100%; margin:auto; padding:0 0 15px 0; position:fixed; top:0; left:0; right:0; z-index:1000; box-shadow:6px 6px 20px rgba(48,48,60,0.3)} .header-inner{width:96%; max-width:1400px; margin:auto; position:relative} /* 07 Заголовок сайта и логотип */ .logo{float:left} .logo h1, .logo span{font-family:'Roboto Condensed',Arial,sans-serif; font-size:24px; line-height:24px; font-weight:700; text-transform:uppercase; display:block; margin:0 60px 5px 0; padding-top:18px} .logo h1 a, .logo span a{ text-decoration:none} .logo h1.site-title, .logo span.site-title{display:inline-block; margin:13px 60px 0 0; text-indent:-9999px; padding:0} /* 08 Основная колонка и сайдбар */ .main-col{float:left; width:76%; position:relative} .sidebar{float:left; width:24%} #main-col-fullwidth{float:left; width:100%} /* 09 Главное меню */ .menunav{padding-top:20px; position:relative; z-index:1001} .menunav ul{ list-style-type:none; padding-right:40px} .menunav ul li{position:relative; display:inline; float:left; padding:0; z-index:101; line-height:18px; font-weight:400; font-size:14px; letter-spacing:1px; margin:3px 24px 10px 0} .menunav li a{ text-decoration:none} .menunav li a:hover{ text-decoration:underline} .menunav ul li ul{position:absolute; height:auto; top:20px; left:-20px; display:none; visibility:hidden; width:265px; padding:20px 0 10px 0} .menunav ul li ul li{float:none; padding:8px 0 8px 20px; display:block; } .menunav ul li ul li ul{top:0} * html .menunav{height:1%} .menunav ul li ul li ul{position:absolute; top:-23px; height:auto; left:265px; display:none; visibility:hidden; width:265px; padding:20px 0 10px 0} /* 10 Поиск в шапке */ .toggle-search{ font-size:18px; cursor:pointer; padding-top:21px; display:block; position:absolute; right:10px; top:0px} .search-expand{ display:none; z-index:100; position:absolute; top:53px; right:0; width:250px} .search-expand-inner{padding:10px} .search-expand input{width:96%; border:0; border-radius:0; padding:2%; font-size:13px; font-family:inherit; color:#777} /* 11 Мобильное меню */ #mob{width:40px; font-size:22px; text-decoration:none; text-transform:uppercase; text-align:center; font-weight:bold; position:absolute; top:0px; left:0; display:none} #mob a{ text-decoration:none; display:block; width:100%} #mobilemenu:not( .mm-menu ){ display:none} .mm-listview{font-size:16px} /* 12 Masonry в блоге*/ #masonry-grid{margin-bottom:60px} #masonry-grid:after{content:''; display:block; clear:both} .grid-item{float:left; background:#fff; box-shadow:1px 2px 15px #e5e5e5} .grid-item img:hover{opacity:.8} .grid-item-inner{padding:7% 8% 6%} /* 13 Masonry на статической главной */ .homepage-grid-item{float:left; width:23.5%; margin:0 1.5% 1.5% 0; box-shadow:1px 2px 15px #e5e5e5} .homepage-grid-item img{vertical-align:bottom} .homepage-grid-item p{display:block; position:absolute; bottom:0; width:100%; left:0; right:0; text-align:center; color:#fff; background:rgba(0,0,0,0.5); font-weight:bold; font-size:14px; opacity:0; padding:3% 0; transition:all 0.4s ease-in-out} .homepage-grid-item .img-wrap:hover p{opacity:1} .homepage-grid-item .img-wrap{width:100%; height:100%; overflow:hidden} .homepage-grid-item img{ -o-transform:scaleY(1); transform:scaleY(1); -o-transition:all 0.7s ease-in-out; transition:all 0.7s ease} .homepage-grid-item:hover img{-o-transform:scale(1.2); transform:scale(1.2)} .homepage-grid-item:hover img, .homepage-grid-item:hover p{ cursor:url(images/hover-plus.png),auto} /* 14 Текстовый блок на статической главной */ .home-text{width:90%; margin-bottom:40px} h2.home-title{font-size:20px; line-height:28px; display:inline-block; margin-bottom:25px; margin-top:0; padding-bottom:20px; position:relative} h2.home-title:after{display:block; content:''; height:3px; left:0; width:60px; bottom:0; position:absolute; } .italic p{font-style:italic; font-size:16px; font-family:Georgia,serif} /* 15 Бесконечная прокрутка */ .infinite-scroll-loader{ text-align:center; z-index:100; position:absolute; left:68%; margin-left:-64px; bottom:150px; width:80px; height:80px; font-size:52px; } .page-jump, #infscr-loading img{ display:none} #infscr-loading p{ position:absolute; bottom:-50px; left:64%; margin-left:-125px; font-family:'Roboto Condensed',Arial,sans-serif; font-size:30px; font-weight:700; color:#333} #main-col-fullwidth .infinite-scroll-loader{left:51%; margin-left:-54px} #main-col-fullwidth #infscr-loading p{left:50%} /* 16 Хлебные крошки */ .breadcrumbs{margin-bottom:8px; font-size:10px; line-height:18px; text-transform:uppercase; letter-spacing:1px} .breadcrumbs a{ text-decoration:none} .breadcrumbs a:hover{ text-decoration:underline} /* 17 Информация о публикации */ .entry-date{font-size:12px; color:#a6a6a6; display:block; margin:25px 0 0 0} .entry-date a{color:#a6a6a6; text-decoration:none} .entry-date a:hover{ text-decoration:underline} .entry .entry-date{margin-top:40px} /* 18 post format - цитата */ .gp-format-quote{ font-style:italic; font-size:16px; font-family:Georgia,serif} .gp-format-quote p{display:block; padding:25% 14%} .gp-format-quote a{ text-decoration:none} .gp-format-quote:hover{ transition:all .5s ease-out} .gp-format-quote span {display:block; text-align: right; margin-top: 20px; font-size: 13px; font-style: normal} /* 19 Страница вложения */ .attachment-blok{margin:90px auto 0; padding:5% 15% 10% 15%} .attachment-blok h3{font-size:16px; margin-bottom:15px; text-align:center} /* 20 Заголовки */ h1, h2, h3, h4, h5, h6{margin-bottom:20px; margin-top:35px; font-weight:700; line-height:125%; text-transform:uppercase; font-family:'Roboto Condensed',Arial,sans-serif} h1{font-size:28px} h2{font-size:26px} h3{font-size:24px} h4{font-size:22px} h5{font-size:20px} h6{font-size:18px} h1.post-title{font-size:30px; margin:20px 0 50px 0; padding-right:7%; padding-bottom:20px; position:relative} h2.post-title{font-size:20px; margin-bottom:20px; margin-top:0;padding-bottom:15px; position:relative} h1.post-title:after, h2.post-title:after{display:block; content:''; height:3px; width:60px; bottom:0; position:absolute; } h2.post-title a{text-decoration:none; } h2.post-title a:hover{ text-decoration:underline} /* 21 Архивы */ .arch-title, .search-title{font-family:'Roboto Condensed',Arial,sans-serif; font-size:18px; text-transform:uppercase; display:block; margin-bottom:24px; font-weight:700} h1.arch-title{font-family:'Roboto Condensed',Arial,sans-serif; font-size:18px; text-transform:uppercase; display:block; margin-bottom:24px; font-weight:700;margin-top:0;color:#fff;} .search-title{margin-bottom:0} .archive-desc{font-size:15px; line-height:22px} .archive-inner{padding:8%} /* 22 Публикации и страницы */ .entry{float:left; width:80%; padding:5% 9%; margin-bottom:50px; box-shadow:1px 2px 15px #e5e5e5; background:#fff} .entry404{margin:0px auto; text-align:center; width:70%; padding:5% 10%; box-shadow:1px 2px 15px #e5e5e5; background:#fff} .entry404 input{width:96%; margin-top:25px; border-radius:0; padding:2%; font-size:15px; font-family:inherit; color:#333; border:0; background:#f9f9f9; box-shadow:0 0 2px #aaa} .entry404 .fa{font-size:160px; margin-bottom:40px} /* 23 Кнопки */ a.btn, input[type="submit"].btn, .wpcf7 input[type="submit"]{ margin-top:25px; font-weight:700; width:100px; display:block; vertical-align:top; font-size:10px; line-height:1.65em; text-align:center; text-decoration:none; -webkit-appearance:none; outline:0; border:0; box-shadow:none; cursor:pointer; padding:8px 7px; transition:all .2s linear; text-transform:uppercase} .btn:hover, input[type="submit"].btn:hover, .wpcf7 input[type="submit"]:hover{ border:0} /* 24 Виджеты сайдбара */ .side-blok, .sidebar-widget{margin-bottom:25px; background:#fff; box-shadow:1px 2px 15px #e5e5e5; padding:10%} .side-title{font-size:12px; font-family:'Roboto Condensed',Arial,sans-serif; text-transform:uppercase; display:block; margin-bottom:20px; padding-bottom:12px; letter-spacing:0.5px; font-weight:700; border-bottom:1px solid #ddd} .side-blok a{ text-decoration:none} .side-blok a:hover, .post-col a:hover, .credits a:hover{ text-decoration:underline} .side-blok p a{ text-decoration:underline} .side-blok p a:hover{text-decoration:underline} .side-blok #calendar_wrap{width:100%; font-size:13px} .side-blok #wp-calendar th{color:#777; text-align:center; padding:4px; font-size:13px; font-weight:700; border:1px solid #eaeaea} .side-blok #wp-calendar td{padding:2px 3px; border:1px solid #eaeaea; text-align:center} /* 25 Списки */ ol{list-style:decimal; list-style-position:inside; margin:25px 0 35px 0px} ol li{margin:0; padding:0px 0 10px 20px} ol ol{list-style:upper-alpha} ol ol ol{list-style:lower-roman} ol ol ol ol{list-style:lower-alpha} .type-page ul, .post ul, .side-blok ul, .entry ul{margin:25px 0 35px 0; list-style-type:none} .type-page ul li, .post ul li, .side-blok ul li, .entry ul li{position:relative; padding:0px 0 10px 30px; margin-left:20px} .type-page ul li ul, .post ul li ul, .side-blok ul li ul, .entry ul li ul{margin-top:15px} .type-page ul li:before, .post ul li:before, .side-blok ul li:before, .entry ul li:before{ display:block; content:''; height:12px; width:12px; left:0; top:6px; position:absolute; border-radius:50%} .side-blok ul, .side-blok ol{margin:15px 0 0 0} .side-blok ul li, .side-blok ol li{margin-left:5px} /* 26 Подвал */ .footer{width:100%; margin:60px auto 0; position:relative; } .credits p{width:70%; margin:auto; text-align:center; display:block; font-size:12px; line-height:18px; padding:2% 0 1.5% 0} /* 27 Оформление изображений */ img.alignleft{float:left; margin:5px 35px 25px 0} img.aligncenter{display:block; margin-left:auto; margin-right:auto; margin-top:25px; margin-bottom:30px} .wp-caption{text-align:center; margin-bottom:15px; max-width:100%; height:auto} .wp-caption img{margin:0; padding:0; border:0 none} .wp-caption-text{font-size:13px; line-height:17px; padding:7px 5px; margin:0} .wp-caption.alignleft{float:left; margin:5px 30px 7px 0} .wp-caption.alignright{float:right; margin:5px 0 7px 30px} .wp-caption.aligncenter, .attachment img{display:block; margin-left:auto; margin-right:auto; margin-bottom:20px} img.alignright{float:right; margin:5px 0 25px 35px} .gallery{margin:40px auto 40px !important} .gallery-item{display:inline-block; padding:0 1% 1% 2%; text-align:center; vertical-align:top; width:100%} #gallery-1 img{border:none; border-radius:4px} .gallery .gallery-item img{border:none !important} .gallery-columns-2 .gallery-item{max-width:46%} .gallery-columns-3 .gallery-item{max-width:29%} .gallery-columns-4 .gallery-item{max-width:21%} .gallery-columns-5 .gallery-item{max-width:16%} .gallery-columns-6 .gallery-item{max-width:10%} .gallery-icon img{margin:0 auto} .gallery-caption{color:#707070; display:block; font-size:12px; padding:5px 10px} .img-attach{display:block; text-align:center; font-weight:700} /* 28 Постраничная навигация */ .nav-container{width:100%; max-width:1400px; margin:auto; position:relative} .wp-pagenavi{width:98%; font-size:16px; position:absolute; bottom:0px; left:0; padding-top:25px; border-top:1px solid #fff; color:#777} .wp-pagenavi a{padding:6px 10px; margin:2px 5px 2px 0; text-decoration:none; border:0; color:#777} .wp-pagenavi span.pages{padding:2px 4px; margin:2px 30px 20px 10px; border:0} .wp-pagenavi span.current{padding:6px 10px; margin:2px 5px 2px 0; border:0; color:#fff; border-radius:4px} .wp-pagenavi span.extend{padding:6px 10px; margin:2px 5px 2px 0; border:0} .wp-pagenavi a:hover{ color:#fff; border-radius:4px} /* 29 Кнопка вверх */ #backtop{display:none; position:fixed; padding:5px 6px 4px 6px; text-align:center; z-index:100; bottom:15px; right:15px; font-size:25px; color:#fff; font-weight:normal; background:rgba(51,51,51,0.4); border-radius:5px} #backtop:hover{background:rgba(51,51,51,0.9)} /* 30 Комментарии */ .comments-box{width:100%; float:left; position:relative; margin-top:10px} #respond{ margin: 0; padding:0} .comments-box.text{border:1px solid #93bab1; padding:2px; color:#666; width:200px} ol.commentlist{margin:30px 0 50px 0; padding:0} ol.commentlist li div.vcard cite.fn a.url:hover{text-decoration:none} ol.commentlist li{margin-top:20px; list-style-type:none; padding:0; margin-left:0} ol.commentlist li div.vcard cite.fn{font-weight:bold; font-size:14px; text-transform:uppercase} ol.commentlist li div.vcard cite.fn a.url{text-decoration:none} ol.commentlist li div.vcard img.avatar{float:left; margin:0 30px 0 0; border-radius:30px} ol.commentlist li div.commentmetadata{font-size:12px} ol.commentlist li div.comment-meta{margin:0 0 10px 0} ol.commentlist li div.comment-meta a{color:#7b7b7b; text-decoration:none} ol.commentlist li p{margin-left:90px} ol.commentlist li div.reply{margin-left:90px; font-size:12px; text-transform:uppercase; color:#ccc; font-weight:bold; cursor:pointer} ol.commentlist li div.reply a{color:#ccc; text-decoration:none} ol.commentlist li div.reply:hover{} ol.commentlist .parent{padding:5px 0 5px 0; border-bottom:1px dotted #ddd} ol.commentlist .parent li{margin-top:20px; border:none; padding:0} ol.children{margin:0} ol.children li{margin:20px 0 20px 30px} #comment{margin-bottom:30px} a.comment-edit-link{float:right} .comment-form label{color:#707070; font-size:12px; font-weight:bold; display:block; line-height:1.5; text-transform:uppercase; margin-bottom:10px} h3#reply-title, .comment-title{font-family:'Roboto Condensed',Arial,sans-serif; margin:10px auto 20px; font-size:22px; text-transform:uppercase; padding:20px 0 15px 0; display:block; font-weight:700} .comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"]{font-family:inherit; font-size:16px; width:90%; padding:5%; margin-bottom:10px; box-shadow:0 0 1px #555; background:#f9f9f9; border:0} .logged-in-as, .comment-notes, .comment-awaiting-moderation, .logged-in-as, .form-allowed-tags{color:#707070; font-size:15px; line-height:1.5; margin-bottom:20px; font-style:italic} .no-comments{color:#707070; font-weight:bold; padding-top:1.6em} .comment-navigation+.no-comments{border-top:0} .form-submit{margin-bottom:30px; clear:both} .required{color:#c0392b} .top-text .vcard{display:inline-block; margin-bottom:40px} #commentform textarea{font-family:inherit; height:150px; width:96%; box-shadow:0 0 1px #555; padding:2%; font-size:15px; line-height:24px; display:block; color:#333; background:#f9f9f9; float:left; border:0} #commentform input:focus, #commentform textarea:focus{background:#fff; -webkit-box-shadow:0 0 4px rgba(102,203,245,0.9); -moz-box-shadow:0 0 4px rgba(102,203,245,0.9); box-shadow:0 0 4px rgba(102,203,245,0.9)} a#cancel-comment-reply-link{display:block; font-size:12px; margin-top:15px; } .comment-form input[type="submit"]{ width:250px; display:block; vertical-align:top; border-radius:4px; font-size:16px; line-height:1.65em; text-align:center; text-decoration:none; color:#fff; -webkit-appearance:none; outline:0; border:0; box-shadow:none; cursor:pointer; padding:10px 12px; margin:30px auto; transition:all .2s linear} .comment-form input[type="submit"]:hover{ color:#fff} p.comment-form-author, p.comment-form-email, p.comment-form-url{width:31.33%; float:left; margin-left:3%; display:block} .comments-box .says{display:none} .comments-box .navigation{width:100%; margin:40px auto 40px; text-align:center; border-top:1px solid #eee; border-bottom:1px solid #eee; padding:20px 0} .comments-box .navigation .nav-previous{width:50%; float:left; text-align:left} .comments-box .navigation .nav-next{width:50%; float:right; text-align:right} .comments-box .navigation a{color:#bbb; text-decoration:none} .comments-box .navigation a:hover{ text-decoration:underline} ol.commentlist li #respond p.comment-form-author, ol.commentlist li #respond p.comment-form-email, ol.commentlist li #respond p.comment-form-url {width:31.33%; float:left; margin-left:3%} ol.commentlist li #respond p.comment-form-comment {margin-left: 0} p.comment-form-author, ol.commentlist li #respond p.comment-form-author{margin-left:0} /* 31 Похожие записи */ ul.related-posts{width:100%; float:left; padding-top:30px; margin:15px 0 15px 0; border-bottom:1px solid #e5e5e5; list-style:none} ul.related-posts li{width:23%; float:left; padding:0; margin-bottom:25px; margin-right:2%; margin-left:0} ul.related-posts li img{margin-bottom:12px; border-radius:4px} .related-title{font-size:19px; margin-bottom:20px; font-family:'Roboto Condensed',Arial,sans-serif; text-transform:uppercase; display:block; font-weight:700} .rel-post-title{margin-right:30px; font-size:13px; font-weight:bold; display:block; line-height:16px} ul.related-posts li a{text-decoration:none} ul.related-posts li a:hover{text-decoration:underline} ul.related-posts .img-alt{ border-radius:4px} ul.related-posts li img:hover{opacity:.8} .single ul.related-posts li:before{height:0; width:0; position:relative; background:none} /* 32 Расшаривание записей (share42.com/ru) */ .share-post{font-family:'Roboto Condensed',Arial,sans-serif; margin:35px auto 10px; padding:35px 0 10px 0; border-top:1px solid #eee; border-bottom:1px solid #eee} .share-post span{display:block; margin-bottom:20px; font-weight:bold; font-size:18px; text-transform:uppercase} /* 33 Виджет Популярные записи */ #content1 a{text-decoration:none} #content1 ul li{padding-left:0; list-style-type:none; margin-bottom:15px; font-size:14px; line-height:19px; font-weight:bold} #content1 img{float:left; margin:0 30px 15px 0; min-width:100px} #content1 img:hover{opacity:.8} #content1 span{display:block; margin-top:11px; font-size:12px; line-height:14px; font-weight:normal; color:#a6a6a6} #content1 li:after{ content:''; display:block; clear:both} #content1 a:hover{text-decoration:underline} /* 34 Виджет Социальные кнопки */ .social-bar{ text-align:center; box-shadow:1px 2px 15px #e5e5e5; background:#fff; padding:7%; margin-bottom:25px} .social-bar ul{list-style:none} .social-bar ul li{ float:left; margin:2% 0 2% 5%; width:10% } .social-bar .first{margin:2% 0 !important} .social-bar ul li a{width:100%; display:block; padding:4px 2px; font-size:14px; border-radius:4px; text-decoration:none; color:#fff; transition:all .3s linear} .social-bar:after{ content:''; display:block; clear:both} .vk{background:#4d7198} .fb{background:#3b5998} .tw{background:#14a1e8} .ig{background:#c7b5a1} .od{background:#F6881F} .gp{background:#cf322a} .yt{background:#a81a1e} .in{background:#0c62a6} .social-bar ul li:before{height:0; width:0; position:relative; background:none} /* 35 Всплывающие подсказки */ .tooltip{ position:relative; display:inline-block} .tooltip .tooltiptext{ visibility:hidden; width:80px; background:rgba(51,51,51,0.9); color:#fff; text-align:center; padding:5px 0; border-radius:4px; font-size:12px; position:absolute; z-index:1} .tooltip:hover .tooltiptext{ visibility:visible} .tooltip .tooltiptext::after{ content:""; position:absolute; top:100%; left:50%; margin-left:-5px; border-width:5px; border-style:solid; border-color: rgba(51,51,51,0.9) transparent transparent transparent} .tooltip .tooltiptext{ width:90px; bottom:120%; left:50%; margin-left:-45px} .tooltip .tooltiptext{ opacity:0; transition:opacity 1s} .tooltip:hover .tooltiptext{ opacity:1} /* 36 Адаптивные стили */ @media only screen and (max-width:1440px){ .wrap{width:94%} } @media only screen and (max-width:1280px){ body{ font-size:15px} .homepage-grid-item{width:31.5%} #content1 ul li{ font-size:13px; line-height:16px} #content1 img{ margin:0 20px 15px 0; min-width:90px} } @media only screen and (max-width:1160px){ .main-col{float:left; width:70%; position:relative} .sidebar{float:left; width:30%} .home-text{width:100%} #content1 ul li{ font-size:12px} .wp-pagenavi{font-size:14px} } @media only screen and (max-width:1024px){ body{ font-size:14px} .wrap{margin:0 auto} .header{ padding:14px 0} #menu{margin-left:-9999px; width:0; height:0; overflow:hidden} #mob{display:block} .sf-sub-indicator {display: none} .logo{text-align:center; float:none} .logo h1, .logo span{margin:0 auto; width:80%; padding:0} .logo h1.site-title, .logo span .site-title{margin:0 auto} .menunav{padding:0} .toggle-search{ top:-19px; right:10px} .header-inner{padding:0} .search-expand{ top:30px} .homepage-grid-item{width:47%; margin:0 1.5% 3% 1.5% } .main-col, .sidebar, #main-col-fullwidth{margin-top:90px} .comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"]{ font-size:14px} ul.related-posts li{width:48%; height:305px} .wp-pagenavi{ bottom:10px; border:0; text-align:center} .wp-pagenavi a.page, span.extend, a.last{display:none} .wp-pagenavi span.current{ background:none; color:#777} .wp-pagenavi a.nextpostslink, .wp-pagenavi a.previouspostslink{ border-radius:4px; background:#FF847C; color:#fff} .social-bar ul li a{font-size:14px; padding:3px 0} #content1 img{ margin:0 30px 15px 0; min-width:100px} .homepage-grid-item p {font-size: 12px} } @media only screen and (max-width:800px){ body{ font-size:16px} .wrap{width:90%} .main-col{width:100%; margin:90px auto 0} .sidebar{width:100%; margin-top:20px} .entry{ width:82%; padding:5% 9%; margin:0 0 7% 0 } .credits p{width:90%; font-size:13px; line-height:20px; padding:4% 0 2.5% 0} .social-bar ul li a{padding:7px 0; font-size:18px} #content1 ul li{ font-size:14px; line-height:18px} #infscr-loading p{ bottom:-30px; left:50%; margin-left:-125px; font-size:20px} h1{font-size:24px} h2{font-size:22px} h3{font-size:20px} h4{font-size:18px} h5{font-size:16px} h6{font-size:14px} ol.commentlist li p{margin-left:0; margin-top:20px} ol.commentlist li div.reply{margin-left:0} p.comment-form-email, p.comment-form-url{margin-left:0} p.comment-form-author,p.comment-form-email,p.comment-form-url{width:100%; float:left; margin-right:0; margin-bottom:10px} #commentform textarea{height:150px; width:96%; padding:2%} } @media only screen and (max-width:600px){ .logo h1,.logo span{ font-size:18px; line-height:22px} .entry{ width:82%} h1.post-title{font-size:20px; margin:20px 0 30px 0; padding-right:0} ul.related-posts li{ height:295px} .wp-pagenavi{ bottom:30px; padding-top:0} table{font-size:12px} table th, table td{padding:5px 6px} } @media only screen and (max-width:414px){ body{ font-size:14px} .wrap{width:80%} .mm-listview{font-size:13px} .breadcrumbs{ font-size:9px; line-height:18px} h2.post-title{font-size:18px} .entry{ width:82%; padding:9% 9%; margin:0 0 15% 0} table{font-size:11px} table th, table td{padding:5px 3px} ul.related-posts{padding-top:25px; margin:15px 0 0px 0} ul.related-posts li{width:95%; margin-bottom:20px; margin-right:5%} .related-title{font-size:18px; margin-bottom:25px; height:auto} .rel-post-title{margin-right:0; font-size:13px} h3#reply-title, .comment-title{margin:0 auto 15px; font-size:18px; padding:10px 0 15px 0} .logged-in-as, .comment-notes, .comment-awaiting-moderation, .logged-in-as, .form-allowed-tags{color:#707070; font-size:13px; line-height:18px; margin-bottom:25px} .comment-form input[type="submit"]{ width:200px; font-size:14px} .social-bar ul li a{padding:3px 0; font-size:15px} .wp-pagenavi{ bottom:10px; padding-top:0} #content1 img{float:none; margin:0 0 15px 0; text-align:center} #content1 a{display:block} #content1 span{margin:15px 0 20px 0} } @media only screen and (max-width:320px){ .wrap{width:88%} .entry-date{font-size:11px} .social-bar ul li a{padding:1px 0; font-size:14px} } /* Стили для навигации между частями */ .post-navigation{width: 100%; border-bottom: 1px solid #e6e6e6; border-top: 1px solid #e6e6e6; padding: 20px 0 13px; margin-bottom: 20px;} .nav-box-previous{float: left; width: 45%;} .img-wrap-left{float: left;} .link-left{float: right; width: 65%; font-size: 10px; line-height: 15px; padding-top: 5%;} .nav-box-next{float: right; width: 45%;} .link-left a{text-decoration: none; color: #1d1d1d; font-weight: bold; font-size: 15px;} .link-left span{color: #1d1d1d; font-weight: bold; font-size: 15px;} .nav-box-previous img, .nav-box-next img{border-radius: 3px;} .img-wrap-right{float: right;} .link-right{float: left; width: 65%; font-size: 10px; line-height: 15px; padding-top: 5%; text-align: right;} .link-right a{text-decoration: none; color: #1d1d1d; font-weight: bold; font-size: 15px;} /*Так же нужно прописать стили для конкретных разрешений экрана:*/ @media only screen and (max-width:1024px){ .nav-box-previous img, .nav-box-next img{width: 60px;} .link-left, .link-right{padding-top: 0;} .link-left a, .link-right a{font-size: 14px;} } @media only screen and (max-width:667px){ .link-left a, .link-right a{font-size: 14px; font-weight: normal;} } @media only screen and (max-width:414px){ .nav-box-previous {border-bottom: 1px solid #e6e6e6; padding-bottom: 13px; margin-bottom: 20px;} .nav-box-previous, .nav-box-next{float: none; width: 100%;} } span.post-title{ display: block; font-size: 20px; margin-bottom: 20px; margin-top: 0; padding-bottom: 15px; position: relative; font-weight: 700; line-height: 125%; text-transform: uppercase; font-family: 'Roboto Condensed',Arial,sans-serif; } span.post-title a { color: #1d1d1d; text-decoration: none; } span.post-title:after { background: #F38A8A; } span.post-title:after { display: block; content: ''; height: 3px; width: 60px; bottom: 0; position: absolute; }