


@media only screen and (min-width:984px){
  .mobileOnly{
     display:none!important;
  }
}


@media only screen and (max-width:983px){
  .desktopOnly{
     display:none!important;
  }
}



#modalBox{
  position:fixed;
  top:3%;
  left:3%;
  right:3%;
  bottom:3%;
  z-index:5;
  display:none;
}

@media only screen and (min-width:984px){
   #modalBox{
       top:10%;
       left:10%;
       right:10%;
       bottom:10%;
   }
}

#modalBox .mbInner{
  position:absolute;
  top:25px;
  bottom:0;
  left:0;
  right:0;
  background-color:#ffffff;
  height:calc(100% - 25px); 
  overflow:auto;
}

#modalBox.active{
  display:block;
}


#modalBox .mbClose {
   position: absolute;
   top: 0;
   right: 0;
   background-color: #e72582;
   color: #ffffff;
   cursor: pointer;
   font-size: 16px;
   padding: 0 4px 4px 4px;
   text-align: center;
   width: 25px;
   height: 25px;
   border-radius: 3px 3px 0 0;
}

#modalBox .mbContent{
  padding:10px;
  height:100%;
  overflow:auto;
}


#modalBox.title-active .mbTitle{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  color:#ffffff;
  background-color:#5a328a ;
  font-weight:bold;
  padding:0 10px 0 10px;
  height:30px;
  line-height:30px;
}


#modalBox.title-active .mbContent{
  height:calc(100% - 30px);
}

#modalBox.pages-active .mbContent{
  height:calc(100% - 30px);
}

#modalBox.title-active.pages-active .mbContent{
  height:calc(100% - 60px);
}

#modalBox.pages-active .mbControls{
  display:block;
  background-color:#e72582;
  color:#ffffff;
  height:30px;
  line-height:30px;
  padding:0 10px 0 10px;
  display:flex;
  justify-content:flex-start;
}

#modalBox.pages-active .mbControls .pageDetails{
  margin-right:30px;
  width:120px;
}


#modalBox.pages-active .mbControls .pageNav{
  width:20px;
   visibility:hidden;
}

#modalBox.pages-active .mbControls .pageNav.active{
   visibility:visible;;
}


#modalBox.pages-active .mbControls .pageNav{
  cursor:pointer;
  margin-right:24px;
}

#modalBox.pages-active .mbControls .pageNav::before{
  content:"\e013";
  font-family:"bat-icon-set-2020";
  font-size:20px;
  font-weight:bold;
  line-height:35px;
  height:30px;
  width:30px;
}

#modalBox.pages-active .mbControls .pageNav.pagePrev{
  transform:rotate(180deg);
}


#modalBox.pages-active .mbPageActive{
  display:block;
}
#modalBox.pages-active .mbPageInactive{
  display:none;
}


.js #overlay {
   background-color: #121825;
   width: 100%;
   height: 100%;
   position: fixed;
   top: 0;
   left: 0;
   opacity: 0.5;
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
   display: none;
   z-index: 5;
}

.js #overlay.active{
   display:block;
}

.js #overlay.dark {
   background-color: #0e2b63;
   opacity: 0.92;
}




.js .videoBox{
   display:none; 
}

div[data-type="video"], div[data-type="video-external"]{
  position:relative;
}


div[data-type="video"] img, div[data-type="video-external"] img{
   margin-left:auto;
   margin-right:auto;
}


div[data-type="video"]::after, div[data-type="video-external"]::after{
   content:" ";
   background-image:url(../imgs/btn-play-video.png);
   background-repeat:no-repeat;
   background-size:cover;
   position:absolute;
   z-index:2;
   height:128px;
   width:128px;
   opacity:0.75;
   top:calc(50% - 64px);
   left:calc(50% - 64px);
}


#vlLightBox.active {
   display: block;
}
#vlLightBox {
   position: fixed;
   top: 5%;
   bottom: 5%;
   right: 5%;
   left: 5%;
   z-index: 10;
   display: none;
}
#vlLightBox .lightboxClose {
   position: absolute;
   top: 0;
   right: 0;
   background-color: #e72582;
   color: #ffffff;
   cursor: pointer;
   font-size: 16px;
   padding: 0 4px 4px 4px;
   text-align: center;
   width: 25px;
   height: 25px;
   border-radius: 3px 3px 0 0;
}
#vlLightBox .lightboxInner {
   position: absolute;
   top: 25px;
   left: 0;
   background-color: #ffffff;
}

#vlLightBox video {
   position: absolute;
   top: 0;
   left: 0;
}
#vlLightBox .title {
   position: absolute;
   bottom: 4px;
   width: 100%;
   height: 60px;
   padding: 0 10px 0 10px;
   display: flex;
   align-items: center;
}






#g9sreadmore{
  margin-top:16px;
}

.g9sPages h5{
  color:#e62882;
  font-weight:700;
  font-size:32px;
}
.g9sPages h6{
  font-weight:700;
  font-size:16px;
}

#graphic9step{
  background-color:#e62882;
  position:relative;
}

#graphic9step .g9sImage img{
 width:100%;
}

#graphic9step .g9stext{
  color:#ffffff;
}

#graphic9step .g9stContent{
  font-size:13px;
}

#graphic9step .g9stext1{
  position:absolute;
  bottom:-12px;
  left:0;
  transform: rotate(270deg);
  transform-origin:0 0;
}

#graphic9step .g9stext1 .g9stContent::before{
 content:"Weight of importance in demonstrating RRP status*";
}


#graphic9step .g9stext2{
  position:absolute;
  top:4px;
  left:13%;
  width:16%;
}

#graphic9step .g9stext3{
  position:absolute;
  top:4px;
  left:29.3%;
  width:16%;
}

#graphic9step .g9stext4{
  position:absolute;
  top:4px;
  left:45.6%;
  width:20%;
}

#graphic9step .g9stext5{
  position:absolute;
  top:4px;
  right:5%;
  text-align:right;
}

#graphic9step .g9stext6{
  position:absolute;
  bottom:1px;
  right:2%;
  text-align:right;
}


.mobileLegend{
  display:none;
}


.g9stHeading{
  position:relative;
}
.g9stHeading::before{
     width:20px;
     height:20px;
     display:block;
     border:1px solid #59338a;
     border-radius:10px;
     text-align:center;
     line-height:19px;
     position:absolute;
     top:2px;
     left:0;
  }

.g9stext2 .g9stHeading::before{
       content:"A";
   }
.g9stext3 .g9stHeading::before{
       content:"B";
   }
.g9stext4 .g9stHeading::before{
       content:"C";
   }

#graphic9step .g9stHeading::before{
  display:none;
}

@media only screen and (max-width:983px){

#graphic9step .g9stext1 .g9stContent::before{
 content:"Weight … (see Legend)";
  font-size:11px;
}


   #graphic9step .g9stext2 .g9stContent,   #graphic9step .g9stext3 .g9stContent,   #graphic9step .g9stext4 .g9stContent{
   display:none;
  }

   #graphic9step .g9stext2 .g9stHeading span,
#graphic9step .g9stext3 .g9stHeading span,
#graphic9step .g9stext4 .g9stHeading span{
      display:none;
   }

#graphic9step .g9stHeading::before{
  display:block;
  border-color:#ffffff;
}

.mobileLegend{
  display:block;
}

.g9stHeading{
  padding-left:36px;
}
.mobileLegend .g9stContent{
  margin-left:36px;
}

.mobileLegend .g9stext1 .g9stHeading{
  padding-left:0;
}

.mobileLegend .g9stext1 .g9stHeading::before{
 content:"Weight… = Weight of importance in demonstrating RRP status*";
 position:relative;
 width:100%;
 text-align:left;
 border:none;
 height:initial;
}
}



@media only screen and (max-width:759px){

	.tbPopout .tbPText{
		font-size: 16px;
		line-height: 1.5;
		letter-spacing: normal;
	}
}


.cscheme-pipu .tbPopout .tbTitle, .cscheme-pupu .tbPopout .tbTitle{
	color:#e72582;
}
.cscheme-pipu .tbPopout .tbSubtitle, .cscheme-pupu .tbPopout .tbSubtitle{
	margin:8px 0 16px 0;
}


.linkButton{
  padding:20px;
  display:inline-block;
}

.linkButton a{
  display:inline-block;
}



.linkButton.cscheme-pipu, .linkButton.cscheme-pupu{
   background-color:#e72582;
}
.linkButton.cscheme-pipu a, .linkButton.cscheme-pupu a{
   color:#ffffff;
}
.linkButton a:hover{
  text-decoration:none;
}




