/*	
Theme Name: Trendline
Description: A clean themeforest Portfolio and Studio Template
Version: 1.0
Author: adrollin
Author URI: http://www.adrollin.com
*/


/************************************************************************
HEAD AREA
*************************************************************************/

/*reset*/
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, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 font-weight: inherit;
 font-style: inherit;
 font-size: 100%;
 vertical-align: baseline;
}

body{
 background:#17181a;
 color:#707373;
 font:12px/18px "Helvetica Neue",Arial,Helvetica,Geneva,sans-serif;
 position:relative;
}
 
/************************************************************************
HEADINGS
*************************************************************************/ 
 
h1, h2, h3, h4, h5, h6 {
 color:#888c8c;
 font-size:100%;
 font-family:"Vegur",Georgia,Times New Roman,Arial,Helvetica,Geneva,sans-serif; 
 font-style:normal;
 font-weight:normal;
 line-height:1.2em;
 margin:0 0 10px 0;
 padding:0;
 text-shadow: 0px 1px 0px #000;
}
 
h1 {
 font-size:30px;
 font-weight:500;
 }

h2 {
 font-size:24px;
 font-weight:500;
}
 
.intro h2{
 padding-bottom: 5px;
 text-transform:uppercase;
 margin-bottom:0;
}

h3 {
 font-size:18px;
 font-weight:500;
}
 
h3.title {
 background: url('images/underline.png') repeat-x bottom left;
 padding: 5px 0 5px;
 margin:0 0 10px;
}
 
.content h3.title {
 margin:0 0 20px;
}
 
.sidebar-widget h3.title{
 margin:0 0 10px;
}

h4 {
 font-size:14px;
 font-weight:500;
 text-transform:uppercase;
}
 
h4.title {
 border-bottom:1px solid #252729;
 font-size:14px;
 font-weight:bold;
 margin:0 0 3px;
 padding:5px 0;
 text-transform:uppercase;
}

.sidebar-widget h4{
 font-size:13px;
 line-height:17px;
 text-transform:none;
 margin:0 0 5px;
}

.intro h4{
 text-transform:none;
}
 
h5 {
 font-size:12px;
 font-weight:bold;
 text-transform:uppercase;
 line-height:14px;
}

h6 {
 font-size:10px;
 font-weight:bold;
 text-transform:uppercase;
 line-height:14px;
}


/************************************************************************
LINKS
*************************************************************************/ 

a{
 color:#518033;
 text-decoration:none;
}
 
a:hover{
 text-decoration:underline;
}
 
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
 color:#707373;
}

/************************************************************************
HELPER CLASSES
*************************************************************************/ 
 
.center{
 width:940px;
 margin:0 auto;
 position:relative;
}
 
.cc{				/*content-center*/
 margin:0 auto;
 position:relative;
 width:100%;
}
 
/*float*/
 
.left{
 float:left;
}
 
.right{
 float:right;
}

p{
 margin-bottom:10px;
}

/************************************************************************
IMAGES
*************************************************************************/ 
 
.img-border-left{
 background:#000;
 float:left;
 border: 1px solid #000000;
 padding:4px;
 margin: 0 7px 7px 0;
}
 
.img-border-right{
 background:#000;
 float:right;
 border: 1px solid #000000;
 padding:4px;
 margin: 0 0 7px 7px;
}

.img-border-left:hover, .img-border-right:hover{
 background:#383b40;
}
 
.img-left{
 float:left;
 margin: 0 7px 0 0;
}
 
.img-right{
 float:right;
 margin: 0 0 0 7px;
}

/************************************************************************
BUTTONS
*************************************************************************/ 

.btn{
 background:#000;
 border-radius:4px;
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 border:1px solid #262626;
 text-shadow:0 1px 0 #000000;
 padding:5px 8px;
 color:#787878;
}

.btn:hover{
 background:#F4F4F4;	/*fallback*/
 background-image: -moz-linear-gradient(center top , #191919, #000000);	/*mozilla gradient*/
 background-image: -webkit-gradient(center top , #191919, #000000);	/*webkit gradient*/
 text-decoration:none;
 cursor:pointer;
}

.btn.current{
 background:#262626;
 text-decoration:none;
}

/************************************************************************
BOXES
*************************************************************************/ 
 
.box-download, .box-info, .box-warning{
 border-radius:4px;
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 padding:25px 25px 25px 80px;
 margin:15px 0;
}

.box-download{
 background:url('images/icons/download.png') no-repeat 15px 9px #E3F4DE;
 border: 1px solid #A2D392;
 color: #599847;
}

.box-info{
 background:url('images/icons/information.png') no-repeat 15px 9px #DEEEF7;
 border: 1px solid #82C3E6;
 color: #2F81B0;
}

.box-warning{
 background:url('images/icons/warning.png') no-repeat 15px 9px #F8E4E2;
 border: 1px solid #E69D94;
 color: #BB5A4D;
}
 
pre {
 border-radius:4px;
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 background:none repeat scroll 0 0 #EEEEEE;
 border:1px solid #CCCCCC;
 color:#777777;
 font-size:12px;
 margin-bottom:23px;
 padding:8px 15px;
}

/************************************************************************
HEADER
*************************************************************************/ 

header{
 border-top:7px solid #dddddd;
 height:100px;
 width:100%;
 display:block;
 position:relative;
}
 
/*logo*/

header #logo, header #logo a {
 display:block;
 height:100px;
 left:0;
 margin:0;
 padding:0;
 position:relative;
 top:0;
 width:221px;
}

header #logo{
 background:url('images/logo.png') no-repeat top left;
}

header #logo a {
 left:0;
 text-indent:-9999px;
 top:0;
}
 
/*main-navigation*/

nav.main{
 height:30px;
 line-height:30px;
 padding-left:13px;
 position:absolute;
 right:0;
 top:57px;
 z-index:100;
}

nav.main ul.nav li:last-child a{
 padding-right:0
}

nav.main li{
 list-style-position:outside;
 list-style-type:none;
 float:left;
 position:relative;
}
 
nav.main ul:last-child{
 margin-right:0 !important;
}

nav.main li a{
 color:#787878; 
 display:block;
 float:left;
 font-size: 14px;
 height:30px;
 line-height:30px;
 outline:medium none;
 padding:0 21px;
 position:relative;
 text-align:center;
 text-decoration:none;
 text-shadow: 0px 1px 0px #000000;
}

nav.main li a:hover{
 color:#cccccc; 
}
 
/*main-navigation sub-level*/

nav.main li ul{
 background:url('images/subnav.png') repeat-y top left;
 display:block;
 position:absolute;
 visibility:hidden;
 width:143px;
 padding:14px 4px 4px 4px;
 z-index:100;
}
 
nav.main li ul li{
 display:list-item;
 float:none;
}
 
nav.main li ul li a{
 font-size:12px;
 text-align:left;
 color:#707373;
 margin:0;
 padding:0 5px 0 10px !important;
 width:136px;
 text-shadow:none;
} 
 
nav.main li ul li a:hover{
 background:#292929;
 color:#eeeeee;
} 
 
/************************************************************************
SLIDER
*************************************************************************/

#slider{
 display:block;
 position:relative;
 width:100%;
}

/************************************************************************
COLUMNS
*************************************************************************/
.last {
 margin-right:0 !important;
}
 
.fullwidth{
 width:940px;
 overflow:hidden;
 position:relative;
 margin-bottom:28px;
}
 
.one_half{
 float:left;
 width:445px;
 margin:0 50px 28px 0;
 overflow:hidden;
 position:relative; 
}
 
.one_third{
 float:left;
 width:280px;
 margin:0 50px 28px 0;
 overflow:hidden;
 position:relative;
}
 
.two_third{
 float:left;
 width:610px;
 margin:0 50px 28px 0;
 overflow:hidden;
 position:relative
}
 
.one_fourth{
 float:left;
 width:205px;
 margin:0 40px 28px 0;
 overflow:hidden;
 position:relative;
}
 
.two_fourth{
 float:left;
 width:450px;
 margin:0 40px 28px 0;
 overflow:hidden;
 position:relative;
}
 
.three_fourth{
 float:left;
 width:795px;
 margin:0 40px 28px 0;
 overflow:hidden;
 position:relative;
}


/************************************************************************
PREFACE
*************************************************************************/

#preface{
 background:url('images/break.png') no-repeat top center;
 display:block;
 position:relative;
 overflow:hidden;
 padding:25px 0 20px;
 width:100%;
}

/************************************************************************
CONTENT
*************************************************************************/

#content{
 background:url('images/break.png') no-repeat top center;
 display:block;
 position:relative;
 overflow:hidden;
 padding:25px 0 20px;
 width:100%;
}

section.content{
 width:620px;
 float:left;
}
 
.intro{
 background: url('images/underline.png') repeat-x bottom left;
 padding: 0 0 10px;
 margin: 0 auto 20px;
}


/************************************************************************
SIDEBAR
*************************************************************************/

aside{
 background:url('images/sidebar-middle-bg.png') repeat-y top left;
 padding-left:40px;
 position:relative;
 overflow: hidden;
 float:left;
 width:280px;
}
 
aside .sidebar-top{
 background:url('images/sidebar-top-bg.png') repeat-y top left;
 position: absolute;
 top:0;
 left:0;
 height:122px;
 width:40px;
 z-index:1;
}
 
aside .sidebar-bottom{
 background:url('images/sidebar-bottom-bg.png') repeat-y top left;
 position: absolute;
 bottom:0;
 left:0;
 height:122px;
 width:40px;
 z-index:1;
}
 
section.sidebar-widget{
 float:left;
 height:auto;
 margin-bottom:25px;
}
 
/*search widget*/

#search {
 background:url('images/search-bar.png') no-repeat;
 float:right;
 height:41px;
 margin:0 0 15px;
 padding:0 0;
 width:280px;
}

#search input {
 background-color:transparent;
 border:none;
 color:#6D6F6F;
 float:left;
 font-size:13px;
 font-style:italic;
 height:23px;
 margin:9px 0 0 13px;
 padding:0 3px 2px 2px;
 width:198px;
}

#search .search_button {
 background:url('images/search-button.png') no-repeat scroll 0 0 transparent;
 border:none;
 color:#EAEAEA;
 cursor:pointer !important;
 display:block;
 float:right;
 height:41px;
 margin:0;
 padding:7px;
 position:relative;
 right:0;
 text-decoration:none;
 text-indent:-9999px;
 text-shadow:1px 1px 0 #000000;
 text-transform:capitalize;
 top:0;
 width:53px;
}

/*list*/

ul.side-nav, ul.list {
 list-style:none outside none;
 margin-left:0;
 margin-right:0;
 overflow:hidden;
 padding:0;
 width:100%;
}

ul.side-nav li, ul.list li {
 border-bottom:1px solid #09090a;
 border-top:1px solid #252729;
 color:#6F6F6F;
 float:left;
 list-style-type:none;
 margin:0;
 padding:7px 0 11px 0;
 width:280px;
}

ul.side-nav li a{
 background:url('images/bullet.png') no-repeat scroll left 3px transparent;
 padding-left:15px;
 color:#707373;
 font-weight:bold;
}

ul.list li{
 background:url('images/bullet-round.png') no-repeat scroll left 14px transparent;
 padding-left:12px;
 font-weight:bold;
}

ul.side-nav li.current a {
 text-decoration:underline;
}

ul.side-nav li:first-child, ul.list li:first-child {
 border-top:none;
}

ul.side-nav li:last-child, ul.list li:last-child {
 border-bottom:none;
}

/*list with images*/

ul.image-list {
 list-style:none outside none;
 margin-left:0;
 margin-right:0;
 overflow:hidden;
 padding:0;
 width:100%;
}

ul.image-list li {
 border-bottom:1px solid #09090a;
 border-top:1px solid #252729;
 color:#6F6F6F;
 float:left;
 list-style-type:none;
 margin:0;
 padding:7px 0 11px 0;
 width:280px;
}

ul.image-list li:first-child {
 border-top:none;
}

ul.image-list li:last-child {
 border-bottom:none;
}

/************************************************************************
BLOG
*************************************************************************/

article{
 float:left;
 padding:0 0 30px;
 width:100%;
}
 
.details {
 float:left;
 margin-right:20px;
 position:relative;
 text-align:right;
 width:197px;
}
 
.details .time{
 color:#787878;
 display:block;
 font-size:30px;
 margin:3px 0 14px;
 padding:0;
 text-transform:uppercase;
}
 
.details .time em{
 color:#b2b2b2;
}

a.thumbnail{
 display:block;
 overflow:hidden;
}
 
.post {
 float:right;
 position:relative;
 width:403px;
}
 
.post p {
 margin: 10px 0;
}

.single .post p {
 margin: 0 0 10px;
}
 
small.meta{
 font-size:11px;
}

ul.share{
 margin: 10px 0;
 list-style:none outside none;
 padding:5px;
}

ul.share li{
 border-bottom:1px solid #09090A;
 border-top:1px solid #252729;
 padding:7px 0;
 color:#707373;
}

ul.share li a{
 color:#707373;
 padding:5px 25px 5px 5px;
 font-weight:bold;
}

ul.share li:first-child {
 border-top:none;
}

ul.share li:last-child {
 border-bottom:none;
}

/*share icons*/

.tweet{
 background:url('images/icons/tweet.png') no-repeat right 5px;
}

.facebook{
 background:url('images/icons/facebook.png') no-repeat right 5px;
}

.delicious{
 background:url('images/icons/delicious.png') no-repeat right 5px;
}

.stumble{
 background:url('images/icons/stumble.png') no-repeat right 5px;
}

.digg{
 background:url('images/icons/digg.png') no-repeat right 5px;
}

.comments{
 background:url('images/icons/comment.png') no-repeat right 5px;
}

/************************************************************************
COMMENTS
*************************************************************************/

#comment-block{
 float:left;
}

#comment-block ol{
 list-style:none outside none;
 margin-bottom:30px;
}

#comment-block ol li{
 width:100%;
 display:block;
 overflow:hidden;
 margin: 25px 0 0;
}

.commenter{
 float:left;
 position:relative;
 margin-right:20px;
 display:block;
}

.commenter-arrow{
 background:url('images/comment_arrow.png') no-repeat top left;
 position:absolute;
 top:14px;
 right:-26px;
 width:20px;
 height:24px;
}

.comment{
 background:#000000;
 border-radius:4px;
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 border:1px solid #262626;
 padding:15px;
 float:left;
 width:475px;
}

.comment p{
 margin:5px 0 0;
}

span.name{
 font-size:16px;
 font-weight:bold;
 margin-right:2px;
}

/*comment form*/

#commentform{
 margin:10px 0;
}

/************************************************************************
TYPOGRAPHY
*************************************************************************/

.cap {
 display:block;
 float:left;
 font-size:36px;
 line-height:36px;
 margin:0 5px 0 0;
}

.left_quote {
 border-left:4px solid #CCCCCC;
 float:left;
 font-size:15px;
 line-height:22px;
 margin:15px 20px 15px 0;
 padding:5px 5px 5px 10px;
 width:33%;
}

.right_quote {
 border-right:4px solid #CCCCCC;
 float:right;
 font-size:15px;
 line-height:22px;
 margin:15px 0 15px 22px;
 padding:5px 15px 5px 5px;
 width:33%;
}

/************************************************************************
FORMS
*************************************************************************/

.content input,.content textarea{
 background:#000;
 border-radius:4px;
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 padding:8px 10px;
 border:1px solid #262626;
 color:#787878;
}

.content textarea{
 width:500px;
}

/************************************************************************
PORTFOLIO
*************************************************************************/

.filter{
 display:inline-block;
 font-size:12px;
 margin-bottom:26px;
 margin-top:0;
 padding-top:5px;
 text-decoration:none;
 text-transform:uppercase;
 width:100%;
}

.filter ul{
 list-style:none outside none;
}

.filter ul li{
 float:left;
 margin-right:8px;
}

#portfolio{
 overflow:hidden;
}

#portfolio ul{
 list-style:none outside none;
 width:990px;
}

#portfolio ul.one-column li{
 background: url("images/underline.png") repeat-x scroll left bottom transparent;
 float:left;
 width:940px;
 margin: 0 0 20px;
 padding:0 0 20px;
}

#portfolio ul.two-column li{
 float:left;
 width:445px;
 margin: 0 50px 20px 0;
}

#portfolio ul.three-column li{
 float:left;
 width:280px;
 margin: 0 50px 20px 0;
}

#portfolio ul.four-column li{
 float:left;
 width:205px;
 margin: 0 40px 20px 0;
}

#portfolio ul.one-column li .img-border-left {
 margin:0 15px 7px 0;
}

#portfolio ul.two-column li .img-border-left {
 margin:0 10px 7px 0;
}

#portfolio ul.three-column li h4, #portfolio ul.four-column li h4{
 text-align:center;
}

/************************************************************************
TABLE
*************************************************************************/

table {
 border-collapse:collapse;
 border-spacing:0;
 position:relative;
 width:100%;
 margin-bottom:25px;
}

th {
 font-size:11px;
 padding:6px;
 font-weight:bold;
 text-align:center;
 text-transform:uppercase;
}

th.nobg {
 background:none repeat scroll 0 0 transparent;
 border:0 none;
}

td {
 background:none repeat scroll 0 0 #151517;
 color:#707373;
 padding:10px;
 text-align:center;
 vertical-align:middle;
}

td.alt, tr:nth-child(2n) td {
 background:none repeat scroll 0 0 #09090A;
}

tr td.big {
 font-weight:bold;
 background:none;
 text-align:center;
 width:25%;
}

/************************************************************************
FOOTER
*************************************************************************/

#footer{
 background:#242629;
 color:#eeeeee;
 display:block;
 position:relative;
 padding: 20px 0;
 width:100%;
 overflow:hidden;
}

#footer ul.nav{
 list-style-position:outside;
 list-style-type:none;
 margin:0;
 padding:0;
 position:relative;
 z-index:5;
}

#footer ul.nav li {
 float:left;
 padding-left:10px;
}

#footer ul.nav li a {
 color:#fff;
}

/************************************************************************
CODA-SLIDER
*************************************************************************/

.coda-slider-wrapper {
 background:url('images/coda-slider-bg.png') no-repeat top center; 
 height:430px;
 margin:0 auto;
 width:948px;
 position: relative; 
}


	
.coda-slider-no-js .coda-slider { 
 height: 200px; 
 overflow: auto !important; 
 padding-right: 20px 
}

.coda-slider, .coda-slider .panel { 
 width: 930px; 
} 
	
.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { 
 width: 930px;
}	

.coda-slider p.loading { 
 display:none;
 padding: 20px; 
 text-align: center;
}

.coda-nav { 
 position:absolute;
 top:390px;
 left:0;
}

.coda-nav ul { 
 clear: both; 
 display: block; 
 margin: auto; 
 overflow: hidden; 
}
 
.coda-nav ul li { 
 display: inline 
}
 
.coda-nav ul li a { 
 background: url('images/coda-pager.png') no-repeat; 
 background-position: 0 0;
 color: #fff; 
 display: block; 
 float: left; 
 width: 13px;
 height:14px;
 margin:0 3px;
 text-indent:-9999px; 
 text-decoration: none 
}
 
.coda-nav ul li a:hover, .coda-nav ul li a.current { 
 background-position:0px -14px; 
}
 
.coda-slider-wrapper { 
 clear: both; 
}
 
.coda-slider { 
 float:left;
 left:9px;
 overflow:hidden;
 position:absolute;
 top:7px; 
}
 
.coda-slider .panel { 
 display: block; 
 float: left 
}

.coda-slider .panel span.desc-left { 
 background: url('images/80.png');
 color:#000000;
 position: absolute;
 text-align: left;
 font-weight:bold;
 font-size:15px;
 top:250px;
 left:0px;
 padding:20px;
}

.coda-slider .panel span.desc-right { 
 background: url('images/80.png');
 color:#000000;
 position: absolute;
 text-align: right;
 font-weight:bold;
 font-size:15px;
 top:250px;
 right:0px;
 padding:20px;
}

.coda-slider .panel span.desc-bottom { 
 background: url('images/80.png');
 color:#000000;
 position: absolute;
 text-align: left;
 font-weight:bold;
 font-size:15px;
 bottom:5px;
 left:0px;
 padding:20px;
 width:100%;
}
 
.coda-slider .panel-container { 
 position: relative 
}
.coda-nav-left a, .coda-nav-right a { 
 display: block; 
 text-align: center; 
 text-decoration: none 
}

.panel-wrapper{
 position:relative;
}

.panel-wrapper{ height:365px; position:relative; }

/************************************************************************
NIVO-SLIDER
*************************************************************************/

/*
 * jQuery Nivo Slider v2.1
 * http://nivo.dev7studios.com
 *
 * Copyright 2010, Gilbert Pellegrom
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * March 2010
 */
 
/* The Nivo Wrapper */
.nivo-slider-wrapper {
 background:url('images/coda-slider-bg.png') no-repeat top center; 
 height:430px;
 margin:0 auto;
 width:948px;
 position: relative;
 overflow:hidden;
}

/* The Nivo Slider styles */
.nivoSlider {
 position:absolute;
 top:7px;
 left:9px;
}
.nivoSlider img {
 position:absolute;
 top:0px;
 left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
 position:absolute;
 top:0px;
 left:0px;
 width:100%;
 height:100%;
 border:0;
 padding:0;
 margin:0;
 z-index:60;
 display:none;
}
/* The slices in the Slider */
.nivo-slice {
 display:block;
 position:absolute;
 z-index:50;
 height:100%;
}
/* Caption styles */
.nivo-caption {
 position:absolute;
 left:0px;
 bottom:0px;
 padding:20px;
 background:#fff;
 color:#000;
 font-weight:bold;
 font-size:15px;
 opacity:0.8; /* Overridden by captionOpacity setting */
 width:890px;
 z-index:89;
}
.nivo-caption p {
 padding:5px;
 margin:0;
}
.nivo-caption a {
 display:inline !important;
}
.nivo-html-caption {
 display:none;
}
/* Direction nav styles (e.g. Next & Prev) DISABELED*/
.nivo-directionNav a {
 display:none; /* remove this line to enable */
 position:absolute;
 top:45%;
 z-index:99;
 cursor:pointer;
}
.nivo-prevNav {
 left:0px;
}
.nivo-nextNav {
 right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav{
 left:418px;
 position:absolute;
 top:385px;
}
.nivo-controlNav a { 
 background: url('images/coda-pager.png') no-repeat; 
 background-position: 0 0;
 color: #fff; 
 display: block; 
 float: left; 
 width: 13px;
 height:14px;
 margin:0 3px;
 text-indent:-9999px; 
 text-decoration: none;
 position:relative;
 z-index:99;
 cursor:pointer;
}
 
.nivo-controlNav a:hover, .nivo-controlNav a.active { 
 background-position:0px -14px; 
}

#nivo-slider {
	position:relative;
	//See the "style-pack" below for image
	background:url(images/loading.gif) no-repeat 50% 50%; 
}

#nivo-slider img {
	position:absolute;
	top:0px;
	left:0px;
	display:none;
}
	
/************************************************************************
RELATED
*************************************************************************/
.related-block {
 position: relative;
 width: 620px;
 margin: 0 auto 30px;
 float:left;
}

#related-content {
 overflow: hidden;	
}

#related-content a {
 float: left;
}

#related-content a img {
 margin:0 7px 7px 0;
 padding:4px;
}

#related-preview {
 position: absolute;
 border: 10px solid #000000;
 top:-50px;
 left: 0;
 z-index: 90;
 display: none;
 overflow: hidden;
 width: 320px;
 height: 217px;	
}

#related-overlay {
 position: absolute;
 top:49px;
 left: 0;
 z-index: 100;
}

#related-overlay div {
 float: left;
 cursor:pointer;
 background: red;
 display: none;
 width: 148px;
 height: 96px;
}