The page is hosted here: http://academic.cast-soft.com/3dlandingpage99/index.html
This is my current project: https://playcanv.as/b/okFRSxiU/
This is the link if you want to fork it
HTML + CSS of the page is below:
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>wysiwyg Education</title>
<!-- HAND-CODED BY DANIEL VIANNA AND EVA CHAN-->
<link rel="stylesheet" href="css/foundation.css">
<link rel="stylesheet" href="css/app.css">
<link rel="stylesheet" href="css/normalize.css">
</head>
<body>
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet">
<!-- Start Top Menu Bar -->
<div class="top-bar text-center" id="main-menu">
<div class="top-bar-section">
<img id="logo" alt="daniel_logo" src="http://academic.cast-soft.com/3dlandingpage99/images/wysiwyg2016.svg" >
</div>
</div>
<!-- end of Top Menu Bar -->
<!-- Start Moon Section-->
<div class="row fullWidth moon_section">
<div class="small-12 large-12 medium-12 medium-centered large-centered columns no_padding">
<div class="playcanvas">
<iframe src="https://playcanv.as/b/zTajUHZ8/" height="700px" width="100%" scrolling="no" frameborder="0"></iframe>
</div>
</div>
</div>
<!-- End of Moon Section-->
<div class="large-12 columns timeline_section">
<div class="feature">
<div class="circle-wrapper">
<div class="circle">
<p class="centered-text">Let us help you! By offering you the new wysiwyg student edition for FREE!<br />
</p>
</div>
</div>
</div>
</div>
<!-- START OF THE MISSION SECTION -->
<div class="the_mission_section row fullWidth">
<div class="small-12 medium-4 large-4 large-offset-1 medium-offset-1 columns">
<div class="the_mission_section_text">
<h2>The <br> mission</h2>
<p>CAST’s mission is to allow people to be more creative and innovative. As designers ourselves, we understand how hard it is to afford a software license while attending school and trying to start a career.</p>
<a href="#believe" class="button">Register Now</a>
</div>
</div>
<div class="small-12 medium-7 large-7 columns no_padding">
<div class="the_mission_image_container">
</div>
</div>
</div>
<!-- END OF THE MISSION SECTION-->
<!-- START OF SPACER -->
<div class="row fullWidth spacer_section">
<div class="small-12 large-12 medium-12 large-centered columns spacer">
</div>
</div>
<!-- END OF SPACER -->
<!-- START OF WE WILL HELP YOU SECTION-->
<div class="succeed_section row fullWidth">
<div class="small-12 medium-5 large-5 medium-push-7 columns">
<div class="succeed_text_section">
<h2>We will help <br>you succeed</h2>
<p>After you graduate, your wysiwyg student license will turn into a 3-month wysiwyg Lease with NO limitations or watermark.</p>
<a href="#believe" class="button">Register Now</a>
</div>
</div>
<div class="small-12 medium-7 large-7 medium-pull-5 columns">
<div class="fixture_image_container">
<img class="fixture_image" src="http://academic.cast-soft.com/3dlandingpage99/images/fixture.png">
</div>
</div>
</div>
<!-- END OF WE WILL HELP YOU SECTION -->
<!-- START OF SPACER -->
<div class="row fullWidth spacer_section">
<div class="small-12 large-12 medium-12 large-centered columns spacer">
</div>
</div>
<!-- END OF SPACER -->
<!-- START OF GET A FULL WYG SECTION -->
<div class="the_mission_section row fullWidth">
<div class="small-12 medium-4 large-4 large-offset-1 medium-offset-1 columns">
<div class="the_mission_section_text">
<h2>Meet the<br>new student<br>edition</h2>
<p class="text-left">wysiwyg Student edition is a Perform License as described below:<br>
• 4096 DMX Channels (8 universes)<br>
• A small Student Edition Watermark shows on shaded view, renderings and printable plots.<br>
• Brand new Cloud License! A USB Dongle is no longer required, so no costs with shipping.<br>
• This is an annual license that can be extended every year as long as you provide proof you are still a student.<br>
• A watermark is small and only takes up 1/9th of shaded view.
</p>
<a href="#believe" class="button">Register Now</a>
</div>
</div>
<div class="small-12 medium-7 large-7 columns no_padding">
<div class="get_a_wyg_image_container">
</div>
</div>
</div>
<!-- END OF OF GET A FULL WYG SECTION -->
<!-- START OF BACKGROUND WRAPPER -------------------------->
<div class="background-wrapper">
<!-- START OF SPACER -->
<div class="row fullWidth spacer_yellow">
<div class="small-12 large-12 medium-12 large-centered columns">
</div>
</div>
<!-- END OF SPACER -->
<!-- START OF ELEGIBLE SECTION -->
<div class="who_is_elegible_section row">
<div class="small-12 medium-12 large-3 columns large-push-2 no_padding no_margin text-center">
<div class="inner cards">
<div class="documents_subsection">
<img src="http://academic.cast-soft.com/3dlandingpage99/images/document.png">
<div class="document_inner_text">
<h4 style="color:#1d1d1d">Proof of enrollment or Student ID card showing your course name and graduation date.</h4>
</div>
</div>
<div class="student_subsection">
<img src="http://academic.cast-soft.com/3dlandingpage99/images/student.png">
<div class="student_inner_text">
<h4>Students enrolled in Theatre, Lighting or Production-related course.</h4>
</div>
</div>
</div>
</div>
<div class="small-12 medium-12 large-9 columns no_padding no_margin">
<div class="big_text">
<h2>Eligibility</h2>
<p>For as long as you are a student until you graduate you will have access to student edition. After graduation you are eligible to a free 3 months upgrade to wysiwyg Perform with no channel limitations or no watermark, we hope this will help you get started in the marketplace as a professional.</p>
</div>
</div>
</div>
<!-- END OF ELEGIBLE SECTION -->
<!-- START OF SPACER -->
<div class="row fullWidth spacer_yellow">
<div class="small-12 large-12 medium-12 large-centered columns">
</div>
</div>
<!-- END OF SPACER -->
</div>
<!-- ENF OF BACKGROUND WRAPPER -------------------------->
<!-- Start Moon Section-->
<div class="row fullWidth believe_section">
<div class="small-12 large-8 medium-10 medium-centered large-centered columns">
<div class="believe_text_container text-center">
<h1>Believe</h1>
<div class="believe_paragraph"><p>in yourself as we already do! don’t wait to claim your prize</p>
<a href="https://castsoftwareservices.typeform.com/to/wiICbP" class="button">Register Now</a>
<a name="believe"></a>
</div>
</div>
</div>
</div>
<!-- End of Moon Section-->
<!-- Start Footer-->
<div class="row fullWidth footer text-center footer_section">
<div class="small-12 medium-12 large-12 medium-centered large-centered columns">
<div footer>
<h5>© 2017 CAST Group of Companies Inc. All rights reserved. <a href="http://cast-soft.com/terms-of-use/">Terms of Use</a> | <a href="http://cast-soft.com/privacy-policy/">Privacy Policy</a> | <a href="http://www.cast-soft.com/wysiwyg/faq/">Student Edition FAQ</a></h5>
<img id="wysiwyg_grey_logo" src="http://academic.cast-soft.com/3dlandingpage99/images/wysiwyg2016_grey.svg">
<img id="cast_grey_logo" src="http://academic.cast-soft.com/3dlandingpage99/images/cast_logo_grey.svg">
</div>
</div>
</div>
<!-- End of Footer-->
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://danielvianna.github.io/js/vendor/foundation.js"></script>
<script src="https://danielvianna.github.io/js/app.js"></script>
<script>
$(document).foundation();
</script>
</body>
</html>
/* HAND-CODED BY DANIEL VIANNA*/
/* START GLOBAL CONTAINER STYLES*/
body {
margin-top: 2rem;
}
.fullWidth {
width: 100%;
margin-left: auto;
margin-right: auto;
max-width: initial;
}
@media only screen and (min-width: 40.063em) { /* min-width 641px, medium screens */
.no_padding {
padding:0;
}
}
@media only screen and (min-width: 64.063em) { /* large screens */
.no_padding {
padding:0;
}
}
.no_margin {
margin:0;
}
.no_padding {
padding:0;
}
/* END OF GLOBAL CONTAINER STYLES*/
/* START GLOBAL FONT STYLES*/
h1{
font-family: open sans, sans-serif;
color: white;
font-weight: 800;
font-size: 11.0rem;
line-height: 0.9;
margin-bottom: 0.5rem;
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
h1 {
font-size: 5.0rem;
}
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) { /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
h1 {
font-size: 7.0rem;
}
}
h2{
font-family: open sans, sans-serif;
color: white;
font-weight: 600;
font-size: 3.0rem;
line-height: 1.1;
margin-bottom: 0.5rem;
}
h3{
font-family: open sans, sans-serif;
color: #ff9b0d;
font-weight: 400;
font-size: 2.2rem;
line-height: 2.0 ;
margin-bottom: 0.5rem;
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
h3 {
font-size: 1.0rem;
}
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) { /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
h3 {
font-size: 1.5rem;
}
}
h4{
font-family: open sans, sans-serif;
color: white;
font-weight: 600;
font-size: 0.9375rem;
line-height: 2.0 ;
margin-bottom: 0.5rem;
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
h4 {
font-size: 0.9375rem;
}
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) { /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
h4 {
font-size: 0.9375rem;
}
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
h4 {
font-size: 0.8rem;
}
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) { /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
h4 {
font-size: 0.8rem;
}
}
h5{
font-family: open sans, sans-serif;
color: #eaeaea;
font-weight: 300;
font-size: 0.8rem;
line-height: 2.0 ;
margin-bottom: 0.5rem;
}
h5 a{
color: white;
text-decoration: underline;
}
h5 a:hover {
color: #ff9b0d;
text-decoration: underline;
}
h5 a:active {
color: #ff9b0d;
}
p{
font-family: open sans, sans-serif;
color: #e1e1e1;
font-weight: 300;
font-size: 1.3rem;
line-height: 2.0 ;
margin-bottom: 0.5rem;
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
p {
font-size: 1.0rem;
}
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) { /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
p {
font-size: 1.0rem;
}
}
/* END OF GLOBAL FONT STYLES*/
/* START OF BUTTON STYLES */
.button{
background-color: orange;
color: black;
padding: 15px 32px;
font-family: open sans, sans-serif;
font-size: 16px;
font-weight: 700;
margin: 4px 2px;
margin-bottom: 30px;
}
.button:hover,
.button:focus {
background-color: #4d36d4;
}
/* END OF BUTTON STYLES */
/* START OF MENU */
.container{
width: 960px;
margin: 0 auto;
z-index: 99;
}
.header {
background: #1e1e1e;
width: 100%;
top: 0;
position: fixed;
z-index: 999;
}
#logo {
height: 50px;
max-height: 50px;
max-width: 200px;
width: 200px;
align-item: center;
}
li {
list-style: none;
float: left;
margin-left: 30px;
padding-top: 18px;
}
.title-bar {
background-color: #1e1e1e;
padding: 0.9rem;
}
.title-bar-title {
color: #fff;
font-family: "open sans", sans-serif;
font-weight: 400;
}
.top-bar-right {
z-index: 9999!important;
}
.top-bar {
background-color: #1e1e1e;
padding: 10px;
}
.top-bar ul {
background: #333;
}
.top-bar ul li {
background-color: #1e1e1e;
}
.top-bar ul li a {
color: #fff;
font-family: "open sans", sans-serif;
font-weight: 400;
}
#main-menu li:hover,
#main-menu li a:hover {
background: #2f2f2f;
}
#main-menu ul {
background: #1e1e1e ;
border: none;
}
#main-menu,
.title-bar {
background: #1e1e1e;
}
.menu-text {
background:-color: #fff;
}
/* END OF MENU*/
#canvas {
display: block;
}
/* START MOON SECTION*/
.moon_section {
background-color: #050917;
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/stars_background.png");
background-size: auto;
background-position: center;
margin: 0;
}
.moon_image_background_container {
position: relative;
height: 800px;
}
.moon_text_container {
position: absolute;
top: 10em;
right: 45%;
}
@media only screen and (min-width: 320px) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.moon_text_container {
top: 20em;
right: 10%;
}
}
@media only screen and (min-width: 640px) { /* min-width 640px, mobile-only styles, use when QAing mobile issues */
.moon_text_container {
top: 25em;
right: 40%;
}
}
@media only screen and (min-width: 40.062em) { /* min-width 641px, medium screens */
.moon_text_container {
top: 25em;
right: 40%;
}
}
@media only screen and (min-width: 64.063em) { /* large screens */
.moon_text_container {
top: 10em;
right: 42%;
}
}
@media only screen and (min-width: 130.063em) { /* extra large screens */
.moon_text_container {
top: 10em;
right: 51%;
}
}
/* END OF MOON SECTION*/
/* BEGIN OF SPACER*/
.spacer_section {
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/stars_background.png");
background-repeat: no-repeat;
background-size: auto%;
}
.spacer {
margin: 0;
}
@media only screen and (max-width: 40.062em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.spacer {
height: 6em;
}
.spacer_yellow {
height: 0em;
}
}
@media only screen and (min-width: 40.062em) { /* min-width 641px, medium screens */
.spacer {
height: 0em;
}
.spacer_yellow {
height: 0em;
}
}
@media only screen and (min-width: 64.063em) { /* large screens */
.spacer {
height: 6em;
}
.spacer_yellow {
height: 6em;
}
}
@media only screen and (min-width: 130.063em) { /* extra large screens */
.spacer {
height: 6em;
}
.spacer_yellow {
height: 6em;
}
}
/* END OF SPACER*/
/* START OF TIMELINE */
.timeline_section {
background-color: #050917;
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/stars_background.png");
background-size: auto;
background-position: center;
padding-bottom: 200px;
margin:0;
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.timeline_section{
padding-bottom: 50px;
}
}
/*
* — Start of Circle Subsection —
*/
.feature {
padding: 20px;
}
.circle-wrapper {
display: flex;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
justify-content: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.circle {
display: flex;
justify-content: center;
align-items: center;
width: 0;
height: 0;
padding: 14%;
border-radius: 50%;
border: 20px solid #856ee9;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.centered-text {
text-align: center;
}
@media only screen and (max-width: 40.062em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.centered-text {
text-align: center;
min-width: 200px;
max-width: 200px;
}
.circle {
padding: 120px;
border-radius: 10%;
}
}
@media only screen and (min-width: 40.063em) { /* min-width 641px, medium screens */
.centered-text {
text-align: center;
min-width: 200px;
max-width: 200px;
}
.circle {
padding: 150px;
}
}
@media only screen and (min-width: 64.063em) { /* large screens */
.centered-text {
text-align: center;
min-width: 200px;
max-width: 200px;
}
.circle {
padding: 200px;
}
}
@media only screen and (min-width: 130.063em) { /* large screens */
.centered-text {
text-align: center;
min-width: 200px;
max-width: 200px;
}
.circle {
padding: 200px;
}
}
/*
* — End of Circle Subsection —
*/
.timeline_image{
display:block;
margin-left: auto;
margin-right: auto;
}
.timeline_image2{
display:block;
margin-left: auto;
margin-right:auto;
padding:2rem;
}
.timeline_image3{
display:block;
margin-left: auto;
margin-right:auto;
padding: 2rem;
}
.vertical-line{
width: 2px;
background-color: #555862;
height: 250px;
max-height: 250px;
margin-left:auto;
margin-right:auto;
padding: 0px;
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.vertical-line{
height: 100px;
maxi-height: 100px;
}
}
/* END OF TIMELINE */
/* START OF THE MISSION SECTION*/
.the_mission_section {
background-color: #050917;
width: 100%;
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/stars_background.png");
background-size: auto;
background-position: center;
margin:0;
}
.the_mission_section_text {
padding-top: 3rem;
margin: auto;
}
@media only screen and (min-width: 64.063em) { /* large screens */
.the_mission_section_text {
max-width: 450px;
}
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.the_mission_section_text {
padding-top: 0;
padding-left: 5%;
padding-right: 5%;
text-align: center;
}
}
.the_mission_image_container {
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/wyg_wireframe.png");
background-repeat: no-repeat;
height: 800px;
background-size: auto;
margin: 0;
}
@media only screen and (max-width: 40.062em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.the_mission_image_container {
height: 300px;
background-size: cover;
}
}
@media only screen and (min-width: 40.063em) { /* min-width 641px, medium screens */
.the_mission_image_container {
background-position: 0%;
}
}
@media only screen and (min-width: 64.063em) { /* large screens */
.the_mission_image_container {
background-position: -50%;
}
}
@media only screen and (min-width: 130.063em) { /* large screens */
.the_mission_image_container {
background-position: 0%;
}
}
/* END OF THE MISSION SECTION*/
/* START OF SUCCEED SECTION*/
.succeed_section {
background-color: #050917;
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/stars_background.png");
background-size: auto;
background-position: center;
height: 60vh;
width: 100%;
}
.succeed_text_section {
text-align: left;
padding-top: 20%;
}
.fixture_image {
display: table;
margin: 0 auto;
}
@media only screen and (min-width: 64.063em) { /* large screens */
.succeed_text_section {
max-width: 400px;
}
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.succeed_text_section {
padding-top: 0;
padding-left: 5%;
padding-right: 5%;
text-align: center;
}
}
/* END OF SUCCEED SECTION*/
/* START OF GET A FULL WYG SECTION*/
.get_a_wyg_image_container {
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/wyg_screenshot.png");
background-repeat: no-repeat;
height: 800px;
background-size: auto;
margin: 0;
}
.get_a_wyg_image_container:hover {
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/wyg_screenshot_flipped.png");
}
@media only screen and (max-width: 40.062em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.get_a_wyg_image_container {
height: 300px;
background-size: cover;
}
}
@media only screen and (min-width: 40.063em) { /* min-width 641px, medium screens */
.get_a_wyg_image_container {
background-position: 0%;
}
}
@media only screen and (min-width: 64.063em) { /* large screens */
.get_a_wyg_image_container {
background-position: -50%;
}
}
@media only screen and (min-width: 130.063em) { /* large screens */
.get_a_wyg_image_container {
background-position: 0%;
}
}
/* END OF GET A FULL WYG SECTION*/
/* START OF WE WILL HELP YOU SECTION*/
.we_will_help_you_text_container {
padding-top: 10rem;
}
@media only screen and (min-width: 64.063em) { /* large screens */
.we_will_help_you_text_container {
max-width: 350px;
}
}
@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
.we_will_help_you_text_container {
padding-top: 0;
padding-left: 5%;
padding-right: 5%;
text-align: center;
}
}
/* END OF WE WILL HELP YOU SECTION*/
/* START OF WHO IS ELEGIBLE SECTION*/
.who_is_elegible_section {
width: 100%;
}
.background-wrapper {
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/shapes_background.png");
background-repeat: no-repeat;
background-position: center;
background-color: #ff9b0d;
}
.big_text {
background-color: #050917;
}
.student_subsection {
background-color: #4d36d4;
padding-top: 40px;
padding-bottom: 40px;
}
.student_inner_text {
padding-left: 35px;
padding-top: 35px;
padding-right: 35px;
}
.documents_subsection {
background-color: #ffffff;
padding-top: 40px;
padding-bottom: 40px;
}
.document_inner_text {
padding-left: 35px;
padding-top: 35px;
padding-right: 35px;
}
@media only screen and (min-width: 1024px) { /* large screens */
.big_text {
height: 550px;
max-width: 1020px;
background-color: #050917;
margin-top: 150px;
margin-left: -200px;
padding-left: 500px;
padding-top: 120px;
padding-right: 50px;
}
.cards {
max-width: 320px;
width: 320px;
}
.boxes_container {
width: 100%;
}
}
@media only screen and (max-width: 1023px) { /* medium screens */
.column_text_card {
width:100%;
}
.big_text {
background-color: #1b2030;
width:100%;
padding-top: 150px;
padding-bottom: 4em;
padding-left: 10%;
padding-right: 10%;
}
.background-wrapper {
background-image: none!important;
background-color: transparent;
}
.document_inner_text {
padding-top: 40px;
padding-left: 20%;
padding-right: 20%;
}
.student_inner_text {
padding-top: 40px;
padding-left: 20%;
padding-right: 20%;
}
.big_text {
padding-top: 4em;
text-align: center;
}
}
@media only screen and (max-width: 640px) { /* small screens */
.column_text_card {
width:100%;
}
.big_text {
background-color: #1b2030;
width:100%;
padding-top: 100px;
padding-bottom: 4em;
}
.background-wrapper {
background-image: none!important;
background-color: transparent;
}
.document_inner_text {
padding-left: 1.5em;
padding-top: 20px;
padding-right: 1.5em;
}
.student_inner_text {
padding-left: 1.5em;
padding-top: 20px;
padding-right: 1.5em;
}
.big_text {
padding-left: 1.5em;
padding-top: 4em;
padding-right: 1.5em;
text-align: center;
}
}
/* END OF WHO IS ELEGIBLE SECTION*/
/* START OF BELIEVE SECTION*/
.believe_section {
background-image: url("http://academic.cast-soft.com/3dlandingpage99/images/liveshow-crowd.png");
background-repeat: no-repeat;
background-position: center bottom;
padding-bottom: 35em;
}
@media only screen and (max-width: 640px) { /* small screen*/
.believe_text_container {
padding-top: 5em;
}
}
@media only screen and (min-width: 641px) { /* medium screen*/
.believe_text_container {
padding-top: 5em;
padding-left: 1em;
padding-right: 1em;
margin: auto;
max-width: 600px;
}
}
@media only screen and (min-width: 1024px) { /* large screen*/
.believe_text_container {
padding-top: 10em;
max-width: 800px;
}
.believe_paragraph {
padding-left: 3.5em;
padding-right: 3.5em;
}
}
/* END OF BELIEVE SECTION*/
/* START OF FOOTER SECTION*/
.footer_section {
background-color: #191919;
padding-top: 2em;
padding-bottom: 2em;
}
#wysiwyg_grey_logo {
height: 25px;
max-height: 25px;
max-width: 100px;
width: 100px;
}
#cast_grey_logo {
height: 25px;
max-height: 25px;
max-width: 100px;
width: 100px;
}
/* END OF FOOTER SECTION*/