.hero{padding-top:50px;padding-bottom:40px; }
.hero__subtitle{margin-bottom:0;font-size:16px}
.hero__heading{margin-top:0;margin-bottom:0;font-size:40px}
.hero__author{font-style:italic;font-size:12px}
.hero__image { display: none;}
.sidebar { background: #F5F8FA; transition: all 0.3s; }
.sidebar a,
.sidebar a:hover,
.sidebar a:focus { color: inherit; }
.sidebar.active { margin-left: 0; }
.sidebar .sidebar-header { padding: 20px; background: #6d7fcc; }
.sidebar ul.components { padding: 10px 0 0; margin-bottom: 0; }
.sidebar ul p { color: #333; padding: 0px 10px 0px 30px; }
.sidebar ul li a { padding: 10px 45px 10px 30px; font-weight: 500; display: block; text-decoration: none; }
.sidebar ul li a:hover { color: #333; background: #daecf6; }
.sidebar ul li ul li a:hover { color: #333; background: #ebf5fc; }
.sidebar ul li.active > a,
a[aria-expanded="true"] { color: #333; background: #daecf6; }
.sidebar a[data-toggle="collapse"] { position: relative; }
.sidebar a[aria-expanded="false"]::before,
.sidebar a[aria-expanded="true"]::before { content: '\e259'; display: block; position: absolute; right: 20px; font-family: 'Glyphicons Halflings'; font-size: 0.8em; }
.sidebar a[aria-expanded="true"]::before { content: '\e260'; }
.sidebar ul ul a { font-weight: normal; padding-left: 30px !important; background: #fcfdfd; }
.btn-info{min-width:100%;margin-top:15px;margin-bottom:0;border:0}
.italic{font-style:italic}
iframe{max-width:100%;height:auto;aspect-ratio:16/9}
.instagram-iframe {text-align: center;}
.instagram-iframe iframe{height:auto;display: inline-block !important; aspect-ratio:9/16;}
.sidebar-wrapper { display: none; }
.sec-block{padding:0 0 30px}
.chapter-content{padding-top:15px}
.chapter-content h1 { font-size: 40px; margin-bottom: 30px; }
.chapter-content h2 { font-size: 24px; margin: 30px 0 0; font-weight: 500; }
.chapter-content h3 { font-size: 18px; margin: 30px 0 0; font-weight: 500; }
.chapter-content h4 { font-size: 16px; margin: 30px 0 0; font-weight: 600; }

.bg-white-ice{
    background-color: #d3f8f1;
}

.try-banner{padding: 35px;background:#02093a;color:#fff;border-radius:5px;text-align: center;}
.try-banner h2 {margin:0;}
.try-banner p { font-size: 14px; }
.try-banner .buttons{margin-top:10px;display:flex;align-items:center;flex-wrap:wrap;justify-content:center}
.try-banner .buttons a{margin-top:20px}
.try-banner .promo { margin: 0 0 0 1em; }
.try-banner .promo p { font-size: 16px; }
.try-banner .cdgs-pricing { align-items: center; }

.img-par-author{margin-bottom:25px;width:100%;margin-top:20px}
.img-par-author img{border-radius:15px;max-width: 150px; margin-bottom:10px;}
.sidebar-action{text-align:center;padding:20px}
.quote-box { background-color: #ECE7FB; margin: 1em 0; padding: 15px 20px; border-radius: 10px; text-align: center;}


@media (min-width: 768px) {
    .vertical-align{display:flex;align-items:center}
    .btn-info{display:none}
    .hero__image,.sidebar-wrapper{display:block}
    .hero{padding-top:0;padding-bottom:0;}
    .sec-block{padding:40px 0}
    .toc{position:sticky;top:15px}
    .chapter-content{padding-top:0}
    .try-banner { text-align: left;}
    .try-banner .buttons{ justify-content: flex-start;}
    .try-banner--bg-img {min-height:240px;background-image:url(/static/cdgs/images/learn/tutorials/youtube-banner/cta.png);background-position:calc(100% + 1px) 50%;background-size:auto 200px;background-repeat:no-repeat}
}
@media (min-width: 992px) {
.img-par-author{display:flex;}
.img-par-author__no-shrink{flex-shrink:0;margin-right:10px}
.img-par-author p{margin:0 0 1rem 1rem}
}
