﻿ul.faces-list {list-style: none; margin: 0; padding: 0;}
ul.faces-list:after {display: block; visibility: hidden; content: "."; height: 0; clear: both;}
ul.faces-list li.faces-item {width: 100%; margin: 0; padding: 5px 0;}
ul.faces-list li.faces-item > .inner {
  height: 100%;
  border: 1px solid #ddd;
  border-radius: 5px;
  box-shadow: 2px 2px 2px #f5f5f5, -1px -1px 1px #f5f5f5;
  background: rgb(245,245,245);
  background: -moz-linear-gradient(-45deg,  rgba(245,245,245,1) 0%, rgba(255,255,255,1) 50%, rgba(250,250,250,1) 100%);
  background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(245,245,245,1)), color-stop(50%,rgba(255,255,255,1)), color-stop(100%,rgba(250,250,250,1)));
  background: -webkit-linear-gradient(-45deg,  rgba(245,245,245,1) 0%,rgba(255,255,255,1) 50%,rgba(250,250,250,1) 100%);
  background: -o-linear-gradient(-45deg,  rgba(245,245,245,1) 0%,rgba(255,255,255,1) 50%,rgba(250,250,250,1) 100%);
  background: -ms-linear-gradient(-45deg,  rgba(245,245,245,1) 0%,rgba(255,255,255,1) 50%,rgba(250,250,250,1) 100%);
  background: linear-gradient(135deg,  rgba(245,245,245,1) 0%,rgba(255,255,255,1) 50%,rgba(250,250,250,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#fafafa',GradientType=1 );
}
ul.faces-list li.faces-item.important-on > .inner {}
ul.faces-list li.faces-item.highlight-on > .inner {background: #faf6ca;}
ul.faces-list li.faces-item > .inner > .faces-item-thumbnail {margin-bottom: 5px; line-height: 0;}
ul.faces-list li.faces-item > .inner > .faces-item-thumbnail img {border-top-left-radius: 5px; border-top-right-radius: 5px;}
ul.faces-list li.faces-item > .inner > .faces-item-thumbnail a {display: block;}
ul.faces-list li.faces-item > .inner > .inner {padding: 15px;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-thumbnail {margin-bottom: 15px; line-height: 0;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-thumbnail a {display: block;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-title {font-weight: bold; line-height: 1.2em;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-title a {color: #444; text-decoration: none;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-post {margin-top: 5px; font-family: sans-serif; font-size: 80%; line-height: 1.2em; color: #999;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-teaser {margin-top: 5px; font-family: sans-serif; font-size: 80%; line-height: 1.4em;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-teaser ul {padding-left: 25px;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-more {margin-top: 5px; font-family: sans-serif; font-size: 80%; line-height: 1.4em; text-align: right;}
ul.faces-list li.faces-item > .inner > .inner .faces-item-more a {}

.faces-header-01 {}
  .faces-header-02 {}
    .faces-header-03 {}
      ul.faces-header {list-style: none; margin: 0; padding: 0;}
      ul.faces-header:after {display: block; visibility: hidden; content: "."; height: 0; clear: both;}
      ul.faces-header li.face-header {float: left; width: 25%; margin: 0; padding: 0;}
      ul.faces-header li.face-header .faces-header-wrapper {}
      ul.faces-header li.face-header .faces-header-wrapper .faces-header-thumb {margin: 1px; line-height: 0;}
      ul.faces-header li.face-header .faces-header-wrapper .faces-header-thumb a {display: block;}
  .faces-header-footer {margin-top: 5px; font-size: 90%; font-family: sans-serif; color: #fff; text-align: right; line-height: 1.4em;}
  .faces-header-footer p {}

@media all and (min-width: 480px) { /* mobile landscape */
  ul.faces-list li.faces-item {float: left; width: 50%;}
  ul.faces-list li.faces-item > .inner {margin: 0 5px;}
  ul.faces-header li.face-header {float: left; width: 25%;}
}

@media all and (min-width: 768px) { /* ipad & ipad mini */
  ul.faces-list li.faces-item {width: 33%;}
  ul.faces-header li.face-header {width: 12.5%;}
}

@media all and (min-width: 960px) { /* ~1024px */
  ul.faces-list li.faces-item {width: 25%;}
}
