/* General Styles */
body{background-color:#f3f3f3; font-family: 'Roboto', sans-serif !important; margin:0; padding:0; font-size:16px; line-height:normal;}
p {margin-bottom: 1.5rem;}
hr.divider{border-color:#0c782a;}
.flex-center{display:flex; justify-content:center; align-items:center;}
.inline-link{color:#016dd9; text-decoration:underline; font-weight:bold;}
    .inline-link:hover{text-decoration:none;}
.trademark{font-size:.75rem; position:relative; bottom:6px;}

/* Header */
header{height:72px; background-color:#000; padding:18px 0;}
header img{margin:0 auto; height:32px; display:block;}

/* Button */
.default-btn{display:block; width:100%; max-width:280px; margin:0 auto; display:flex; justify-content:center; align-items:center; background-color:#016dd9; border:solid 2px #016dd9; color:#fff; padding:12px 0;}
.default-btn:hover,
.default-btn:focus{color:#016dd9; background-color:#fff; outline:none; text-decoration:none;}
.default-btn span{text-transform:uppercase; font-weight:bold; text-indent:0;}

/* Bootstrap Adjustments */
.container{padding:0;}

/* Hero Banner */
.hero-wrapper{background-image:url('../images/xcub-sm.jpg'); background-repeat:no-repeat; background-position:top center; background-size:cover; min-height:350px; padding:0 16px;}
    .hero-wrapper h1{color:#000; font-weight:900; font-size:28px; line-height: 32px; text-align:center; padding-top:24px;}
.hero-purple-wrapper{background-color:#3a356b; color:#fff; padding: 24px 8px;}
    .hero-purple-wrapper p{text-align:center; margin:0;}
    .hero-purple-wrapper p:first-child{margin-bottom:16px;}

/* Section Content */
.section-content,
.section-legal{background-color:#fff; padding:24px; margin:24px 0;}
.section-content .section-head h2,
.section-content p.section-sub-head,
.section-content p.content-head,
.section-content h3{color:#0c782a; text-align:center;}
.section-content .section-head h2{font-weight:900; font-size:30px; margin:0;}
.section-content h3{font-weight:900; font-size:24px; line-height: 30px; margin-bottom: 20px;}

.section-content .content-list li{margin-bottom:.25rem}

.content-head{font-weight:bold; text-align:center;}
.content-img{width:100%; max-width:80%; display:block; margin:0 auto; padding:18px 0;}
.content-img.img-center{max-width:360px;}
.gdl51{padding:18px 0;}
.gdl51 .content-img{padding:0;}

.btn-row{padding:1.5rem 0 .5rem;}
.btn-row .default-btn{margin-bottom:1rem;}
ol.content-bold-list{padding:0; counter-reset:item;}
ol.content-bold-list>li{margin:0; padding:0 0 1rem 1rem; text-indent:-1rem; list-style-type:none; counter-increment:item;}
ol.content-bold-list>li:before{display:inline-block; width:1rem; padding-right:0.5rem; font-weight:bold; text-align:right; content:counter(item) ".";}

/* Entertainment Section */
.section-content.entertainment h2.head{color:#000; font-size: 28px; font-weight:300; margin-bottom:32px; text-align:center;}
.section-content.entertainment p.sub-head{color:#000; font-weight:bold; font-size:16px; text-align:center;}

/* Legal Section */
.section-legal{background-color:transparent; font-size:12px; line-height:18px;}
.section-legal .legal-title{font-weight:900; text-decoration:underline;}

/* Chart Section */
.comp-chart {display: block; font-size: 12px; padding-top: 30px; padding-bottom: 30px;}
.chart-title {background-color: #000; color: #fff; padding: 15px 10px; font-weight: 900;}
.chart-disc-text {font-family: 'Roboto Condensed', sans-serif; font-size: 10px;}
.center-text {text-align: center; vertical-align: central;}
.cell-header {background-color: #1e6eb4; color: #fff; padding: 10px 5px; font-weight: 900;}
/*.span-arrow-left {display: inline-block; position: absolute; left: 5px; top: 10px;}
.span-arrow-right {display: inline-block; position: absolute; right: 5px; top: 10px;}*/
.cell-nt-1 {background-color: #ecf2fa; padding: 10px;}
.cell-nt-2 {background-color: #fff; padding: 10px;}
.cell-nt-3 {background-color: #bcd4eb; padding: 10px; font-weight: 900;}
.cell-nt-4 {background-color: #ecf2fa; padding: 10px; font-weight: 900;}
.cell-last {border-bottom: 1px solid #ecf2fa;}

sup {line-height: 75%;}

.call-to-start {display: block; text-align: center; font-size: 14px; margin-left: 20px;}

@media(min-width:576px){
    .hero-wrapper{min-height:380px;}
    .gdl51{height: 187px; display:flex; align-items:flex-end;}
    .btn-row .default-btn{margin-bottom:0;}
}

@media(min-width:768px){
    /* Header */
    header img{margin:0;}

    /* Hero */
    .hero-wrapper{background-image:url('../images/xcub-lg.jpg'); background-position:top center; min-height:600px; background-position-x: -80px; }
    .hero-wrapper h1{font-size:40px; line-height: 44px; width:90%; margin:0 auto; padding-top:36px;}
    .hero-purple-wrapper{padding:32px 0;}
    .hero-purple-wrapper p{width:80%; margin:0 auto;}

    /* section Content */
    .section-content{padding:24px 80px;}
    .section-content .section-head h2{font-size:38px;}
    .section-content p.section-sub-head{font-size:22px;}
    .section-content.entertainment,
    .content-img{max-width:100%;}
    .gdl51{height: 209px;}

    /* Entertainment */
    .section-content h2{font-size:42px;}
    .section-content.entertainment .section-head h2 {font-size: 24px; line-height: 26px;}
    
    /* Chart Section */
    .comp-chart {display: block; font-size: 14px;}
    .chart-disc-text {font-size: 12px;}
}

@media(min-width:992px){
    /*.hero-wrapper{background-position:center -50px;}*/
    .hero-wrapper{background-position-x: -90px;}
    .hero-wrapper h1{font-size:44px; line-height: 46px; width:90%; margin:0 auto; padding-top:50px;}
    .hero-purple-wrapper p{font-size: 17px;}
    .gdl51{height: 270px;}
    .section-content.entertainment .section-head h2 {font-size: 32px; line-height: 34px;}
}

@media(min-width:1024px){
    .hero-purple-wrapper p{font-size: 20px; line-height: 24px;}
    .section-content{padding:24px 100px;}
    .gdl51{height: 269px;}
}

@media(min-width:1200px){
    .hero-wrapper{background-position-x: 0px;}
    .hero-wrapper h1{font-size:50px; line-height: 50px;}
    /*.hero-wrapper{background-position:center -100px;}*/
    .section-content.entertainment .section-head h2 {font-size: 38px; line-height: 42px;}
}