Advertisement
sierre

Blog Post Template - CSS only

Mar 30th, 2022
56
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 3.66 KB | None | 0 0
  1. // Ticket #17725
  2. // CSS ONLY
  3.  
  4. // File: /themes/isipp/style.css
  5. // line: 1078 - 1266
  6.  
  7. .news-item {
  8.     float: left;
  9.     width: 33.33%;
  10.     padding-left: 15px;
  11.     padding-right: 15px;
  12.     min-height: 560px;
  13.     margin-bottom: 50px;
  14.     text-align: left;
  15. }
  16.  
  17. .news-item img{
  18.     width: 100%;
  19.     max-width: 100%;
  20.     height: 100%;;
  21. }
  22.  
  23. .news-item a{
  24.     display: block;
  25. }
  26.  
  27. .blog-grid-title{
  28.     font-size: 18px;
  29.     background: #caac5f;
  30.     padding: 30px 15px 20px;
  31. }
  32.  
  33. .news-item h2{
  34.     font-size: 20px;
  35.     color: #456d74;
  36.     margin: 0;
  37.     background: #caac5f;
  38.     height: 43px;
  39.     font-size: 18px;
  40.     overflow-y: hidden;
  41. }
  42.  
  43. .news-item .content{
  44.     text-align: justify;
  45.     font-size: 18px;
  46.     /*background: #caac5f;*/
  47.     color: #666666;
  48.     /*padding: 0 15px;*/
  49.     height: 78px;
  50.     overflow: hidden;
  51.     margin-top: -1px;
  52. }
  53.  
  54. .news-item .meta_box{
  55.     padding: 20px 15px 0;
  56.     font-size: 18px;
  57.     background: #caac5f;
  58.     color: #fff;
  59.     text-align: left;
  60.     margin-top: -1px;
  61. }
  62.  
  63. .news-item .btn_box{
  64.     text-align: center;
  65.     background-image: url(https://isipp.co.uk/wp-content/uploads/2021/06/col-shadow.png);
  66.     background-size: contain;
  67.     background-repeat: no-repeat;
  68.     min-height: 182px;
  69.     padding-top: 20px;
  70.     margin-top: -1px;
  71. }
  72.  
  73. .news-item .read_more_btn {
  74.     background:#caac5f;
  75.     color: #ffffff;
  76.     padding: 10px 25px ;
  77.     border-radius: 25px ;
  78.     text-transform: uppercase;
  79.     display: inline-block;
  80.     margin: 20px auto;
  81.     font-size: 14px;
  82.     line-height: 1;
  83. }
  84.  
  85. .news-item .read_more_btn:hover {
  86.     background: #456d74;
  87.     text-decoration: none;
  88.     color: #fff;
  89. }
  90.  
  91. .news-item.categories-section {
  92.     text-align:left;
  93. }
  94.  
  95. .news-item.categories-section h4{
  96.     font-size: 3rem;
  97.     height: auto;
  98.     background: transparent;
  99.     text-align: left;
  100.     color:#456d74;
  101. }
  102.  
  103. .news-item .catgories_list {
  104.     margin: 20px 0 0;
  105.     padding-left: 20px;
  106.     text-indent:unset;
  107. }
  108.  
  109. .news-item .catgories_list li {
  110.     list-style: disc;
  111.     color: #caac5f;
  112.     margin-bottom: 20px;
  113.     font-weight: 900;
  114.     padding-left: 12px;
  115.     font-size: 18px;
  116. }
  117.  
  118. .news-item .catgories_list li:before {
  119.     content:unset;
  120. }
  121.  
  122. .news-item .catgories_list li a {
  123.     color: #456d74;
  124.     font-weight: 600;
  125.     font-size: 18px;
  126. }
  127.  
  128. .news-item .popular_articles{
  129.     margin: 20px 0 0;
  130.     padding-left: 20px;
  131. }
  132.  
  133. .news-item .popular_articles li{
  134.     list-style: decimal;
  135.     color: #caac5f;
  136.     margin-bottom: 25px;
  137.     font-weight: 900;
  138.     padding-left: 12px;
  139.     font-size: 18px;
  140.     text-align: left;
  141. }
  142.  
  143. .news-item .popular_articles li a{
  144.     color: #456d74;
  145.     font-weight: 600;
  146.     font-size: 18px;
  147.     background: transparent;
  148.     padding: 0 0 10px
  149. }
  150.  
  151. .news-item .popular_articles li a:Hover{
  152.     text-decoration: none;
  153.     color: #caac5f;
  154. }
  155.  
  156. .news-item .popular_articles li a h2{
  157.     font-size: 2rem;
  158. }
  159.  
  160. .news-item .popular_articles li .meta_box{
  161.     color: #caac5f;
  162.     padding: 0;
  163.     background: transparent;
  164.     font-weight: 400;
  165. }
  166.  
  167. .news-pagination{
  168.     float: left;
  169.     width: 100%;
  170.     text-align: center;
  171.     margin-bottom: 50px;
  172. }
  173.  
  174. .news-pagination .page-numbers{
  175.     background: #8e8e8e;
  176.     height: 30px;
  177.     width: 30px;
  178.     display: inline-block;
  179.     line-height: 30px;
  180.     color: #fff;
  181.     border-radius: 50%;
  182.     margin: 0 5px;
  183. }
  184.  
  185. .news-pagination .page-numbers.current, .news-pagination .page-numbers:hover{
  186.     background: #456d74;
  187.     text-decoration: none;
  188. }
  189.  
  190. .news-pagination .next.page-numbers, .news-pagination .prev.page-numbers{
  191.     height: auto;
  192.     width: auto;
  193.     background:none;
  194.     color: #8e8e8e;
  195. }
  196.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement