"About Test"
Bootstrap 4.1.1 Snippet by sparkktv

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="aboutus"> <section class="about-us"> <div class="mission text-center mb-5"> <h3 class="mission-text">Our mission is to give content creators a platform to help grow their audience.</h3> <h4 class="goal-text">Our goal is to make Online TV and Independent TV the next big thing and grow the amount of content available.</h4> </div> <div class="container"> <div class="row"> <div class="col-md-6 sparkkblock"> <h3 class="abouts-title">Why Come To <span class="about-ribbon">Sparkk TV?</span></h3> <p class="about_copy">We offer content curation to our content creators using the YouTube API, we allow you a platform to grow your webseries and give your fans/viewers and easier way to find your series while we also promote your series. All views on our site count towards your YouTube views and you monitize your own content.</p> </div> <div class="col-md-6 sparkkblock"> <h3 class="abouts-title">Our <span class="about-ribbon">Commitment</span></h3> <p class="about_copy">We work hard for our filmmakers. We advertise and promote their series free of charge and work hard to build an audience around their work. We are committed to our shows and our network. Series on our site are aired on a first-run basis and available On-Demand all the time thru our site or our app.</p> </div> <div class="col-md-6 sparkkblock"> <h3 class="abouts-title">We <span class="about-ribbon">Promise</span></h3> <p class="about_copy">We believe in growth and we promise to always grow our audience and every shows audience. We offer the best series curation with shows and filmakers that are committed to not only their own work but the growth of Sparkk TV and next generation of web series and independent TV.</p> </div> <div class="col-md-6 sparkkblock"> <h3 class="abouts-title">Always <span class="about-ribbon">Free</span></h3> <p class="about_copy">We remain committed to a always free and commercial free approach. Banner Ads are on the site for the purpose of supporting the cost to run the site. Showrunners are encouraged to find ways to monitize their content and we even support their own monetization thru the Youtube API. More information is available on our Support site.</p> </div></div></div> </section> <section class="moreinfo container"> <div class="highlightvideo"> <div id="player" data-plyr-provider="youtube" data-plyr-embed-id="OtUY976klWw"></div> </div> </section> <section class="numbersabout container" id="about"> <div class="row padabout"> <div class="col-lg-5 aboutpad"> <div class="aboutbythenumbers abtn1"> <div class="aboutbtntitle">1M</div> <div class="aboutbtnsub">Monthly Viewers</div></div> <div class="aboutbythenumbers abtn2"> <div class="aboutbtntitle">100+</div> <div class="aboutbtnsub">Web Series + Web Movies</div></div> <div class="aboutbythenumbers abtn3"> <div class="aboutbtntitle">1,000s</div> <div class="aboutbtnsub">Hours of content</div></div></div> <div class="col-lg-7 satext"><h1 class="astitle">We got our numbers, but...<br>Who is Sparkk TV?<br></h1> <p class="astext">Sparkk TV was founded in 2005 as VBCtv and was rebranded in May of 2014. We offer a way to watch the best web series online in one place but give them a more traditional TV network look and feel.<br><br>Our web series air NEW weekly and are commercial free<br>New Content is added daily and all series are available On-Demand after first showing.<br><br>You can watch our shows online, using our app or on your TV via Roku (Chromecast), Apple TV (Airplay), Amazon Fire TV or your Xbox.<br><br></p> </div></div></section></div>
body{max-width:1400px;margin-right:auto;margin-left:auto;background:#212125;color:#fff;margin-top:25px;margin-bottom:25px;} .abouts-title {font-size: 45px;font-weight: 700;line-height: 1.15556;} .about-ribbon{display:inline-block;position:relative;} .about-ribbon::after {background: #187fdd;bottom: 0;content: "";display: block;height: 45%;left: -10px;position: absolute;right: -10px;z-index: -1;} .about-us{margin-top:10px;margin-bottom:10px;} .moreinfo{background:#112c45;padding:25px;border-radius:12px;margin-bottom:25px;box-shadow:3px 3px 20px 2px rgba(0,0,0,.2);} .numbersabout{background-color:#187FDD;padding:25px;border-radius:12px;box-shadow:3px 3px 20px 2px rgba(0,0,0,.2);} .aboutbythenumbers{color:#187FDD;position:relative;background:black;min-height:106px;text-align:right;margin-bottom:10px;padding-right:10%;border-top-right-radius:60px;border-bottom-right-radius:60px;box-shadow: 3px 3px 20px 2px rgba(0,0,0,.2);} .abtn1{width:50%;}.abtn2{width:75%;} .aboutbtntitle{top:14px;right:45px;position:absolute;font-size:60px;font-weight:700;line-height:0.9;margin-bottom:3px;text-transform:none;} .aboutbtnsub{right:48px;bottom:22px;position:absolute;font-size:11px;font-weight:400;line-height:normal;white-space:nowrap;letter-spacing:0.8px;text-transform:none;} .satext{color:#FFF;display:flex;padding:26px 20px 20px 20px;max-width:60%;max-height:362px;flex-direction:column;justify-content:center;} .astitle {font-size:36px;font-weight:700;text-align:inherit;line-height:1.2;margin-bottom:25px;} .astext {font-size:16px;font-weight:500;max-width:587px;text-align:inherit;line-height:1.3;} .aboutpad{padding-left:0;} .padabout{margin-left:-25px;} .sparkkblock{padding:15px;} @media(max-width:991px){.satext{max-width:100%;max-height:100%;}}

Related: See More


Questions / Comments: