@charset "UTF-8";

.banner {
  border: 1px solid #333333;
  background: #FFFFFF;
  overflow: hidden;
  display: block !important;
}

#frame_bottom {
  background: white;
  width: 728px;
  height: 4px;
  bottom: 0px;
}

#frame_top {
  background: white;
  width: 728px;
  height: 4px;
  top: 0px;
}

#frame_right {
  background: white;
  width: 4px;
  height: 724px;
  right: 0px;
}

#frame_left {
  background: white;
  width: 4px;
  height: 90px;
  top: 0px;
}

.bannerSize {
  width: 728px;
  height: 90px;
}

.hide {
  opacity: 0;
}

.noBR {
  white-space: nowrap;
}

.aC {
  margin: 0 auto;
  left: 0;
  right: 0;
}

.retina {
  background-size: contain !important;
}

#btnExit {
  cursor: pointer;
  opacity: 0;
}

.bg {
  top: 0;
  left: 0;
  width: 728px;
  height: 90px;
}

#bg01 {
  top: 3px;
  left: 3px;
  width: calc(1440px/2);
  height: calc(164px/2);
  background: url('../img/bg01.jpg');
  background-size: cover;
}

#bg02 {
  background: url('../img/bg02.jpg');
}

#logoCont {
  top: 4px;
  left: 0px;
  width: 119px;
  height: 42px;
  background: #fff;
}

#logoPhesgo {
  top: 1px;
  left: 8px;
  width: 103px;
  height: 35px;
  background: url('../img/logoPhesgo.svg')
}

#actorPortrayal {
  top: 75px;
  left: 413px;
  width: 47px;
  height: 9px;
  background: url('../img/actorPortrayal.svg')
}

#_5MinutesLockup {
  top: 241px;
  left: -284px;
  width: 1087px;
  height: 900px;
  background: url('../img/_5MinutesLockup.svg');
}

#headline01 {
  top: 19px;
  left: 127px;
  width: 329px;
  height: 52px;
}

#headline01_1 {
  top: 0px;
  left: 0px;
  width: 329px;
  height: 23px;
  background: url('../img/headline01.svg') 0px 0px / 329px 52px;
  /*background-size: 100% 100%;  */
}

#headline01_2 {
  top: 23px;
  left: 0px;
  width: 329px;
  height: 30px;
  background: url('../img/headline01.svg') 0px -23px / 329px 52px;
  /*background-size: 100% 100%;  */
}

/*
  #headline01_3 {
    top: 43px;
    left: 0px;
    width: 182px;
    height: 23px;
    background: url('../img/headline01.svg') 0px -43px / 182px 66px;
    background-size: 100% 100%;
  }
*/
#headline02 {
  top: 16px;
  left: 128px;
  width: 191px;
  height: 56px;
}

#headline02_1 {
  top: 0px;
  left: 0px;
  width: 191px;
  height: 18px;
  background: url('../img/headline02.svg') 0px 0px / 191px 56px;
}

#headline02_2 {
  top: 18px;
  left: 0px;
  width: 191px;
  height: 20px;
  background: url('../img/headline02.svg') 0px -18px / 191px 56px;
}

#headline02_3 {
  top: 38px;
  left: 0px;
  width: 191px;
  height: 20px;
  background: url('../img/headline02.svg') 0px -38px / 191px 56px;
}

#headline03 {
  top: 13px;
  left: 127px;
  width: 212px;
  height: 34px;
}

#headline03_1 {
  top: 0px;
  left: 0px;
  width: 212px;
  height: 17px;
  background: url('../img/headline03.svg') 0px 0px / 212px 34px;
}

#headline03_2 {
  top: 17px;
  left: 0px;
  width: 212px;
  height: 18px;
  background: url('../img/headline03.svg') 0px -17px / 212px 34px;
}

#copy04 {
  top: 54px;
  left: 128px;
  width: 243px;
  height: 28px;
  background: url('../img/copy04.svg');
}

#headline05 {
  top: 25px;
  left: 127px;
  width: 244px;
  height: 41px;
}

#headline05_1 {
  top: 0px;
  left: 0px;
  width: 244px;
  height: 19px;
  background: url('../img/headline05.svg') 0px 0px / 244px 41px;
}

#headline05_2 {
  top: 19px;
  left: 0px;
  width: 244px;
  height: 22px;
  background: url('../img/headline05.svg') 0px -19px / 244px 41px;
}

/*
  #headline05_3 {
    top: 38px;
    left: 0px;
    width: 136px;
    height: 18px;
    background: url('../img/headline05.svg') 0px -38px / 136px 76px;
  }
*/
/*
  #headline05_4 {
    top: 56px;
    left: 0px;
    width: 136px;
    height: 19px;
    background: url('../img/headline05.svg') 0px -56px / 136px 76px;
  }
*/
#headline06 {
  top: 15px;
  left: 127px;
  width: 219px;
  height: 40px;
}

#headline06_1 {
  top: 0px;
  left: 0px;
  width: 219px;
  height: 20px;
  background: url('../img/headline06.svg') 0px 0px / 219px 40px;
}

#headline06_2 {
  top: 21px;
  left: 0px;
  width: 219px;
  height: 20px;
  background: url('../img/headline06.svg') 0px -21px / 219px 40px;
}

#cta {
  top: 58px;
  left: 126px;
  width: 110px;
  height: 19px;
  border-radius: 10px;
  background: #22a7a4;
}

#ctaText {
  top: 5px;
  width: 61px;
  height: 8px;
  background: url('../img/cta.svg');
}

/*::::::::::::::::ISI:::::::::::::*/
#isi {
  top: 0px;
  left: 462px;
  width: 266px;
  height: 90px;
  overflow: hidden;
  background: #fff;
}

#isi-text {
  top: 0px;
  width: 300px;
  height: 100%;
  overflow-x: hidden;
  padding: 26px 60px 10px 10px;
  /* space left || space top based on #header_ISI heigth ||  offset right to hide defaul scrollbar */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#isi-container {
  width: calc(300px - 60px - 10px);
  /* FORMULA: #isi-text: width - #isi-text: paddingLeft - #isi-text: paddingRight */
  position: relative;
  padding-bottom: 8px;
}

#isi-container,
#header_ISI {
  font-family: 'Josefin Sans', sans-serif;
}

#isi-container {
  font-size: 11px;
  font-weight: 300;
  line-height: 11px;
  color: #5c5c5c;
}

#isi-container b {
  color: #2a2a2a;
}

#isi-container h2 {
  font-size: 11px;
  font-weight: 700;
  color: #2a2a2a;
}

#isi-container h3 {
  font-size: 11px;
  font-weight: 500;
  color: #2a2a2a;
}

.paragraphBlack {
  font-weight: 500;
  color: #2a2a2a;
}

#header_ISI {
  top: 0px;
  width: 266px;
  height: 23px;
  background: #FFF;
  position: absolute;
  padding: 6px 0px 2px 10px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-bottom: solid 1px #eeeeee;
}

#header_ISI span {
  top: 5px;
  left: 9px;
  position: absolute;
  font-size: 12px;
  line-height: 13px;
  letter-spacing: -0.5px;
}

#isi-container p {
  position: relative;
}

#isi-container sup {
  top: -0.9em;
  font-size: 11px;
  letter-spacing: 0.1px;
  line-height: 0;
  margin-left: 1px;
  position: relative;
}

#isi-container u {
  text-decoration: none;
}

#isi-container h3.h-short-space {
  margin: 4px 0 4px 0;
}

#isi-container h3.h-medium-space {
  margin: 8px 0 8px 0;
}

#isi-container h3.h-large-space {
  margin: 12px 0 12px 0;
}

#isi-container h3.h-short-space-paragraph {
  margin: 20px 0 4px 0;
}

#isi-container h3.h-medium-space-paragraph {
  margin: 20px 0 8px 0;
}

#isi-container h3.h-large-space-paragraph {
  margin: 20px 0 12px 0;
}

#isi-container .p-mini-space {
  margin-bottom: 3px;
}

#isi-container .p-short-space {
  margin-bottom: 4px;
}

#isi-container .p-medium-space {
  margin-bottom: 6px;
}

#isi-container .p-large-space {
  margin-bottom: 10px;
}

#isi-container .p-Xlarge-space {
  margin-bottom: 30px;
}

#isi-container .p-indent {
  margin-left: 10px;
}

#isi-container .p-double-indent {
  margin-left: 20px;
}

#isi-container span.bullet, #isi-container span.bullet.dash {
  top: 1px;
  left: -10px;
  position: absolute;
  line-height: 10px;
  color: #2a2a2a;
}

#isi-container span.bullet.dash {
  top: 4px;
  font-size: 16px;
  left: -11px;
}

#isi-container a {
  text-decoration: none;
}

#isi .pointer {
  cursor: pointer;
}

#isi-controls {
  top: 30px;
  right: 7px;
  /*offset to right marging*/
  width: 10px;
  height: 61%;
}

#arrowUp,
#arrowDown {
  left: 0px;
  width: 7px;
  height: 3px;
  padding: 3px 0px 4px;
  background: url("../img/arrow.svg") center center;
  cursor: pointer;
}

#arrowUp {
  top: 1px;
}

#arrowDown {
  bottom: 1px;
  -webkit-transform: scaleY(-1);
  -moz-transform: scaleY(-1);
  transform: scaleY(-1);
}

.scroller {
  top: 0;
  right: -2px;
  width: 5px;
  height: 23px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
  background: #EFAE6B;
  -webkit-transition: top 0.08s;
  -moz-transition: top 0.08s;
  -ms-transition: top 0.08s;
  -o-transition: top 0.08s;
  transition: top 0.08s;
  cursor: pointer;
}

.isiLineWithArrows,
.isiLineNoArrows {
  right: 1px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  cursor: pointer;
}

.isiLineWithArrows {
  top: 10%;
  height: 80%;
  width: 5px;
  background: #f6f6f6;
}

.isiLineNoArrows {
  background: #d7d7d7 !important;
  top: 0px;
  width: 1px;
  right: 7px;
  height: 100%;
}

#logoGenentech {
  width: 92px;
  height: 24px;
  position: relative;
  background: url('../img/logoGenentech.svg') 0 0 / contain;
  margin: 20px 0px;
}

.underline {
  text-decoration: underline;
}

.ISIColor {
  /* Special color for links, numbers, title etc */
  color: #5c5c5c !important;
}
