/*css/common/wookmark.css*/


/**


 * Grid container


 */


#tiles {


list-style-type: none;


position: relative; /** Needed to ensure items are laid out relative to this container **/


margin: 0;


}





/**


 * Grid items


 */


#tiles li {


z-index: 1;


/*width: 170px;*/


width: 160px;


background-color: #ffffff;


/*border: 1px solid #dedede;*/


-moz-border-radius: 2px;


-webkit-border-radius: 2px;


border-radius: 2px;


display: none; /** Hide items initially to avoid a flicker effect **/


  cursor: pointer;


/*padding: 4px;*/


  -webkit-transition: all 0.3s ease-out;


     -moz-transition: all 0.3s ease-out;


       -o-transition: all 0.3s ease-out;


          transition: all 0.3s ease-out;


}





#tiles li.inactive {


opacity: 0;


filter:alpha(opacity=0);


z-index: 0;


}





#tiles li img {


display: block;


}





#filters {


list-style-type: none;


text-align: center;


height: 50px;


margin: 0 5% 0 5%;


}





#filters li {


font-size: 12px;


float: left;


padding: 6px 0 4px 0;


cursor: pointer;


  -webkit-transition: all 0.15s ease-out;


     -moz-transition: all 0.15s ease-out;


       -o-transition: all 0.15s ease-out;


          transition: all 0.15s ease-out;


-moz-border-radius: 3px;


-webkit-border-radius: 3px;


border-radius: 3px;


margin: 0 1% 0 1%;


width: 14%;


}





#filters li:hover {


background: #dedede;


}





#filters li.active {


background: #006cb7;


color: #ffffff;


}





/**


 * Grid item text


 */


#tiles li p {


color: #666;


font-size: 12px;


/*margin: 7px 0 0 7px;*/


margin-top:12px;
text-align: justify;

}





/**


 * Some extra styles to randomize heights of grid items.


 */


#tiles ali:nth-child(3n) {


height: 175px;


}





#tiles ali:nth-child(4n-3) {


padding-bottom: 30px;


}





#tiles ali:nth-child(5n) {


height: 250px;


}