@charset "UTF-8";
/* CSS Document */



body {font-family: Sans-Serif; margin: 0;}
main {width: 1020px; margin: 0 auto; }
a {text-decoration: none; color: #373737;}
a:hover {color: #000000; text-decoration: underline;}
.fl {float: left;}

a.takemehome {display: inline-block; width: 180px; height: 100%;
    background-image: url("image/TV_Logo_white.svg");
    background-position: top left;
    background-repeat: no-repeat;
    }
a.takemeECP{
    width: 100%;
    height: 100%;
    display: block;
}
span.eyebrow {float: right;height:98px; width: 820px;
   background-size: 820px 98px;
    background-position: center;
    background-repeat: no-repeat;
}
span.eyebrow-home {
    background-image: url("image/sticky_nav_homeload.png");
}
span.eyebrow-dosing {
    background-image: url("image/sticky_nav_dosing.png");
}
span.eyebrow-access {
    background-image: url("image/sticky_nav_access.png");
}
span.eyebrow-event {
    background-image: url("image/sticky_nav_event.png");
}

.safety {display: block; height: 34px;}

header {width: 100%;
    z-index: 110;
    height: 98px;
    background-image: url("image/stickynav_bg.png");
    background-position: center 100px;
    background-repeat: no-repeat;
    background-size: 1920px 71px;
    transition: all 350ms ease;
    position: relative;
}

.holder{
    height: 98px;
    width: 1024px;
    margin: 0 auto;
    padding-left: 30px;
    transition: all 350ms ease;
}



header.shrink { 
    box-shadow: rgba(0, 0, 0, 0.28) 0px 0px 5px 1px;    
    background-position: center 0px;
    position: fixed;
    top: 0;
    height: 71px;
    transition: all 150ms ease;
     
}
.holder.shrink {height: 71px;
    transition: all 150ms ease;}
span.eyebrow.shrink  {
    height: 71px;

}


footer {
    display: none;
    height: 332px;
   background: #ffffff url("img/footer.png") 0 0 no-repeat;}

footer.onpage {
   height: 400px;
    width: 100%;
    display: block;
   background: #edf6fa url("img/footer.png") top center no-repeat;
}




.ISI {width: 100%;
    height: 148px;
    z-index: 110;
    background-image: url("image/ISItray.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 1920px 369px;
    position: fixed;
    bottom: 0;
}





/* ----- Begin Page Content -----*/
/* ------------------------------------------------ */


#home div.content {
    height: 3112px;
/*    background: transparent url("img/00_home.png") 0px -167px no-repeat;*/
}
#dosing div.content {
    height: 2823px;
}
#access div.content {
    height: 3986px;
}
#event div.content {
    height: 2455px;
}

#Retina_54 div.content {
    height: 4150px;
    background: transparent url("img/54_Retina.png") 0px 5px no-repeat;
}







/* ECP Content --------------------------------*/
/*---------------------------------------------*/

a.cta {
    display: block;
    position: relative;
    width: 200px;
    height: 100px;
    cursor: pointer;
    border: 1px dashed green;
}



#Retina_54 a.cta.rx_macugen {top: 332px; width: 213px; float: left; left: 310px; height: 36px}
#Retina_54 a.cta.ecp_macugen {top: 332px; width: 180px; left: 600px; height: 36px}


/* End Content --------------------------------*/
/*---------------------------------------------*/



box {
    position: relative;
    display: block;
    height: 530px;
    width: 601px;
    top: -3184px;
    left: 421px;
    margin-top:0;
}
box.shrink{margin-top: 98px;}
div.mask {
    position: relative;
    display: block;
    height: 833px;
    width: 1024px;
    top: -3778px;
    left: 0px;
    margin-top:0;
}


.shine {
      background-color: rgba(255,255,255,.3);
    background-image: radial-gradient( circle, rgba(255,255,255,.4) 0%, rgba(255,255,255,.5) 1%, rgba(255,255,255,.8) 3%, rgba(255,255,255,1) 5%, rgba(255,255,255,.5) 27%, rgba(255,255,255,0.6) 63%);
/*    background-image: radial-gradient(circle,rgba(9,54,108,.1) 0%, rgba(45,78,135,.5) 1%, rgba(255,255,255,1) 6%, rgba(255,255,255,.6) 11%, rgba(255,255,255,.2) 17%, rgba(9,54,108,.4) 27%, rgba(9,54,108,0.6) 45%);*/
/*    background-image: radial-gradient(#181818 0%, #edeef1 50%, #181818 100%);*/
  background-repeat: no-repeat;
  background-size: 100%; 
  display: inline-block;
  position: relative; 
    background-position: center;
  
  animation-duration: 4s;
  animation-fill-mode: forwards; 
  animation-iteration-count: infinite;
  animation-name: placeholderShimmer;
  animation-timing-function: ease-in;
    animation-direction: alternate;
}




@keyframes placeholderShimmer {
  0% {
  background-size: 100%;
    
  } 
  
  80% {
  background-size: 1500%;
   
  }
  
  100% {
  background-size: 2500%;
   
  }
}
