html,
body {
   margin: 0;
   padding: 0;
}

body.no-transition * {
   transition: none !important;
}

/* show full isi for QAing */
#main.full-isi,
#isi_container.full-isi {
   overflow: visible !important;
   border: none;
}

#main {
   background: #000000;
   display: block;
   height: 250px;
   opacity: 0;
   overflow: hidden;
   position: relative;
   transition: opacity 0.4s;
   width: 300px;
}

#main.loaded {
   opacity: 1;
}


#main * {
   position: absolute;
   transition: all 0.7s;
}

#border {
   border: 1px solid #000000;
   width: calc(100% - 2px);
   height: calc(100% - 2px);
   pointer-events: none;
   z-index: 9999;
}

#click_overlay {
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   transition-duration: 750ms;
   width: 100%;
   z-index: 2;
}

#isi {
   background: #FFFFFF;
   border-left: 0px solid #F5F7F2;
   border-right: 0px solid #F5F7F2;
   bottom: 0px;
   height: 0;
   left: 1px;
   transition-duration: 750ms;
   width: 298px;
   z-index: 999;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
}

#isi.show {
   height: 93px;
}

#isi.expand {
   height: 249px;
}

#isi * {
   position: static;
}

#isi_expand_button {
   padding: 0px;
   position: absolute;
   top: 10px;
   right: 4px;
   width: 9px;
   height: 9px;
   z-index: 1;
   border: none;
   cursor: pointer;
   transition: none;
   background-color: #FFFFFF;
}

#isi.expand #isi_expand_button span:first-child {
   transform: rotate(45deg);
}

#isi.expand #isi_expand_button span:last-child {
   transform: rotate(45deg);
}

#isi_expand_button span {
   position: absolute;
   background-color: #991E66;
   transition: none;
}

#isi_expand_button span:first-child {
   top: 4px;
   left: 0px;
   width: 9px;
   height: 1px;
}

#isi_expand_button span:last-child {
   top: 0px;
   left: 4px;
   width: 1px;
   height: 9px;
}

#isi_container {
   position: relative;
   height: 100%;
   overflow: hidden;
}

#isi_wrapper {
   position: relative;
   padding: 10px 15px 8px 10px;
   font-family: Arial, sans-serif;
   font-size: 10px;
   line-height: 12px;
   color: #000000;
}

#isi_wrapper h2 {
   margin: 0;
   font-size: 10px;
   font-weight: 700;
   line-height: 12px;
   color: #991E66;
   padding-top: 1px;
}

#isi_wrapper h2 sup {
   font-size: 60%;
   line-height: 0;
}

#isi_wrapper ul {
   list-style: none;
   margin: 0;
   padding: 0;
}

#isi_wrapper ul li {
   display: block;
   position: relative;
   padding-left: 8px;
}

#isi_wrapper ul li::before {
   content: '\2022';
   position: absolute;
   top: 0;
   left: 0px;
   /* font-size: 8px;
    line-height: 9px; */
   color: #AADB1E;
}

#isi_wrapper a {
   text-decoration: underline;
   color: #000000;
}

#isi_wrapper a#full_pi_link_isi {
   color: #991E66;
}

#isi_wrapper p {
   margin: 0;
   margin-top: 2px;
}

#isi_wrapper sup {
   position: relative;
   top: 0.3em;
   font-size: 60%;
   line-height: 0;
}

.ps__rail-x {
   display: none;
}

.ps__rail-y {
   position: absolute !important;
   right: 4px;
   width: 4px;
   margin: 26px 0 6px;
   background: #F1F2F2;
   transition: none;
}

.ps__rail-y .ps__thumb-y {
   position: absolute !important;
   width: 100%;
   background: #AADB1E;
   transition: none;
}

#guide {
   position: absolute;
   top: 0px;
   left: 0px;
   z-index: 99999;
   opacity: .3;
   ;
}

#guide.frame1 {
   top: -17px;
   left: 0px;
}

#guide.frame2 {
   top: -17px;
   left: -340px;
}

#guide.frame3 {
   top: -17px;
   left: -680px;
}

#guide.frame4 {
   top: -368px;
   left: 0px;
}

#guide.frame5 {
   top: -368px;
   left: -340px;
}

#guide.frame6 {
   top: -368px;
   left: -680px;
}

/* * * * * BANNER SPECIFIC CSS * * * * */
#bg {
   position: absolute;
   top: 0px;
   left: 0px;
   width: 300px;
   opacity: 1;
}

#cta {
   position: absolute;
    top: 100px;
    left: 10px;
   width: 84px;
   opacity: 0;
}

#text_bub1 {
   position: absolute;
   top: 87px;
   left: 10px;
   width: 196px;
   opacity: 0;
}

#text_bub2 {
   position: absolute;
   top: 87px;
   left: 10px;
   width: 196px;
   opacity: 0;
}

#text_bub3 {
   position: absolute;
   top: 87px;
   left: 10px;
   width: 196px;
   opacity: 0;
}

#text_bub4 {
   position: absolute;
   top: 87px;
   left: 10px;
   width: 196px;
   opacity: 0;
}

#text_disc {
   position: absolute;
   top: 117px;
   left: 2px;
   width: 298px;
   opacity: 0;
}

#text1 {
   position: absolute;
   top: 33px;
   left: 2px;
   width: 155px;
   opacity: 0;
}

#text2 {
   position: absolute;
   top: 63px;
   left: 3px;
   width: 154px;
   opacity: 0;
}

#text3 {
   position: absolute;
   top: 141px;
   left: 9px;
   width: 141px;
   opacity: 0;
}

#text4 {
   position: absolute;
    top: 21px;
    left: 1px;
   width: 164px;
   opacity: 0;
}

#text1_container {
   position: absolute;
   opacity: 1;
}

#text2_container {
   position: absolute;
   top: 0px;
   left: 0px;
   opacity: 1;
}

#text_bub_container {
   position: absolute;
   top: 0px;
   left: 0px;
   opacity: 1;
}