/* ---- Slick Carousel custom for Customer Service page ---- */

.carousel-responsive{margin:0 0 48px !important;border:1px solid #BBBCBC;min-height:200px;}
.carousel-responsive * {box-sizing:border-box;}
.carousel-responsive .panel{margin:24px 76px;}
.carousel-responsive .panel .photo{float:left;width:25%;margin-right:2%;}
.carousel-responsive .panel .photo img{margin:0 auto;margin-bottom:14px;width:100%;height:auto;max-width:200px;border:none;border-radius:0px;background:transparent;padding:0}
#main-content .carousel-responsive .panel p{font-family:'Graphik', sans-serif;color:#333F48}
#main-content .carousel-responsive .panel .photo p{text-align:center;}
#main-content .carousel-responsive .panel p.caption{font-weight:600;font-size:30px;line-height:34px}
.carousel-responsive .panel .star{float:right;width:70%;}
  #main-content .carousel-responsive .panel .star p.quote-headline{font-size:30px;line-height:37px}
  #main-content .carousel-responsive .panel .star p.quote{font-size:20px;line-height:26px;font-weight:300;}
#main-content .carousel-responsive .panel .star p.quote span{}
#main-content .carousel-responsive .panel .star p.attr{font-size:18px;line-height:22px}

.slick-prev,.slick-next{position:absolute;top:35%;font-size:0;line-height:0;cursor:pointer;display:block;width:40px;height:76px;border:none;outline:none;padding:0;visibility:visible;z-index:4;box-shadow:none;}
.slick-prev{left:10px;background-image:url('/content/dam/oclc/customer-service/slick/wc_carousel_btn_dark_left.png');background-color:transparent;background-repeat:no-repeat;}
.slick-next{right:10px;background-image:url('/content/dam/oclc/customer-service/slick/wc_carousel_btn_dark_right.png');background-color:transparent;background-repeat:no-repeat;}
.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{background-position:0 -76px}

@media screen and (max-width:600px) {
  .carousel-responsive .panel .photo,.carousel-responsive .panel .star{float:none;display:block;width:100%;}
  .carousel-responsive .panel .photo{margin:96px 0 32px}
  #main-content .carousel-responsive .panel .star p.quote-headline{font-size:30px;line-height:37px}
  #main-content .carousel-responsive .panel .star p.quote{font-size:20px;line-height:26px}
  #main-content .carousel-responsive .panel p.caption{font-size:28px;line-height:32px}
  .carousel-responsive .panel{margin:24px;}
  .slick-prev, .slick-next {top:2% !important}
  .slick-prev{left:36% !important;}
  .slick-next{right:36% !important;}
}