TEP landing page

Developer
Size
5,476 Kb
Views
10,120

How do I make an tep landing page?

Forked from Ritchie Altamirano's Pen TEP landing page.. What is a tep landing page? How do you make a tep landing page? This script and codes were developed by Moeid Saleem on 28 October 2022, Friday.

TEP landing page Previews

TEP landing page - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>TEP landing page</title> <head> <meta charset="UTF-8"> <title>ritchie</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" /> <link rel="stylesheet" href="css/reset.css"> <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'>
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.3/animate.min.css'>
<link rel='stylesheet prefetch' href='http://www.conversantmedia.com/sites/all/themes/my_theme/css/MyFontsWebfontsKit-jobvite.css'>
<link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Montserrat:400,700'>
<link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Open+Sans:400,300'> <link rel="stylesheet" href="css/style.css"> </head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <body>
<div class="jumbotron"> <div id="black"> <video autoplay muted loop id="video-bg"> <source src="http://i.istockimg.com/video_passthrough/82702421/153/82702421.mp4" type="video/mp4">
</video>
</div> <div style="" class="animated fadeInDown"> <div class="container"> <img src="https://s12.postimg.org/f509xvtqx/facebooklogo.png" class="logo"/></div> <div class="container"> <div class="col-md-12"> <h1>Studying Abroad will change the way<br class="visible-lg "/> you and those around you think.</h1> <hr style="width:25%;text-align:left;margin:30px 0; border:2.5px solid #fff;"/> </div> <div class="col-md-8"> <h2 class="subtitle">A catalyst for the day when students go to college wondering not if they will go abroad but when.</h2> </div> </div> </div>
</div>
<div class="container" id="main-wrapper"> <div class="col-md-7 main-content"> <h3>Get across that financial barrier with creativity.</h3> <p> To embolden student to pursue the lifelong benefits of studying abroad will be no short task, but to see that day come sooner, you have to bridge the gap with innovation, that is the goal of The Exchange project. </p> <div class="white-box"> <ul>
<li><p class="">Short ribs filet mignon sausage andouille. Fatback ground round kevin, cupim turkey cow doner shank bresaola pastrami tenderloin frankfurter biltong.</p></li>
<li><p class="">Cow tail turkey ball tip hamburger leberkas brisket. Leberkas salami beef, landjaeger capicola venison ribeye shank porchetta pastrami biltong spare ribs. </p></li>
<li><p class="">T-bone bacon ham hock, ball tip swine cow picanha prosciutto beef sirloin short loin chicken.</p></li>
</ul> </div><!-- /. End White Box 0--> <p class="final-cta">Still working on this, but feel free to use it as a template for any landing page.</p> </div> <div class="col-md-4 col-md-offset-1"> <div class="form-container"> <h4 class="form">Fill out the form below to get started today!</h4> <form method="post" name="frmContentDownload">
<div><label for="FirstName1">First Name</label><input class="form-control" name="FirstName1" type="text" value="" /></div>
<div><label for="LastName1">Last Name</label><input class="form-control" name="LastName1" type="text" value="" /></div>
<div><label for="emailAddress">Email</label><input class="form-control" name="emailAddress" type="text" value="" /></div>
<div><label for="Company1">Company</label><input class="form-control" name="Company1" type="text" value="" /></div>
<div><label for="Title1">Title</label><input class="form-control" name="Title1" type="text" value="" /></div>
<div><label for="StateProvince1">State or Province</label><select class="form-control" name="StateProvince1">
<option class="placeholder" value="" disabled selected>STATE OR PROVINCE &#8609;</option>
<option value="AK">Alaska</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
<option value="AS">American Samoa</option>
<option value="AZ">Arizona</option>
<option value="CA-N">California - Northern</option>
<option value="CA-S">California - Southern</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DC">D.C.</option>
<option value="DE">Delaware</option>
<option value="FL">Florida</option>
<option value="FM">Micronesia</option>
<option value="GA">Georgia</option>
<option value="GU">Guam</option>
<option value="HI">Hawaii</option>
<option value="IA">Iowa</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="MA">Massachusetts</option>
<option value="MD">Maryland</option>
<option value="ME">Maine</option>
<option value="MH">Marshall Islands</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MO">Missouri</option>
<option value="MP">Marianas</option>
<option value="MS">Mississippi</option>
<option value="MT">Montana</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="NE">Nebraska</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NV">Nevada</option>
<option value="NY">New York</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="PR">Puerto Rico</option>
<option value="PW">Palau</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VA">Virginia</option>
<option value="VI">Virgin Islands</option>
<option value="VT">Vermont</option>
<option value="WA">Washington</option>
<option value="WI">Wisconsin</option>
<option value="WV">West Virginia</option>
<option value="WY">Wyoming</option>
<option value="AA">Military Americas</option>
<option value="AE">Military Europe/ME/Canada</option>
<option value="AP">Military Pacific</option>
<option value="AB">Alberta</option>
<option value="MB">Manitoba</option>
<option value="BC">British Columbia</option>
<option value="NB">New Brunswick</option>
<option value="NL">Newfoundland and Labrador</option>
<option value="NS">Nova Scotia</option>
<option value="NT">Northwest Territories</option>
<option value="NU">Nunavut</option>
<option value="ON">Ontario</option>
<option value="PE">Prince Edward Island</option>
<option value="QC">Quebec</option>
<option value="SK">Saskatchewan</option>
<option value="YT">Yukon Territory</option>
</select></div>
<div><label for="comments">Comments</label><input class="form-control" name="comments" type="text" value="" /></div>
<div><input class="btn btn-primary btn-lg btn-block" type="submit" value="Download Now" /></div>
</form> </div> </div>
</div>
<footer> <div class="container">© 2015 Your Company LLC. All rights reserved.</div>
</footer> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script> </body>
</html> <script src="js/index.js"></script>
</body>
</html>

TEP landing page - Script Codes CSS Codes

@charset "UTF-8";
body {	background: #f1f1f2;	-webkit-font-smoothing: antialiased;	-moz-osx-font-smoothing: grayscale;
}
html {	position: relative;	min-height: 100%;
}
body {	margin: 0 0 50px; /* bottom = footer height */
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {	font-family: 'Montserrat', sans-serif; font-weight:700;	letter-spacing: 0px;
}
textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, select:focus, .uneditable-input:focus {	border-color: #bd9b60;	box-shadow: none;	outline: 0 none !important;
}
p {	font-size: 16px;	font-family: 'Open Sans', sans-serif; font-weight:300;
}
.jumbotron .logo { margin-left: 17px; padding-bottom: 75px;	max-width: 120px;
}
.jumbotron {	width: 100%;	min-height: 700px;	background: url('http://arti.us/clients/conversant/images/driving.jpg') center center;	background-size: cover;	opacity: 1;	display: table;	width: 100%;	position: relative;	border-radius: 0px;	color: white;	margin: 0;	-webkit-clip-path: polygon(0 0%, 100% 0, 100% 100%, 0% 85%); clip-path: url(#poly);	overflow: hidden;
}
.jumbotron .logo { margin-left: 17px; padding-bottom: 75px;	max-width: 120px;
}
.jumbotron h1 { color: #37ffba;	font-size: 50px;
}
.jumbotron h2 {	font-size: 18px; line-height: 25px;	margin: 0;
}
#video-bg {	position: absolute;	right: 0;	bottom: 0;	width: auto;	min-width: 100%;	height: auto;	min-height: 100%;	background: #000;	z-index: -1;	background-size: cover;	opacity: 1; -webkit-clip-path: polygon(0 0%, 100% 0, 100% 100%, 0% 85%); clip-path: url(#poly);	overflow: hidden;
}
#black {	position: absolute;	right: 0;	bottom: 0;	width: auto;	min-width: 100%;	height: auto;	min-height: 100%;	background: rgba(26,29,37,0.8);
}
#main-wrapper {	margin-top: 0;
}
.main-content {	padding-top: 25px; line-height: 25px;
}
.main-content .white-box {	padding: 25px;	margin: 35px 0;	background: #fff
}
.main-content ul {	list-style: initial;	margin-left: 15px
}
.main-content .final-cta {	font-size: 18px;	font-family: 'Montserrat', sans-serif; font-weight:100; margin-top: 4rem; padding-bottom: 8rem
}
.form-container {	background: #fff;	padding: 25px;	border-radius: 3px;	margin-top: -100px;
}
.form{ line-height: 25px; font-weight: 100;
}
.form-container div {	margin: 20px 0;
}
.form-container input, .form-container select {	border: none;	border-bottom: 1px solid #ccc;	font-family: 'Open Sans', sans-serif; font-weight:300;	font-size: 12px;	padding: 3px 0;	border-radius: 0px;	box-shadow: none;	-webkit-appearance: none;	color: #000;	letter-spacing: 1px
}
.form-container option {	margin: 0;
}
.form-container label {	display: none
}
.form-container h4 {	margin: 0;
}
.form-container .placeholder {	color: #000 !important;	text-transform: uppercase;	letter-spacing: 1px;	font-size: 12px;	font-family: 'Open Sans', sans-serif; font-weight:300;
}
select option:first-child {	display: none;
}
::-webkit-input-placeholder { color: #000 !important; text-transform:uppercase;
letter-spacing:1px;
font-size:12px;
font-family:Gibson-Light;
}
.form-container .btn-primary {	background: #00af66;	padding: 15px 0;	border-radius: 3px;	font-family: 'Montserrat', sans-serif; font-weight:700;	text-transform: uppercase;	color: white
}
:-moz-placeholder { /* Firefox 18- */ color: #000 !important; text-transform:uppercase;
letter-spacing:1px;
font-size:12px;
font-family: 'Open Sans', sans-serif; font-weight:300
}
::-moz-placeholder { /* Firefox 19+ */ color: #000 !important; text-transform:uppercase;
letter-spacing:1px;
font-size:12px;
font-family: 'Open Sans', sans-serif; font-weight:300
}
:-ms-input-placeholder { color: #000 !important; text-transform:uppercase;
letter-spacing:1px;
font-size:12px;
font-family: 'Open Sans', sans-serif; font-weight:300
}
footer {	color: #999;	position: absolute;	background: rgba(26,29,37,1);	left: 0;	bottom: 0;	height: 40px;	width: 100%;	padding: 10px 0;	font-size: 12px;
}
@media (min-width: 320px) and (max-width: 480px) {
.jumbotron {	min-height: 590px;	padding: 5px 15px;
}
.jumbotron h1 {	font-size: 30px;
}
.logo{ padding-top: 4rem }
.jumbotron h2 {	font-size: 16px;
}
.form-container {	margin-top: 20px;
}
} /**** END 320 and 480 ****/

TEP landing page - Script Codes JS Codes

 $('.form-container label').each(function(){ var getTitle = $(this).html(); $(this).parent().find('input').attr('placeholder', getTitle) });
TEP landing page - Script Codes
TEP landing page - Script Codes
Home Page Home
Developer Moeid Saleem
Username moeidsaleem
Uploaded October 28, 2022
Rating 3
Size 5,476 Kb
Views 10,120
Do you need developer help for TEP landing page?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Moeid Saleem (moeidsaleem) Script Codes
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!