Single Latest Posts Lite CSS stylesheet: centered thumbnails and items with borders.

slp-centeredWithBorders.css

/**
 * Single Latest Posts v1.4.2
 *
 * Copyright 2007 - 2013  L'Elite
 * Licensed under the GPL v2.0
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Great and ugly things aren't as good
 * as great and beautiful things  ;)
 */
/*\
 * =========================
 * |                       |
 * | ++ General Styles ++  |
 * |                       |
 * ========================= 
\*/
#slposts .slp-alert {
  padding: 8px 35px 8px 14px !important;
  margin-bottom: 20px !important;
  color: #c09853 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) !important;
  background-color: #fcf8e3 !important;
  border: 1px solid #fbeed5 !important;
  -webkit-border-radius: 4px !important;
     -moz-border-radius: 4px !important;
          border-radius: 4px !important;
}
#slposts .slp-alert .slp-close {
  position: relative !important;
  top: -2px !important;
  right: -21px !important;
  line-height: 20px !important;
}
#slposts button {
  margin: 0 !important;
  font-size: 100% !important;
  vertical-align: middle !important;
}
#slposts button {
  *overflow: visible !important;
  line-height: normal !important;
}
#slposts button::-moz-focus-inner {
  padding: 0 !important;
  border: 0 !important;
}
#slposts button,
input[type="button"] {
  cursor: pointer !important;
  -webkit-appearance: button !important;
}
#slposts .slp-close {
  float: right !important;
  font-size: 20px !important;
  font-weight: bold !important;
  line-height: 20px !important;
  color: #000000 !important;
  text-shadow: 0 1px 0 #ffffff !important;
  opacity: 0.2 !important;
  filter: alpha(opacity=20) !important;
}
#slposts .slp-close:hover {
  color: #000000 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  opacity: 0.4 !important;
  filter: alpha(opacity=40) !important;
}
#slposts button.slp-close {
  padding: 0 !important;
  cursor: pointer !important;
  background: transparent !important;
  border: 0 !important;
  -webkit-appearance: none !important;
}
[class^="slpicon-"],
[class*=" slpicon-"] {
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  margin-top: 1px !important;
  *margin-right: .3em !important;
  line-height: 14px !important;
  vertical-align: text-top !important;
  background-image: url("../img/glyphicons-halflings.png") !important;
  background-position: 14px 14px !important;
  background-repeat: no-repeat !important;
}
.slpicon-white {
  background-image: url("../img/glyphicons-halflings-white.png") !important;
}
.slpicon-comment {
  background-position: -240px -120px !important;
}
.slpicon-bookmark {
  background-position: -72px -48px !important;
}
.slpicon-calendar {
  background-position: -192px -120px !important;
}
.slposts-container {

}
.slposts-container a:focus {
    outline: thin dotted #333 !important;
    outline: 5px auto -webkit-focus-ring-color !important;
    outline-offset: -2px !important;
}
.slposts-container a:hover,
.slposts-container a:active {
    outline: 0 !important;
}
.slposts-container img {
    max-width: 100% !important;
    vertical-align: middle !important;
    border: 0 !important;
    -ms-interpolation-mode: bicubic !important;
}
.slposts-container button,
.slposts-container input,
.slposts-container select,
.slposts-container textarea {
    margin: 0 !important;
    font-size: 100% !important;
    vertical-align: middle !important;
}
.slposts-container button,
.slposts-container input {
    *overflow: visible !important;
    line-height: normal !important;
}
.slposts-container button::-moz-focus-inner,
.slposts-container input::-moz-focus-inner {
    padding: 0 !important;
    border: 0 !important;
}
.slposts-container button,
.slposts-container input[type="button"],
.slposts-container input[type="reset"],
.slposts-container input[type="submit"] {
    cursor: pointer !important;
    -webkit-appearance: button !important;
}
.slposts-container input[type="search"] {
    -webkit-box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    box-sizing: content-box !important;
    -webkit-appearance: textfield !important;
}
.slposts-container input[type="search"]::-webkit-search-decoration,
.slposts-container input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none !important;
}
.slposts-container textarea {
    overflow: auto !important;
    vertical-align: top !important;
}
/*\
 * --------------
 * | Pagination |
 * --------------
\*/
.slp-pagination {
    height: 36px !important;
    margin: 18px 0 !important;
    text-align: center !important;
    clear: both !important;
    border-top: 1px dotted #efefef !important;
}
.slp-pagination p {
    text-align: center !important;
}
.slp-pagination ul {
    text-align: center !important;
    display: inline-block !important;
    *display: inline !important;
    *zoom: 1 !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
    -webkit-border-radius: 3px !important;
    -moz-border-radius: 3px !important;
    border-radius: 3px !important;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}
.slp-pagination li {
    display: inline !important;
    text-align: center !important;
    margin: 0 auto !important;
}
.slp-pagination a, 
.slp-pagination span {
    text-align: center !important;
    cursor: pointer !important;
    padding: 5px 14px !important;
    line-height: 34px !important;
    text-decoration: none !important;
    border: 1px solid #ddd !important;
    border-left-width: 0 !important;
    text-align: center !important;
}
.slp-pagination 
a:hover,
.slp-pagination 
.active a,
.jp-current {
    background-color: #f5f5f5 !important;
}
.slp-pagination 
.active a,
.jp-current {
    color: #999999 !important;
    cursor: default !important;
}
.slp-pagination span,
.slp-pagination 
.disabled a,
.slp-pagination 
.disabled a:hover,
.jp-disabled {
    color: #999999 !important;
    background-color: transparent !important;
    cursor: default !important;
}
.slp-pagination li:first-child a, 
.slp-pagination li:first-child span,
.slp-pagination a:first-child {
    border-left-width: 1px !important;
    -webkit-border-radius: 3px 0 0 3px !important;
    -moz-border-radius: 3px 0 0 3px !important;
    border-radius: 3px 0 0 3px !important;
}
.slp-pagination li:last-child a, 
.slp-pagination li:last-child span,
.slp-pagination a:last-child {
    -webkit-border-radius: 0 3px 3px 0 !important;
    -moz-border-radius: 0 3px 3px 0 !important;
    border-radius: 0 3px 3px 0 !important;
}
/*\
 * =========================
 * |                       |
 * | -- General Styles --  |
 * |                       |
 * ========================= 
\*/
/*\
 * =========================
 * |                       |
 * | ++ Unordered Lists ++ |
 * |                       |
 * ========================= 
\*/
/*\
 * -----------
 * | Content |
 * -----------
\*/
.slposts-ulist-container 
.slposts-ulist-wtitle {
    font-size: 1.3em !important;
    border-bottom: 1px dotted #efefef !important;
}
ul.slposts-ulist, 
li.slposts-ulist-litem, 
ul.slposts-ulist-thumbnail,
ul.slposts-ulist-excerpt {
    list-style: none !important;
    margin: 0 !important;
}
li.slposts-ulist-litem {
    display: block !important;
    padding-bottom: 20px !important;
}
div.thumbnail a > img {
    border: 1px solid #efefef !important;
    padding: 3px !important;
}
div.thumbnail a > img:hover {
    -webkit-box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
    -moz-box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
    box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
}
div.thumbnail 
ul.slposts-ulist-excerpt
a > img {
    border: 0 !important;
    padding: 0 !important;
}
.slposts-ulist-title {
    border-bottom: 1px dotted #efefef !important;
}
.slposts-ulist-title a {
    font-size: 1.4em !important;
    text-decoration: none !important;
}
.slposts-ulist-meta {
    float: right !important;
    margin-left: 5px !important;
    font-family: sans-serif !important;
    font-size: .8em !important;
    border: 1px dotted #efefef !important;
    padding: 3px !important;
    color: #777 !important;
}
.slposts-ulist-meta a {
    text-decoration: none !important;
}
.slposts-ulist-metafooter {
    display: block !important;
    clear: both !important;
    border-top: 1px dotted #efefef !important;
    font-size: .8em !important;
    text-align: right !important;
    color: #777 !important;
}
.slposts-ulist-excerpt {
    text-align: justify !important;
}
/*\
 * =========================
 * |                       |
 * | -- Unordered Lists -- |
 * |                       |
 * ========================= 
\*/
/*\
 * =========================
 * |                       |
 * | ++ Ordered Lists ++   |
 * |                       |
 * ========================= 
\*/
/*\
 * -----------
 * | Content |
 * -----------
\*/
.slposts-olist-container 
.slposts-olist-wtitle {
    font-size: 1.3em !important;
    border-bottom: 1px dotted #efefef !important;
}
ol.slposts-olist, 
li.slposts-olist-litem, 
ul.slposts-olist-thumbnail,
ul.slposts-olist-excerpt {
    list-style: none !important;
    margin: 0 !important;
}
li.slposts-olist-litem {
    display: block !important;
    padding-bottom: 20px !important;
    border: 3px dotted black !important;
    text-align: center !important;
    margin: 0.5em 0 0.5em 0 !important;
}
div.thumbnail a > img {
    float: none !important;
    border: 1px solid #efefef !important;
    padding: 3px !important;
}
div.thumbnail a > img:hover {
    -webkit-box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
    -moz-box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
    box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
}
div.thumbnail 
ul.slposts-olist-excerpt
a > img {
    border: 0 !important;
    padding: 0 !important;
}
.slposts-olist-title {
    border-bottom: 1px dotted #efefef !important;
}
.slposts-olist-title a {
    font-size: 1.4em !important;
    text-decoration: none !important;
}
.slposts-olist-meta {
    float: right !important;
    margin-left: 5px !important;
    font-family: sans-serif !important;
    font-size: .8em !important;
    border: 1px dotted #efefef !important;
    padding: 3px !important;
    color: #777 !important;
}
.slposts-olist-meta a {
    text-decoration: none !important;
}
.slposts-olist-metafooter {
    display: block !important;
    clear: both !important;
    border-top: 1px dotted #efefef !important;
    font-size: .8em !important;
    text-align: right !important;
    color: #777 !important;
}
.slposts-olist-excerpt {
    text-align: justify !important;
}
/*\
 * =========================
 * |                       |
 * | -- Ordered Lists --   |
 * |                       |
 * ========================= 
\*/
/*\
 * =========================
 * |                       |
 * | ++ Blocks ++          |
 * |                       |
 * ========================= 
\*/
/*\
 * -----------
 * | Content |
 * -----------
\*/
.slposts-container
.slposts-block-wtitle {
    font-size: 1.3em !important;
    border-bottom: 1px dotted #efefef !important;
}
.slposts-block-title a {
    font-size: 1.4em !important;
    text-decoration: none !important;
}
ul.slposts-block-thumbnail {
    list-style: none !important;
    margin: 0 !important;
}
@media( min-width: 800px ) {
  .slposts-block-item {
      float: left !important;
      width: 47% !important;
      margin-right: 10px !important;
      margin-bottom: 10px !important;
  }
}
@media( max-width: 799px ) {
  .slposts-block-item {
      width: 100% !important;
      margin: 0 0 10px 0 !important;
  }
}
.slposts-block-thumbnail a > img {
    border: 1px solid #efefef !important;
    padding: 3px !important;
}
.slposts-block-thumbnail a > img:hover {
    -webkit-box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
    -moz-box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
    box-shadow: 1px 1px 3px rgba(99, 175, 208, 0.15) !important;
}
.slposts-block-thumbnail
div.slposts-block-excerpt
a > img {
    border: 0 !important;
    padding: 0 !important;
}
.slposts-block-meta {
    float: right !important;
    margin-left: 5px !important;
    font-family: sans-serif !important;
    font-size: .8em !important;
    border: 1px dotted #efefef !important;
    padding: 3px !important;
    color: #777 !important;
}
.slposts-block-meta a {
    text-decoration: none !important;
}
.slposts-block-metafooter {
    display: block !important;
    clear: both !important;
    border-top: 1px dotted #efefef !important;
    font-size: .8em !important;
    text-align: right !important;
    color: #777 !important;
}
.slposts-block-excerpt {
    text-align: justify !important;
}
/*\
 * =========================
 * |                       |
 * | -- Blocks --          |
 * |                       |
 * ========================= 
\*/
/*\
 * =========================
 * |                       |
 * | ++ Widgets ++         |
 * |                       |
 * =========================
\*/
.slposts-widget 
.slposts-block-item {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}
.slposts-widget
.slposts-ulist-meta,
.slposts-widget
.slposts-olist-meta,
.slposts-widget
.slposts-block-meta {
    float: none !important;
    margin: 0 !important;
    border: 0 !important;
    padding: 0 !important;
}
.slposts-widget
.slposts-ulist-metafooter,
.slposts-widget
.slposts-olist-metafooter,
.slposts-widget
.slposts-block-metafooter {
    text-align: left !important;
}
.slposts-widget
.slp-pagination a.page-numbers,
.slposts-widget
.slp-pagination span.current,
.slposts-widget
.slp-pagination span.dots {
    display: none !important;
}
.slposts-widget
.slp-pagination span.current,
.slposts-widget
.slp-pagination .prev,
.slposts-widget
.slp-pagination .next {
    display: inline !important;
}
/*\
 * =========================
 * |                       |
 * | -- Widgets --         |
 * |                       |
 * =========================
\*/