/* fonts */
@font-face {
  font-family: "Benton-Sans-Black";
  src: url("/cdn/fonts/Benton-Sans-Black/bc06c909-a731-43ae-a772-ea42520c81b9-2.eot");
  src: url("/cdn/fonts/Benton-Sans-Black/bc06c909-a731-43ae-a772-ea42520c81b9-2.eot?") format("embedded-opentype"),
       url("/cdn/fonts/Benton-Sans-Black/bc06c909-a731-43ae-a772-ea42520c81b9-3.woff") format("woff"),
       url("/cdn/fonts/Benton-Sans-Black/bc06c909-a731-43ae-a772-ea42520c81b9-1.ttf") format("truetype");
  font-style: normal;
  font-weight: normal;
}

@font-face {
  font-family: "Benton-Sans-Black";
  src: url("/cdn/fonts/Benton-Sans-Black-Italic/9afa6c31-8572-45ee-8575-c3c541f31e3f-2.eot");
  src: url("/cdn/fonts/Benton-Sans-Black-Italic/9afa6c31-8572-45ee-8575-c3c541f31e3f-2.eot?") format("embedded-opentype"),
       url("/cdn/fonts/Benton-Sans-Black-Italic/9afa6c31-8572-45ee-8575-c3c541f31e3f-3.woff") format("woff"),
       url("/cdn/fonts/Benton-Sans-Black-Italic/9afa6c31-8572-45ee-8575-c3c541f31e3f-1.ttf") format("truetype");
  font-style: italic;
  font-weight: normal;
}

@font-face {
  font-family: "BentonSansComp-Black";
  src: url("/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-2.eot");
  src: url("/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-2.eot?") format("embedded-opentype"),
       url("/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-3.woff") format("woff"),
       url("/cdn/fonts/BentonSansComp-Black/3207ad65-d574-4dc0-8ddc-cfbe21c91dd1-1.ttf") format("truetype");
  font-style: normal;
  font-weight: normal;
}

#primary #masthead {background-color:#2d2a29; background-image: none;}
#primary .square-link {background: #000; color: #928b88;}
#wrapper, .container { background-color:#faf9f4;font-family:"Georgia";position:relative;color:#545350;}
.container {border-bottom: 2px solid #dddbd2;}
.small_con {width:940px;position:relative;margin:0 auto;}
a {color: #30a3d6;}

.title {background:url('images/top.jpg') 50% 0 no-repeat fixed;	color: #210606;	height: 720px;	margin: 0 auto;	padding: 0;	 background-size: cover; }
.title h1 {background: transparent url('images/title-knockout.png') no-repeat 50% 0; width: 100%; height: 720px; text-indent: -999em; overflow: hidden; display: block; margin: 0;}
.title img {display: none;}

.article-feature header .island {font-family: "Benton-Sans-Black";color: #210606; margin:35px auto 30px;width: 780px;background:transparent url('images/iphone.png') no-repeat center right;padding:0 0 0 160px;}
header .island h2 { font-weight: 900;font-size:34px;line-height: 36px;}
header .island h2 span, .byline span {display: block;}
header .island .byline span, .byline span a {color:#928b88;text-transform: uppercase;font-size:14px;text-decoration: none;line-height:24px;}
header .island p#orange {font-size:150px;color:#f04e23;font-size:72px;line-height: 36px;margin-left:-3px;}
header .island #lead {font-family:"Georgia";font-size:26px;line-height: 36px;color:#595454;width:462px;}
header .island #lead span {color:#210606;font-family: "Benton-Sans-Black";text-transform: uppercase;} 

.container p {width:620px;margin:0 auto 30px;;}
.container h3 {color:#210606;font-size:18px;line-height: 26px;text-transform: uppercase;width:620px;margin:0 auto 25px;font-weight: normal;font-family: "Benton-Sans-Black";}
.small_con a.video_link {background-color:#dbf3fd;color:#545350;text-decoration: none;border-radius:3px;padding:1px 2px;}

.container .blockquote {text-align:center;padding:30px 60px;font-style: italic;font-size:18px;line-height: 26px;font-weight: bold;color:#595454;}
.container .blockquote span.linage {background-color:#DDDBD2;display: block;width:140px;height:12px;margin:20px auto;}
.container .blockquote span.quote_icon {display:block;background:transparent url('images/quote.png') no-repeat center center;margin:0 auto 20px;width:50px;height: 50px;}
.container .blockquote span.emph {font-family: "Stag";font-weight:700;text-transform: uppercase;font-style: normal;color:#210606;}

.container .video_detail {position:absolute;right:0;width:150px;opacity:.5;cursor: pointer;}
.container .video_detail img {display:block;border-radius:40px;margin-left:35px;margin-bottom:10px;}
.container .video_detail span.caption {background:transparent url('images/video_icon.jpg') no-repeat 22px 4px;padding-left:25px;display:block;font-family:"Benton-Sans";font-weight: bold;color:#80c8e8;font-size:14px;text-align: center;}

.container .video_detail.hovered span.caption, .small_con a.video_link.hovered {color: #000;}

.container .video {background-color:#353333;display:none;margin-bottom:30px;}
.container .video .container {background-color:#353333;padding:60px 0;position:relative;width:980px;}
.container .video .video_container, .highlight_container .video_container {width:550px;height:310px;margin:0 auto;} 
.container .video a.close, .highlight_container a.mainvideoclose {background:transparent url('images/close.png') no-repeat center top;position:absolute;right:0;padding-top:25px;margin-top:-35px;font-family:"Benton-Sans";text-transform:uppercase;text-decoration: none;color:#a39d9a;font-size:12px;font-weight: bold;cursor:pointer;}
.container .video .video_container .video-caption {color: #bab9b4; font-family: "Benton-Sans-Black", sans-serif; position: absolute; top: 120px; right: 0; width: 140px; line-height: 24px; font-size: 15px;}

.photo_block {width:940px;margin:0 auto 60px;position:relative;height:440px;}
.photo_block img {float:left;}
.photo_block span.arrow_caption {width:260px;padding:30px;background-color:#210606;display:block;position:absolute;right:0;top: 112px;font-family: "Benton-Sans";font-size:16px;line-height: 26px;color:#faf9f4;margin:auto;}
.arrow-left {width: 0; height: 0; border-top: 35px solid transparent; border-bottom: 35px solid transparent; border-right:35px solid #210606;position:absolute; left:585px;top:185px;}
.photo_block span.arrow_caption .credit {color: #928b88;}
.iphone-photo {height:236px;}
.iphone-photo span.arrow_caption {top: 30px;width: 264px;}

#second {background: #454242 url('images/photo2.jpg') 50% 0 no-repeat fixed; height: 440px; margin: 0 auto 50px; overflow: hidden; padding: 0; background-size: cover;}
#second #overlay {background-color: #222; display: none; opacity: .5; width: inherit; height: inherit;}
#second.active #overlay {display: block;}

.highlight_container {color: #fff; height: 880px; margin: -440px auto; position: relative; width: 980px;}
.highlight_container .white_video_container {border: 1px solid #fff; height: 208px;margin: 20px auto; padding: 56px 40px 40px; text-align: center; width: 880px; position: absolute;}
.highlight_container .white_video_container span {display: block; padding-bottom: 10px;}
.highlight_container .white_video_container .mvideo.vicon {font-family: "Stag";font-weight:700;text-transform: uppercase;font-size: 18px;line-height: 30px; background: transparent url('images/bg-video-icon.png') no-repeat 392px 0; padding-left: 40px; padding-bottom: 24px;}
.highlight_container .white_video_container .mvideo.vtitle, .highlight_container .white_video_container .mvideo.vbyline {font-family: "Benton-Sans-Black";line-height: 30px;}
.highlight_container .white_video_container .mvideo.vtitle {font-size: 36px;}
.highlight_container .white_video_container .vmideo.vbyline {font-size: 16px;}
.highlight_container .white_video_container .mvideo.vpara {padding-left: 132px; padding-right: 132px;}
.highlight_container .play {display:none;position:absolute;cursor: pointer; width: 960px; height: 98px; background: transparent url('images/bg-play.png') no-repeat 438px 96px; padding-top: 204px; top:0; left:0; font-family: "Benton-Sans-Black";font-size: 24px; color: #fff; text-decoration: none;}
.highlight_container .play:hover, .highlight_container .play:focus {color: #fff; text-decoration: none;}
.highlight_container .v_container {display:none;position:absolute;margin:20px auto;width:inherit;}

#infographic {width:auto;background:#f0eee8 url('images/bg_info.gif') center 0 repeat-y;}
#infographic h1 {color:#f04e23;font-size:18px; line-height: 24px; padding:20px 0;margin-bottom:0;width:940px;margin:0 auto;}
#infographic .infotitle_container {background-color:#210606;}
#infographic h1 span {color:#fff;text-transform: uppercase;}
#infographic .section {clear:both;border-bottom: 1px solid #E5E2D7}
#infographic .section .section-container {width:940px;margin:0 auto;padding: 60px 0;clear:both; min-height: 390px; position: relative;}
#infographic .type1 .section-container {background: transparent url('images/bg-type1.jpg') no-repeat 241px 100%;}
#infographic .bionic-pancreas .section-container {background: transparent url('images/bg-bionicpancreas.jpg') no-repeat 241px 100%;}
#infographic .section .section-container:after {display:block;clear:both;content:" ";height:0;overflow:hidden;}
#infographic .section h2 {color:#fff;width:220px;float:left;font-size:30px;line-height: 36px;margin-bottom:0;font-family: "Benton-Sans-Black"}
#infographic .section h2 span {color:#210606;display:block; font-family: "Georgia", serif; font-size: 17px; line-height: 28px;padding-top: 20px;}
#infographic .section h2:after {content: ' '; height: 0; position: absolute; width: 0; border: 10px solid transparent; border-width: 10px 16px; border-left-color: #f04e23; top: 86px; left: 250px; margin-left: -10px; z-index: 250;}
#infographic .section .info_content {float:right;width: 380px;padding-left: 320px;}
#infographic .type1 .info_content {background: transparent url('images/bg-cell.png') no-repeat 100% 50%;}
#infographic .section .info_content h3 {font-size: 15px;font-family: "Benton-Sans-Black";text-transform: uppercase;color:#210606; margin-bottom: 0; width: auto;}
#infographic .section .info_content p {margin-bottom:0; width: auto;font-size: 15px; line-height: 24px; color: #838079;}
#infographic .bionic-pancreas .info_content p {margin-bottom: 30px;}
#infographic .bionic-pancreas .info_content p strong {font-size: 15px;font-family: "Benton-Sans-Black";text-transform: uppercase;color:#210606;}
#infographic .bionic-pancreas .info_content p strong .lowercase { text-transform: lowercase; }
#infographic .section .info_content p.cell-info {padding-bottom: 220px;}
#infographic .bionic-pancreas .info_content {padding-top: 70px;}
#infographic .section .credit {position: absolute; right: 0; bottom: 12px; font-size: 15px; font-family:"Benton-Sans"; color: #838079;}

.author-description {border-top: none;}

.article-meta-footer .article-meta {border-top: 1px solid #dddbd2;}
.article-meta-footer .article-meta .meta-download, .article-meta-footer .article-meta .meta-tags {border-left: 1px solid #dddbd2;}
.article-meta-footer .article-meta .meta-share a {color: #30a3d6;}
.article-meta .meta-tags a {background-color: #30a3d6; border-color: #1385b8;}

@media (max-width: 980px) {

.article-feature .container, .container {width:100%;padding-left:0;padding-right:0;}
.island .article-meta {padding-right:30px;padding-left:30px;}
.article-feature header .island {width:620px;background-image: none;padding:0px 20px;}
header .island h2 span {display:inline;}
header .island #lead {width:100%;}
header {width:100%;}

.touch .small_con a.video_link {background-color: transparent;text-decoration: none; border-radius: 0; padding: 0; cursor: default;}

.title {height: 640px;}
.touch .title, .touch #second {background-attachment: inherit;background-size:cover;}
.title h1 {background:none; color: #faf9f4; text-indent: 0; overflow: visible; text-transform: uppercase; text-align: center; font-family: "BentonSansComp-Black", sans-serif; position: absolute; top: 500px; font-size: 164px; line-height: 164px;}
.small_con {width:100%;}
.photo_block,.highlight_container,.photo_block img {width:100%;}
.highlight_container {width: 728px;}
.highlight_container .white_video_container {width:648px;}
.container .video_detail {display: none;}
.highlight_container .white_video_container .mvideo.vicon {background-position: 278px 0;}
.highlight_container .white_video_container .mvideo.vpara {padding-left: 60px; padding-right: 60px}
.highlight_container .play {width: 728px; height: 98px; background-position: 322px 96px;}
.highlight_container {margin:-443px auto;}
.container .video a.close, a.mainvideoclose {right:20px;}
.container .video .container {width:100%;}

.touch #second {height: 700px;}
.touch .highlight_container {margin: -730px auto 0; position: relative; height: 710px;}
.touch .highlight_container .white_video_container {padding-top: 392px; height: auto;}
.touch .highlight_container .v_container {position:absolute;top: 40px; left: 0; }
.touch .highlight_container .play {display: none;}

.photo_block {height: auto;}
.photo_block img {float: none;}
.arrow-left {display: none;}
.photo_block span.arrow_caption {width: auto; padding: 30px; position: relative; right: auto; top: auto; margin: -60px 60px 0;}

#infographic h1 {width:728px;}
#infographic .section .section-container {width: 728px; padding: 30px 0;min-height: 420px;}
#infographic .type1 .section-container {background-position: 135px 100%;}
#infographic .bionic-pancreas .section-container {background-position: 135px 100%;}
#infographic .section h2 {width:120px;font-size:24px;line-height: 30px;}
#infographic .section h2 span {line-height: 22px;}
#infographic .section h2:after {top: 54px; left: 144px;}
#infographic .section .info_content {width: 293px;padding-left: 300px;}
#infographic .bionic-pancreas .info_content p {margin-bottom: 20px;}
#infographic .section .info_content p.cell-info {padding-bottom: 240px;}
#infographic .bionic-pancreas .info_content {padding-top: 70px;}

.article-feature .author-description {padding-left: 30px; padding-right: 30px; width: auto;}

}

@media (max-width: 767px) {

.article-feature .container, .container {width:100%;padding-left:0;padding-right:0;}
.island .article-meta {padding-right:20px;padding-left:20px;}
.island .article-meta, .article-meta-footer .article-meta .meta-tags {border-top: 1px solid #dddbd2;}
.article-meta-footer .article-meta .meta-download, .article-meta-footer .article-meta .meta-tags {border-left: none;}
.article-feature .author-description {padding-left: 20px; padding-right: 20px; width: auto;}
.article-feature header .island {width:auto;}
.title {height: 256px;background-attachment: inherit;background-size:cover;}
.title h1 {top: 184px; font-size: 60px; line-height: 60px;}
header .island h2 {font-size: 22px; line-height: 28px;}
header .island .byline span, .byline span a {font-size: 14px; line-height: 24px;}
header .island p#orange {font-size: 48px; line-height: 10px;}
header .island #lead {font-size: 20px; line-height: 28px;}
.small_con {width:100%;}
.photo_block,.highlight_container,.photo_block img {width:100%;}

.container .video_detail {display: none;}
.container p {width:auto;padding:0 20px;}
.highlight_container .v_container a.mainvideoclose {right:20px;}
.container h3 {width:auto;padding:0 20px;}
.small_con a.video_link {background-color: transparent;text-decoration: none; border-radius: 0; padding: 0; cursor: text;}

#second {display: none;}
.highlight_container {background: #353333; margin: 0 auto; width: auto; height: auto; position: relative;}
.highlight_container .white_video_container {border: 1px solid #fff; border-width:0; height: auto; margin: 20px auto; padding: 20px; width: auto; position: relative;}
.highlight_container .white_video_container span {display: block;padding-bottom:10px;}
.highlight_container .white_video_container .mvideo.vicon {font-size: 15px; line-height: 30px;width: 120px; margin: 0 auto; background-position: 32px 20px; padding-top: 20px;}
.highlight_container .white_video_container .mvideo.vtitle, .highlight_container .white_video_container .mvideo.vbyline {font-family: "Benton-Sans-Black";line-height: 30px;}
.highlight_container .white_video_container .mvideo.vtitle {font-size: 24px;}
.highlight_container .white_video_container .vmideo.vbyline {font-size: 15px;}
.highlight_container .white_video_container .mvideo.vpara {padding-left:0; padding-right: 0;}
/* .highlight_container .play {display:block; background: transparent url('images/thumb-video-300.jpg') no-repeat 50% 0; text-align: center; font-size: 15px; line-height: 18px; color: #fff; text-decoration: underline; padding-top: 178px; width: auto; height: auto; position: relative; padding-bottom: 20px;} */
.highlight_container .play {display: none; width: 0; height: 0; font-size: 0; text-indent: -999px; overflow: hidden;}
.highlight_container .v_container {position:relative;margin:0;width:inherit;}
.highlight_container .video_container {position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; width: auto;}
.highlight_container .video_container iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.photo_block {margin:0 auto 20px;}
.photo_block span.arrow_caption {padding: 20px; margin:-8px 0 0;}

#second {background-attachment: inherit;background-size:cover;}

#infographic {background-image:none;}
#infographic h1 {width: auto; padding: 20px;}
#infographic .section {clear:both;border-bottom: 1px solid #E5E2D7;}
#infographic .section .section-container {width:100%;margin:0;padding:0;min-height: 390px; padding-bottom: 480px;}
#infographic .type1 .section-container {background-position: 0 100%;}
#infographic .bionic-pancreas .section-container {background-position: 0 100%;}
#infographic .section h2 {float:none;background-color:#f04e23;width:auto; padding: 20px;}
#infographic .section h2 span {color:#000;display:block; font-family: "Georgia", serif; font-size: 17px; line-height: 28px;padding-top: 10px;}
#infographic .section h2:after {border-width: 16px 10px; border-left-color: transparent; border-top-color: #f04e23; top: 68px; left: 30px; margin-left: 0;}
#infographic .bionic-pancreas h2:after {top: 134px;}
#infographic .section .info_content {float:none; width:auto; padding-left: 0;}
#infographic .type1 .info_content {background: transparent url('images/bg-cell.png') no-repeat 50% 50%;}
#infographic .bionic-pancreas .info_content p strong {font-size: 15px;font-family: "Benton-Sans-Black";text-transform: uppercase;color:#210606;}
#infographic .section .info_content p.cell-info {padding-bottom: 260px;}
#infographic .section .info_content {padding-top: 30px;}
#infographic .section .credit {right: 20px;}



}
