@charset "utf-8";
::-moz-selection{background-color:var(--theme-ui-colors-main);color:var(--theme-ui-colors-white);}
::selection{background-color:var(--theme-ui-colors-main);color:var(--theme-ui-colors-white);}
html{
--theme-ui-colors-theme:#a50134;
--theme-ui-colors-light-theme:#ffb5cc;
--theme-ui-colors-mute-theme:#fff2f6;
--theme-ui-colors-black:#000;
--theme-ui-colors-white:#fff;
--theme-ui-colors-main:#E90044; /* Corporate Red */
--theme-ui-colors-submain:#A80034; /* Dark Red */
--theme-ui-colors-error:#f70044; /* Error */
--theme-ui-colors-focus:#FFB500; /* Yellow */
--theme-ui-colors-primary:#4f4f50; /* Dark Grey */
--theme-ui-colors-grey:#a1a1a1; /* Light Grey */
--theme-ui-colors-light-grey:#d1d1d1; /* Light Grey */
--theme-ui-colors-secondary:#003866; /* Dark Blue */
--theme-ui-colors-surreal:#6AD9D4; /* Light Blue */
--theme-ui-colors-muted:#F4F7F8; /* Muted */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 62.5%;
}
/* p {font-weight:400;
    margin-top:0;
    margin-bottom:1rem}
a, p {font-size:18px;font-size: 1.8rem;letter-spacing:0.5px;color: #464646;
} */

small{font-size:14px;}
a{transition:all .5s;}
body{background-color: #f7f8f9;background-image:url("https://oss-static-zbsg.oss-cn-hongkong.aliyuncs.com/assets/interactive/2023/lee-kuan-yew-hard-truths/imgs/lee-kuan-yew-hard-truths-bg.png");background-repeat:no-repeat;background-size:100%;text-decoration: none!important;}
.en{font-family:Roboto;}
.view-desktop{display:block;width:100%;-webkit-overflow-scrolling:touch;}
.view-mobile,.view-tablet{display:none;width:100%;-webkit-overflow-scrolling:touch;}
.wrapper{width:80%;margin:auto;}
@media (min-width:1001px) and (max-width:1200px){
.wrapper{width:100%;margin:auto;}
}
@media (min-width:200px) and (max-width:1000px){
span.copy-link-icon{top:1em;}
.view-mobile{display:block!important;}
.view-desktop{display:none!important;}
.wrapper{width:100%;}
}
.theme-h3{font-size:3em;margin-bottom:1em;font-weight:900;}
.display-panel{display:flex;width:100%;padding:0;margin:0 auto;text-align:center;}
.display-md-auto{display:flex;}
.display-md-1{width:10%;}
.display-md-2{width:20%;}
.display-md-3{width:30%;}
.display-md-4{width:40%;}
.display-md-5{width:50%;}
.display-md-6{width:60%;}
.display-md-7{width:70%;}
.display-md-8{width:80%;}
.display-md-9{width:90%;}
.display-md-10{width:100;}

@media screen and (max-width:1000px){
.theme-h3{font-size:2.2em;}
#theme-logo{width:90%;margin: 0 0 3em 0;}
.display-panel{width:100%;display:block;}
.display-full{display:block;width:100%;}
}

.main{margin:0 auto;width:100%;}
@media screen and (max-width:1000px){
body{background-image:url("https://oss-static-zbsg.oss-cn-hongkong.aliyuncs.com/assets/interactive/2023/lee-kuan-yew-hard-truths/imgs/lee-kuan-yew-hard-truths-bg-mobile.png");background-size:100%;background-position:0 0;background-size:100%;}
}

#ROOT{background:transparent!important;}
#ROOT > div:nth-child(2) { background:transparent!important;}
.template-com-template-b-view-con1 > div,.template-com-template-b-view-con1 .bus-com-free-form-view,.bus-com-free-form-view{background:transparent!important;}
.template-com-template-b-view-con2 {margin-top: 0;background:var(--theme-ui-colors-white)!important;padding: 20px;}
.template-com-template-b-view-con2-top {display:none;}
.slick-dotted.slick-slider{margin-bottom:0!important;}
.bus-com-article-list-2-view{background:var(--theme-ui-colors-white);padding:1em;}

.lky-logo{width: 100%;}
.lky-quote {
    margin: auto;
    position: relative;
    max-width: 400px;
    width: 100%;
}
.left {
    position: absolute;
    top: -10px;
    left: -20px;
    letter-spacing: 0.5px;
    height: 70px;
    width: 60px;
    opacity: .3;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("https://oss-static-zbsg.oss-cn-hongkong.aliyuncs.com/assets/interactive/2023/lee-kuan-yew-hard-truths/imgs/quote-left.svg");
    z-index: 0;}

blockquote p{
    color:var(--theme-ui-colors-secondary);
    font-size: 2.7rem;
    font-weight: 400;
    z-index: 1;
    line-height: 1.4;
    position: relative;
}
.lky-name{
    color:var(--theme-ui-colors-secondary);
    font-size: 1.8rem;
    font-weight: 500;
    font-style: normal;
    position: relative;
}
.lky-name::before{
    height: 1px;
    content: '';
    width: 3em;
    position: absolute;
    top: 50%;
    left: 28%;
    background:var(--theme-ui-colors-secondary);
}
.lky-name::after{
    height: 1px;
    content: '';
    width: 3em;
    position: absolute;
    top: 50%;
    left: 58%;
    background:var(--theme-ui-colors-secondary);
}

@media screen and (max-width:1000px){
    .lky-logo{width: 95%;}
    .quote{font-size: 2.5rem;}
    .lky-quote {margin-top: 0.5em;}
    .lky-name{font-size: 1.5rem;}
    .lky-name::before {left: 28%;}
    .lky-name::after {left: 59%;}
    .quote::before {font-size: 5em;top: -50px;left: -70px;}
    blockquote p {font-size: 2.5rem;}
    .left {
        position: absolute;
        top: -10%;
        left: 0%;
        height: 50px;
        width: 50px;}
}
/* podcast */
.hard-truths-podcast{
    background-color: #19206a;
    background-image: radial-gradient(#4e5595 0.6px, #19206a 0.6px);
    background-size: 8px 8px;
    border-radius: 10px;
    margin: 2em 0;
}
.podcast-bg{
    background-image: url(../imgs/podcast-sound-wave.png);
    background-repeat: repeat-x;
    background-position: bottom;
    padding: 3em;
    width: 100%;
    display: inline-flex;
    border-radius: 10px;
}
.podcast-intro{
    margin: auto 1.5em;
    text-align: left;
}
.hard-truths-podcast p{
    color: #fff;
    margin: 1em 0;
    font-size: 18px;
}
.episode-details{
    padding: 0 0 1em 0;
}
.episode-details li{
    font-size:15px;
    color: #fff;
    text-align: left;
    list-style: square;
}
.hard-truths-podcast h2{
    font-weight: 600;
    font-size: 2.5rem;
    color: #fff;
    letter-spacing: 0.5px;
}    
.podcast-intro h3{
    color: #fff;
    border: 1.5px #fff solid;
    padding: 0.5em 1em;
    margin-right: 21rem;
}
.podcast-cta a{
    color: #fff;
    padding: 0.5em 1.5em;
    border-radius: 50px;
    font-size: 1.8rem;
    font-weight: 500;
    background-color: #A80034;
}
.podcast-cta a:hover{
    background: #fff;
    text-decoration: none;
    color: #003866;
}
.ep{
    color: #003866;
    padding: 0.4em;
    background: #dbe7fa;
}
@media screen and (max-width:1000px){
    .podcast-bg{
        display: block;
        padding: 2em 1em 3em 1em;
    }
    .hard-truths-podcast p {
        letter-spacing: 0.5px;
    }
    .podcast-intro {
        text-align: center;
        padding: 0;
        margin: 0;
    }
    .episode-details h3{
        color: #fff;
        margin-bottom: 1em;
        border: 1.5px #fff solid;
        padding: 0.5em 1em;
    }
    .hard-truths-podcast h2 {
        font-size: 2rem;
    }
}
/* audiobook */
#bars {
    position: absolute;
    top: 0%;
    left: 25px;
    transform: scale(2) translateX(-50%);
  }
  .bar {
    position: absolute;
    bottom: 0px;
    height: 3px;
    width: 2px;
    background: #ffd4d8;;      
    animation: sound 0ms -800ms linear infinite alternate;
    transform: translateY(0%);
  }
  @keyframes sound {
      0% {
         opacity: .25;
          height: 3px; 
      }
      100% {
          opacity: 0.9;       
          height: 12px;        
      }
  }
.lky-audio-book{
    background-color: #fff;
    border-radius: 10px;
    display: inline-flex;
    padding: 3em 0em 0em 3em;
    position: relative;
}
.audio-book-intro h2{
    font-weight: 600;
    font-size: 2rem;
    letter-spacing: 0.5px;
}
.audio-book-intro p{
    letter-spacing: 0.5px;
    color: #464646;
    font-size: 18px;
}
.playlist-listing{padding: 0.5em 1em;}
.playlist-title h3{
    color:var(--theme-ui-colors-secondary);
    position: relative;
    font-weight: 500;
    font-size: 2rem;
    letter-spacing: 0.5px;
    font-family: "Noto Sans SC", Arial, sans-serif;
}
.playlist-title h3::before{
    height: 1.5px;
    content: '';
    width: 30%;
    position: absolute;
    top: 50%;
    left: 5%;
    background:var(--theme-ui-colors-secondary);
}
.playlist-title h3::after{
    height: 1.5px;
    content: '';
    width: 30%;
    position: absolute;
    top: 50%;
    left: 65%;
    background:var(--theme-ui-colors-secondary);
}
/* .audio-book-playlist{
    padding:0 1em;
} */
/* with button */
.scrollmenu {
	position: relative;
    width: auto;
    padding: 1em;
    
    background-color: #f5f9ff;
}
.slick-dots li button:before {
    font-size: 20px!important;
    top: 10px!important;
    color: #e90144!important;
}
.slick-dots li.slick-active button:before {
    color:var(--theme-ui-colors-main)!important;
    opacity: 0.75!important;
}
.slick-dots {
    bottom: -5px!important;
}
.videobar-nav-prev, .videobar-nav-next {
    font-size: 0!important; 
    text-indent: -9999px!important;
    overflow: hidden!important; 
    width: 30px!important; 
    height: 30px!important; 
  }
.playlist-menu {
    max-width: 500px;
    width: auto;
    left: 50%;
     transform: translateX(-50%);
}
.playlist-item {
	display: inline-block;
	height: 100%;
	padding: 1em;
	box-sizing: border-box;
}
.slick-prev, .slick-next{display: none!important;}
.slick-dots {
    cursor: pointer!important;
    transition: background-color 0.6s ease!important;
  }
  
  .active, .slick-dot:hover {
    background-color: #003866!important;
  }
.chapter-wrap{
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px;
    text-decoration: none;
}
.chapter-wrap a{
    background-color: #dfe8f6;
    display: grid;
    line-height: 1.3;
    text-align: left;
    border-radius: 10px;
    padding: 0.5em 0.5em 0.5em 1em;
    margin-bottom: 0.5em;
}
.chapter-wrap a:hover{
    background-color:var(--theme-ui-colors-secondary);
    color: #fff;
    background-image: url('https://oss-static-zbsg.oss-cn-hongkong.aliyuncs.com/assets/interactive/2023/lee-kuan-yew-hard-truths/imgs/soundwave-bg.png');
    background-size: 90%;
    background-repeat: no-repeat;
    background-position: right;
    padding: 0.5em;
    text-decoration: none!important;
}
.chapters p{
    font-weight: 500;
    margin: 0;
    color: #464646;
    letter-spacing: 0.5px;
}
.chapter-wrap a:hover p{
color: #fff;
font-size: 1.7rem;
}
.smalltxt{
    color:var(--theme-ui-colors-secondary);
    font-size: 13px;
}
.chapter-wrap a:hover .smalltxt{
    color:#fff;
}
.chapters{
    position: relative;
}
.chapters:hover:after {
    content: '';
    font-size: 2em;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 10%;
    right: 0%;
    background-image: url("https://oss-static-zbsg.oss-cn-hongkong.aliyuncs.com/assets/interactive/2023/lee-kuan-yew-hard-truths/imgs/play.png");
    background-size: 55%;
    background-repeat: no-repeat;
    background-position: center;
}
.chapters-blank{
    visibility: hidden;
}
.scrollable-container::-webkit-scrollbar {
    width: 15px; 
}
.scrollable-container::-webkit-scrollbar-thumb {
    background-color: var(--theme-ui-colors-main); 
    border-radius: 5px; 
}
.scrollable-container::-webkit-scrollbar-track:hover {
    background-color: #ffb7b7;
}
/* ebook */
.lky-ebook{
    background-color:#dbe7fa;
    border-radius: 10px;
    height: auto;
    padding: 0 1em 0.5em 1em;
}
.lky-hardcopy{
    width: 40%;
    margin-top: -4em;
}
.book-wrap{
    display: block;
}
.hardcopy-intro{
    font-size:1.8rem;
    line-height: 1.5;
    padding: 0 0.5em 1em;
}
.hardcopy-intro b{
    font-size: 2rem;
    line-height: 1.4;
}
.hardcopy-btn-grp{
    display: inline-flex;
    padding: 0;
    width: 100%;
}
.book-btn{
    border-radius: 10px;
    padding:0;
    line-height: 1.4;
    font-size: 18px;
}
.eshop-btn{
    background-color: #E90044!important;
    transition: all .5s;
    color: #fff!important;
    padding: 0.5em;
    margin: 0 0.5em 0 1em;
    border-radius: 10px;
    display: grid;
    font-weight: 600;
}
.eshop-btn:hover{
    background-color: #fff!important;
    color: #06023b!important;
    text-decoration: none!important;
}
.ebook-btn{
    background-color: #ffb500!important;
    transition: all .5s;
    padding: 0.5em;
    margin: 0em 1em 0 0.5em;
    border-radius: 10px;
    display: grid;
    /* align-items: center;
    justify-content: center; */
    font-size: 1.8rem;
    color: #05164c;
    font-weight: 600;
}

.eshop-normal-btn{
    background-color: #a30033;
    transition: all .5s;
    padding: 0.5em;
    margin: 0 1em 0 0.5em;
    border-radius: 10px;
    display: grid;
    font-size: 1.8rem;
    color: #ffffff;
    font-weight: 600;
}
.hardcopy-title {
    font-size: 1.56rem;
    font-weight: 900;
}
.eshop {
    position: relative;
}
.ebook-btn:hover{
    background-color: #003866!important;
    color: #fff!important;
    text-decoration: none!important;
}
@media screen and (max-width:1000px){
    .lky-audio-book{
        margin: 3em 0 1em 0;
        display: block;
        padding: 2em 1em 1em 1em;
    }
    .playlist-listing {
        padding: 0;
    }
    #bars {
        left: 20px;
    }
    .audio-book-playlist{
        margin: 2em 0;
    }
    .playlist-title {
        margin: 0;}
    .chapter-wrap {
        display: block;
        padding: 0;
    }
    .scrollmenu{
        height: 300px;
        overflow-y: auto; 
    }
    .chapters::after {
        content: '';
        font-size: 2em;
        width: 45px;
        height: 50px;
        position: absolute;
        top: 20%;
        right: 2%;
        background-image: url("https://oss-static-zbsg.oss-cn-hongkong.aliyuncs.com/assets/interactive/2023/lee-kuan-yew-hard-truths/imgs/play-m.png");
        background-size: 55%;
        background-repeat: no-repeat;
        background-position: center;
    }
    .chapter-wrap a {
        width: auto;
        padding: 1em;
    }
    .chapter-wrap a:hover {
        padding: 1em;
    }
    .scrollmenu {
        margin: 0;
        padding: 0.7em;
        border-bottom: 1px solid #194873;
    }
    .lky-ebook{
        padding: 0;
        background-color: transparent;
    }
    .book-wrap{
        display: flex;
        background-color: #dbe7fa;
    }
    .intro-wrap{
        padding: 1em;
        border-radius: 0 10px 10px 0;
    }
    .book-img{
        border-radius: 10px 0px 0px 10px;
    }
    .lky-hardcopy{
        width: 100%;
        max-width: 140px;
        margin: -2em 0 0 1em;
    }
    .hardcopy-btn-grp {
        padding: 0;
        width: 100%;
    }
    .hardcopy-intro {
        padding: 0 0 0.3em;
        font-weight: 400;
        line-height: 1.2;
        text-align: initial;
    }
    .eshop-btn {
        font-size: 1.5rem;
        border-radius: 0 0 0 10px;
        margin: 0;
    }
    .ebook-btn {
        font-size: 1.5rem;
        border-radius: 0 0 10px 0;
        margin:0;
    }
    .book-btn {
        padding: 0;
    }
}