.xfieldimagegallery {
  margin: 0;
  padding: 0;  
  list-style: none;
  clear: both;
}

.xfieldimagegallery li {
	list-style: none;
	margin: 0;
	padding: 0;  
}

.xfieldimagegallery li img {
  float: left;
  margin-right: 5px;
  border: 5px solid #fff;
  width: 260px;
  height: 190px;
  transition: box-shadow 0.5s ease;
}

.xfieldimagegallery li img:hover {
  box-shadow: 0px 0px 7px rgba(0,0,0,0.4);
}

.win_img{
	width:163px;
	height:163px;
display:block;
overflow: hidden;
padding-bottom:5px;
border-radius:5px;
	}
.win_img img{
	width:163px;
	height:163px;
}
.shortstory {
    width: calc(100% - 6px);
    float: left;
    position: relative;
    padding: 5px;
    margin: 5px 3px;
    background-color: #293849;
    border-bottom: 5px solid #243241;
    text-align: center;
    -webkit-transition: .3s;
    transition: .3s;
}
.shortstory .shortstory__title {
    font-size: 13px;
    height: 42px;
    margin: 5px 0 0 0;
    padding: 0px;
    overflow: hidden;
}
.green-label {
    background-color: rgba(2,173,139,0.9);
}

.top-label {
    top: 10px;
}

.left-label {
    left: 10px;
}

.box .movie { width:152px; float:left; padding-right:12px; }
.movie-image { float:left; width:152px; height:214px; position:relative; }
.movie-image img { width:152px; height:214px; }
.movie-image a { float: left; display: inline; width:152px; height:214px; position: relative; z-index: 2; }
.play { position: absolute; top: 0; left: 0; width:152px; height:214px; background: url(../images/image-hover.png); display:block; z-index: 5; cursor:pointer; display:none; }
.movie span.name { font-weight:bold; color:#fff; font-size:14px; text-align:center; padding-top:160px; display:block; }


.post {
  font-family: 'Source Sans Pro', sans-serif;
  border-radius:  2px soild #cecece;
  box-shadow: 0 2px 0 rgba(204, 204, 204, 0.15);
  margin-bottom: 20px;
  
}
.post .post-image {
  display: block;
  
}
.post .post-image img{
  display: block;
  width:400px; 
  height:200px;
position:relative;
}
.post .icon-attachment {
  color: #fff;
}
.post .details {
  position: relative;
  background: #fff;
  text-align: center;
  padding: 0 10px 10px;
}
.post .details h2 {
  font-size: 0.90625em;
  font-weight: 600;
  color: #696969;
  margin: 0;
  padding: 5px 0;
}
.post .details p {
  font-size: 0.8125em;
  color: #aaaaaa;
  margin: 0 0 5px;
  padding: 0;
}
.post .details .intents {
  text-align: right;
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 0.6875em;
  color: #aaaaaa;
  line-height: 14px;
}
.post .details .intents [class*="icon-"] {
  font-size: 14px;
}
.post .details .intents .count {
  line-height: 14px;
  display: inline-block;
  position: relative;
  top: -3px;
  margin: 0 5px;
}
.post .details .intents .icon-star {
  color: #fc6e51;
}
.post .actions {
  height: 20px;
}
.post .actions [class*="icon-"] {
  font-size: 18px;
  font-weight: normal;
}
.post .actions .btn-round {
  position: relative;
  border-radius: 50%;
  padding: 10px 0;
  width: 38px;
  height: 38px;
  top: -19px;
  text-align: center;
}
.post.post-blog .details {
  font-family: 'Open Sans', sans-serif;
  padding: 10px 20px;
  text-align: left;
}
.post.post-blog .details h2 {
  font-size: 1.375em;
  font-weight: 300;
}
.post.post-blog .details strong {
  color: #888888;
}
.post.post-product .details {
  text-align: left;
  padding: 0 20px 20px;
}
.post.post-product .product-actions {
  margin: 20px 0 0;
}
.post.post-product .download-count {
  margin: 0 20px;
}

.button {
  display: block;
  position: relative;
  padding: .75em 5em .75em 1em;
  border-radius: .25em;
  margin-bottom: .5em;
  background: #fff;
  box-shadow:
    /* regular bottom */
    0 .0625em .125em rgba(0, 0, 0, .125),
    /* inset bottom */
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    /* category color (left) */
    inset 1em 0 0 -.7em rgba(200, 0, 120, .5),
    /* arrow background (right) */
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}

.teach-me {
  box-shadow:
    0 .0625em .125em rgba(0, 0, 0, .125),
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    inset 1em 0 0 -.7em rgba(0, 95, 210, .5),
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}

.handyman {
  box-shadow:
    0 .0625em .125em rgba(0, 0, 0, .125),
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    inset 1em 0 0 -.7em rgba(20, 160, 0, .5),
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}

.pick-up-delivery {
  box-shadow:
    0 .0625em .125em rgba(0, 0, 0, .125),
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    inset 1em 0 0 -.7em rgba(210, 15, 0, .5),
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}

.item {
  font-weight: bold;
  color: #000;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.item:after {
  content: '';
  display: block;
  height: 0;
  width: 100%;
}

.meta {
  margin-left: .25em;
}

.category,
.expiry,
i {
  font-size: 8px;
  font-size: .5em;
  line-height: 2; /* 16 "px" */
}

.expiry {
  font-weight: bold;
}

.expiry:before {
  content: 'ext: ';
  font-weight: normal;
}

.cost {
  margin-top:20px;
  position: absolute;
  font-family: 'Pathway Gothic One', sans-serif;
  font-size: 2em;
  right: 1.125em;
  top: 0;
  line-height: 2.083; /* 50 "px", should be same as button height */
}

.clock {
  display: inline-block;
  position: relative;
  width: 1.333em;
  height: 1.333em;
  margin-left: .333em;
  border: .25em solid #95979d;
  border-radius: 50%;
  vertical-align: middle;
}

.clock:before,
.clock:after {
  content: '';
  display: block;
  position: absolute;
  width: .125em;
  height: .25em;
  background: #95979d;
}

.clock:before {
  left: 50%;
  bottom: 47%;
  margin-left: -.0625em;
}

.clock:after {
  transform: rotate( 135deg );
  left: 63%;
  top: 47%;
}

.chevron {
  display: block;
  width: 1em;
  height: 1em;
  font-size: .75em;
  position: absolute;
  right: .667em;
  top: 50%;
  margin-top: -.6em; /* just eyeballing it */
}

.chevron:before,
.chevron:after {
  content: '';
  display: block;
  position: absolute;
  background: rgba(0, 0, 0, .125);
  width: .5em;
  height: .5em;
  right: .25em;
  top: 50%;
}

.chevron:before {
  transform: skewX( 45deg );
  top: 0;
  box-shadow: inset -.125em .125em .125em rgba(0, 0, 0, .25);
}
.chevron:after {
  transform: skewX( -45deg );
  bottom: 0;
  box-shadow: inset .25em .125em .125em -.125em rgba(0, 0, 0, .25);
}


.shortstory__label {
    position: absolute;
    padding: 3px 5px;
    font-size: 12px;
    max-width: 88%;
    max-height: 23px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	color:#fff;
}

.shortstory1
{
	width:calc(100% - 6px);
float:left;
position:relative;
padding:5px;
margin:5px
3px;
background-color:#fff;
border-bottom:5px solid #243241;
border:1px solid #cecece;
text-align:center;
-webkit-transition:.3s;
transition:.3s}
.shortstory1 img{width: 185px; height: 225px; display: block; overflow: hidden;}
.shortstory1 .shortstory__title1{font-size:13px;height:42px;margin:5px 0 0 0;padding:0px;overflow:hidden}
.shortstory1:hover .shortstory__title{color:#fff}
.shortstory1:hover .shortstory__poster_play-icon{opacity:1}

.shortstory
{
	width:calc(100% - 6px);
float:left;
position:relative;
padding:5px;
margin:5px
3px;
background-color:#fff;
border-bottom:5px solid #243241;
border:1px solid #cecece;
text-align:center;
-webkit-transition:.3s;
transition:.3s}
.shortstory img{width: 185px; height: 135px; display: block; overflow: hidden;}
.shortstory .shortstory__title{font-size:13px;height:42px;margin:5px 0 0 0;padding:0px;overflow:hidden}
.shortstory:hover .shortstory__title{color:#fff}
.shortstory:hover .shortstory__poster_play-icon{opacity:1}
.shortstory__poster{position:relative;display:block}
.shortstory__poster .fa-play-circle-o{position:absolute;left:50%;top:50%;margin:-28px 0 0 -28px;width:56px;height:56px;font-size:60px;color:#fff;cursor:pointer}
.shortstory__poster_play-icon{position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgba(41,56,73,0.7);opacity:0;-webkit-transition:.3s;transition:.3s}
.movie-active{z-index:150;position:relative}
.show-desc:hover .shortstory__label{opacity:0;-webkit-transition:.3s;transition:.3s}
.right-label{right:10px}.left-label{left:10px}.top-label{top:10px}.middle-label{top:36px}.bottom-label{bottom:57px}.yellow-label{background-color:rgba(218,213,62,0.9)}.orange-label{background-color:rgba(255,170,22,0.9)}.dark-orange-label{background-color:rgba(255,55,55,0.9)}.blue-label{background-color:rgba(45,165,218,0.9)}.light-label{background-color:rgba(85,203,193,0.9)}.red-label{background-color:rgba(231,62,97,0.9)}
/*** ESSENTIAL STYLES ***/
.sf-menu {
  position: relative;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sf-menu .sf-mega {
  position: absolute;
  display: none;
  top: 100%;
  z-index: 99;
}
.sf-menu > li {
  float: left;
}
.sf-menu li:hover > .sf-mega,
.sf-menu li.sfHover > .sf-mega {
  display: block;
}

.sf-menu > li > a {
  display: block;
  position: relative;
}


/*** DEMO SKIN ***/
.sf-menu {
  float: left;
  margin-bottom: 1em;
  width: 100%;
}
.sf-menu .sf-mega {
  
  width: 100%; /* allow long menu items to determine submenu width */
}
.sf-menu > li > a {
  
}
.sf-menu > li {
  
}
.sf-menu > li:hover,
.sf-menu > li.sfHover {
  
}

/*** mega menu dropdown ***/
.sf-mega {
  
  width: 100%;
}
.sf-mega-section {
  float: left;
  
}


/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {
  
}
/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
  
}
.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
}
