#block-views-apartments-carousel { @include clearfix;
	.view { margin-left: 0px;
		.view-content { background-color: $blue-dark; padding: 30px; 
			.jcarousel-container { @include border-radius(0px); background-color: transparent; border: 0px; height: auto; padding: 0px; position: relative; width: auto; 
				.jcarousel-item { border: 0px; height: 260px; margin: 0px 30px 0px 0px; overflow: visible; position: relative; overflow: hidden; text-align: left; width: 230px !important; 
				 	.views-field-field-image { height: 170px; overflow: hidden;
						.field-content {
							@include transition(opacity .2s linear, width .2s linear);
							width: 100%;
							&:hover {
								opacity: .8; width: 104%;
								img { margin-left: -2%; margin-top: -2%; }
							}
							img { @include transition(margin-left .2s linear, margin-top .2s linear); height: auto; width: 100%; }					
						}
				 	}
			      
					h2 { line-height: 22px; margin: 3px 0px 0px 0px; padding: 0px 10px;
						a { @include transition(color .1s ease-in); color: $blue; font-size: 18px; font-weight: normal;
							&:hover { color: darken($blue, 10%); text-decoration: none; }
						}
					}
					.views-field-field-location { padding: 0px 10px; }
					.views-field-field-price { background-color: #ffffff; color: $black; font-size: 18px; padding: 5px 16px; position: absolute; right: -10px; top: 130px; }
					.views-field-field-area{ color: $black; float: left; margin-top: 8px; 
						.views-label { display: inline; font-weight: bold; padding: 0px 0px 0px 10px; }
						.field-content { display: inline; }
					}
					.views-field-field-bedrooms { float: right; margin-right: 10px; padding-top: 8px; 
                        .field-content { background-image: url('../img/icons/bedrooms.png'); background-position: left center; background-repeat: no-repeat; background-size: 21px 12px; color: $black; padding-left: 30px;
                            @media (-webkit-min-device-pixel-ratio: 2), (-moz-min-device-pixel-ratio: 2) {
                                background-image: url('../img/icons/bedrooms@2x.png');
                            }
                        }
					}
					.views-field-field-bathrooms { float: right; margin-right: 10px; padding-top: 8px;	
						.field-content { background-image: url('../img/icons/bathrooms.png'); background-position: left center; background-repeat: no-repeat; background-size: 14px 20px; color: $black; padding-left: 25px;
                            @media (-webkit-min-device-pixel-ratio: 2), (-moz-min-device-pixel-ratio: 2) {
                              background-image: url('../img/icons/bathrooms@2x.png');
                            }
                        }
					}
				}

				.jcarousel-clip { width: 100%; }
				.jcarousel-prev { @include transition(opacity .2s linear, background-color .2s linear); background-color: $blue; background-image: url('../img/arrow-left-white.png'); background-position: center center; background-repeat: no-repeat; background-size: 8px 11px; height: 40px; margin: -20px 0px 0px 0px; padding: 0px; left: -20px; top: 50%; width: 40px;
                    @media (-webkit-min-device-pixel-ratio: 2), (-moz-min-device-pixel-ratio: 2) {
                      background-image: url('../img/arrow-left-white@2x.png');
                    }
					&.jcarousel-prev-disabled { opacity: 0.6; }
                    &:hover { background-color: darken($blue, 20%)}
				}
				.jcarousel-next { @include transition(opacity .2s linear, background-color .2s linear); background-color: $blue; background-image: url('../img/arrow-right-white.png'); background-position: center center; background-repeat: no-repeat; background-size: 8px 11px; height: 40px; margin: -20px 0px 0px 0px; padding: 0px; right: -20px; top: 50%; width: 40px;
                    @media (-webkit-min-device-pixel-ratio: 2), (-moz-min-device-pixel-ratio: 2) {
                      background-image: url('../img/arrow-right-white@2x.png');
                    }
					&.jcarousel-next-disabled { opacity: 0.6; }
                    &:hover { background-color: darken($blue, 10%)}
				}			
			}
		}
	}
}

@media (max-width: 767px) {
  #block-views-apartments-carousel { padding-left: 20px; padding-right: 20px;
    .view {
      .view-content { padding: 30px 0px;
        .jcarousel-container{ width: 230px;
          .jcarousel-prev { left: -50px; }
          .jcarousel-next { right: -50px; }

          .jcarousel-clip { width: 230px; }
        }
      }
    }
  }
}