/*
  @file Styles associated with the SN More feature
*/
/*=====================More From SN===========*/

#more-from-sn-wrapper {
  position:relative;
  height:178px;
  width:100%;
  border-top:2px solid #eeeeee;
  margin-left:-10px;
  padding-right:20px;
  margin-top:30px;
  overflow:hidden;
}
#more-from-sn-wrapper h3.more-title{
  font-size:15px;
  line-height:22px;
  text-transform:none;
  font-weight:700;
  color:#1f4363;
  margin:10px 0 10px 10px;
}
.view-more-from-sn .view-header span {
}
.view-more-from-sn .view-filters {
  display:none;
}
.view-more-from-sn .view-footer {
  display:none;
}
.view-more-from-sn .view-content {
  width:100%;
  padding-right:20px;
  position:absolute;
}
/*touch device add horizontal scroll*/
.touch .view-more-from-sn .view-content {
  position:relative;
  overflow-y:hidden;
  overflow-x:scroll;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
}
.touch .view-more-from-sn .view-content .item-list {
  display:inline-block;
  white-space:normal;
}
.view-more-from-sn .view-content ul {
  list-style:none;
  width:2220px;
  overflow:hidden;
  
}
.view-more-from-sn .view-content li {
  float:left;
  width:144px;
  margin: 0 4px 0 0;
  
}
.view-more-from-sn .view-content li .more-image {
  height:77px;
  margin-bottom:4px;
}
.view-more-from-sn .view-content li img {
  width:100%;
}
.view-more-from-sn .view-content li .views-field-title {
    height:55px;
    background: #eeeeee;
  }
.view-more-from-sn .view-content li .views-field-title a{
  color:#1f4363;
  font-size:13px;
  line-height:15px;
  font-weight:700;
  display:block;
  padding:5px;
  text-decoration:none;
}
.view-more-from-sn .view-content li .views-field-title a:hover {
  text-decoration:none;
}
#more-from-sn-wrapper .arrowRightMore, #more-from-sn-wrapper .arrowLeftMore {
  background:#000000;
  opacity:0.4;
  border-radius:30px;
  position:absolute;
}
#more-from-sn-wrapper .arrowRightMore:hover, #more-from-sn-wrapper .arrowLeftMore:hover {
  cursor:pointer;
  opacity:0.8;
}
#more-from-sn-wrapper .arrowRightMore{
  top:55px;
  right:5px;
}
#more-from-sn-wrapper .arrowLeftMore {
  top:55px;
  left:5px;
}
#more-from-sn-wrapper.touch .arrowRightMore, #more-from-sn-wrapper.touch .arrowLeftMore {
  display:none;
}
/* ==================== "table" size media query reaction ================== */

@media (min-width: 768px) {
  #more-from-sn-wrapper{
    margin:0;
    padding:0;
    margin-left:30px;
    margin-top:30px;
    width:530px;
  }
  body.no-newsrail #more-from-sn-wrapper{
    margin:0;
    padding:0;
    margin-left:30px;
    margin-top:30px;
    width:738px;
  }
  .view-more-from-sn .view-content {
    padding:0;
  }
  #more-from-sn-wrapper h3.more-title{
    margin-left:0px;
  }
}

/* ==================== "Medium" size media query reaction ================== */

@media (min-width: 1024px) {
  #more-from-sn-wrapper {
    width:720px;
  }
  body.no-newsrail #more-from-sn-wrapper {
    width:928px;
  }

}

/* ==================== "Wide" size media query reaction ================== */


@media (min-width: 1220px) {
  #more-from-sn-wrapper {
    margin-left:40px;
    width:800px;
  }
  body.no-newsrail #more-from-sn-wrapper {
    width:1140px;
  }
  #more-from-sn-wrapper .arrowRightMore{
    top:90px;
    right:5px;
  }
  #more-from-sn-wrapper .arrowLeftMore {
    top:90px;
    left:5px;
  }
  #more-from-sn-wrapper {
    height:240px;
  }
  .view-more-from-sn .view-content ul {
    width:4380px;
  }
 .view-more-from-sn .view-content li {
  width:288px;
 }
 body.no-newsrail .view-more-from-sn .view-content li {
  width:282px;
 }
 .view-more-from-sn .view-content li .more-image{
  height:154px;
 }
 .view-more-from-sn .view-content li .views-field-title {
    height:40px;
 }
}