/* CSS Selectors https://www.w3schools.com/cssref/css_selectors.asp */
/*Tivdak's CSS*/
a {
    display: block; height: 100%; width: 100%; cursor: pointer;
}
a:hover {
    display: block; height: 100%; width: 100%; cursor: pointer;
}

}
.dpblock {display: block;}
.pfixed {position: fixed;}




@media (max-width: 1200px) {
/*   the site is set at 1440 wide, So.... going to hide it*/
    div.desktop {display: none;}
    
    
}

.mjumpHolder {display: none;}

#header
{
    width: 100%;
    z-index: 12;
	background: url('../img/Main_Nav_Patient_background.png') repeat-x;
    background-size: auto 210px; 
}

.navHolder{
    width:1440px; margin: 0 auto;
    z-index: 10;
    background: url("../img/Main_Nav_Patient_Support.png") center top no-repeat #000000; 
    background-size: 1440px 210px; 
    height: 210px;
    }

/** sticky header
===========================================================================
*/
#stickyNav {
    position: sticky;
    top: 0;
    z-index: 9;
    width: 100%;
    background: url("../img/2nd_Nav_Patient_Support.png") center 0px no-repeat #EEEEEE; 
    background-size: 1440px; 
    height: 60px;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,0.12);
/*     transition: all 0.5s ease;*/
}



.content {
    width:1440px; margin: 0 auto;
}


.splitter {
    width: 100%;
    background: url('../img/HCP_desktop_splitter.png') repeat-x;
    background-size: 40px 90px; 
    height: 90px;
    
}

.page_footer { background: url("../img/bottom.png") center top/1440px 2340px no-repeat #eeeeee; 
    background-size: ; 
    height: 2340px; }

.isiHolder {width: 100%;
    z-index: 110;
    position: fixed;
    bottom: 0;
    background-color: #ffffff;
    box-shadow: 0px -2px 4px 0px rgba(85, 87, 90, 0.25);
}


.isi {
    position: relative;
    width:1440px; 
    height: 133px;
    margin: 0 auto;
   background: url("../img/HCP_desktop_isiTray.png") center top/1440px 133px no-repeat;
}

/* CTA's Start here ===========================================*/
/*=============================================================*/

.jumpHolder{
    width:1440px; margin: 0 auto;
    display: flex;
    }

.cta {
    position: relative; display: block; cursor: pointer; height: 30px; top: 20px;
}

.stickyLink01 {
    width: 95px; left: 151px;
}
.stickyLink02 {
    width: 123px; left: 178px; 
}
.stickyLink03 {
    width: 102px; left: 207px;
}
.stickyLink04 {
    width: 170px; left: 232px;
}
.stickyLink05 {
    width: 170px; left: 258px;
}

/* Media query for a single breakpoint */

@media (max-width: 768px) {
    div.desktop {display: none;}
    
    .mobile {
        width: 100%;
         margin: 0 auto;
        max-width: 390px;
    }
    #mheader
    {
        width: 100%;
        background: url('../img/Header_mobile_HCP_background.png') repeat-x;
        background-size: auto 199px;
        
    }

    .mheaderHolder{
        width:390px; margin: 0 auto;
        z-index: 10;
        background: url("../img/Header_mobile_HCP_Efficacy.png") center top no-repeat #000000; 
        background-size: 390px 199px; 
        height: 199px;
    }
    

    
    #mstickyHolder{
        position: sticky;
        top: 0;
        width: 390px;
        height: 60px;
        overflow: hidden;
        background-color: #eeeeee;
    }
    
    #mstickyNav {
        overflow-x: scroll;
        overflow-y: hidden;
        height: 90px;
    }
    
    .mjumpHolder {
        display: block;
        background: url("../img/mobile_2nd_Nav_HCP_Efficacy.png") 0px 0px no-repeat ; 
        background-size: 784px;
        width: 784px;
        height: 60px;
        display: flex;
        transition: transform 0.5s ease;
        transform: translateX(0px); /*Going to use this to slide*/
    }
    
    .mcontent {
    width:390px;
    }
    .msection1{
        height: 3000px;
    }
    
    .cta {
    position: relative; display: block; cursor: pointer; height: 30px; top: 20px;  border: 1px dashed red;
    }

    .mobileLink01 {
        width: 150px; left: 168px;
    }
    .mobileLink02 {
        width: 123px; left: 215px; 
    }
    .mobileLink03 {
        width: 205px; left: 253px;
    }
    .mobileLink04 {
        width: 170px; left: 288px;
    }
}


}
/* end mobile only*/






/* Main nav  ==================================================*/
/*=============================================================*/


ul.mainNav {
   list-style: none;  margin: 0 auto; padding: 0; height: 84px; width: 1000px;
}
ul.mainNav > li {
    float: left; width: 146px; height: 84px;  cursor: pointer;
    background: url("../img/mainNavsprite.png") no-repeat 0 0;
    background-size: 1000px 168px;
}



ul.mainNav>li.navSlot2:hover, ul.mainNav>li.navSlot2Hot:hover, ul.mainNav>li.navSlot2Hot { width: 181px; background-position: -186px -84px;}
ul.mainNav>li.navSlot3:hover, ul.mainNav>li.navSlot3Hot:hover, ul.mainNav>li.navSlot3Hot { width: 287px; background-position: -367px -84px;}
ul.mainNav>li.navSlot4:hover, ul.mainNav>li.navSlot4Hot:hover, ul.mainNav>li.navSlot4Hot { width: 166px; background-position: -654px -84px;}
ul.mainNav>li.navSlot5:hover, ul.mainNav>li.navSlot5Hot:hover, ul.mainNav>li.navSlot5Hot { background-position: -821px -84px;}

.logoDesk{ margin: 0 auto; padding: 0; width: 184px; height: 84px;
    background: url("../img/logo.png") no-repeat 0 0;
    background-size: 165px 168px;}
    .logoDesk:hover {background-position: 0px -84px;}

ul.mainNav>li.navSlot1 { width: 186px; background: none;}
ul.mainNav>li.navSlot2, ul.mainNav>li.navSlot2Off { width: 181px; background-position: -186px 0;}
ul.mainNav>li.navSlot3, ul.mainNav>li.navSlot3Off { width: 287px; background-position: -367px 0;}
ul.mainNav>li.navSlot4, ul.mainNav>li.navSlot4Off { width: 166px; background-position: -654px 0;}
ul.mainNav>li.navSlot5, ul.mainNav>li.navSlot5Off { width: 146px; background-position: -821px 0;}
ul.mainNav>li.navSlot6 { width: 34px; background-position: -967px 0;}

ul.mainNav>li.navSlot2Off .hot {display: none;}
ul.mainNav>li.navSlot3Off .hot {display: none;}
ul.mainNav>li.navSlot4Off .hot {display: none;}
ul.mainNav>li.navSlot5Off .hot {display: none;}

div.sub-nav {
    width: 100%;
    position: absolute;
    height: 38px;
    left: 0;
    background-color: #fff;
    padding: 0;
    z-index: 0;
    display: none;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16);
}
div.hot {display: block;}

div.sub-nav ul{
    list-style: none;  margin: 0 auto; padding: 0; height: 38px; width: 1000px;
}
div.sub-nav ul li {
    list-style: none;  margin: 0 auto; padding: 0; height: 38px;float: left;
}