A Pen by Sreekanth Are
How do I make an a pen by sreekanth are?
What is a a pen by sreekanth are? How do you make a a pen by sreekanth are? This script and codes were developed by Sreekanth Are on 21 November 2022, Monday.
A Pen by Sreekanth Are - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Sreekanth Are</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <head> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.css" rel="stylesheet" />
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="0" id="home"> <header> <div class="navbar-wrapper"> <div class="container"> <div id="navtop" class="navbar navbar-default navbar-fixed-top"> <div class="navbar-header"> <a class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </a> <a class="navbar-brand" href="#">The James Baldwin School</a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li><a href="#home">Home</a> </li> <li><a href="#about">About</a> </li> <li><a href="#faculty">Faculty</a> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Parents <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">Action</a> </li> <li><a href="#">Another action</a> </li> <li><a href="#">Something else here</a> </li> <li class="divider"></li> <li><a href="#">Separated link</a> </li> <li><a href="#">One more separated link</a> </li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Students <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">Action</a> </li> <li><a href="#">Another action</a> </li> <li><a href="#">Something else here</a> </li> <li class="divider"></li> <li><a href="#">Separated link</a> </li> <li><a href="#">One more separated link</a> </li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Teachers <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">Action</a> </li> <li><a href="#">Another action</a> </li> <li><a href="#">Something else here</a> </li> <li class="divider"></li> <li><a href="#">Separated link</a> </li> <li><a href="#">One more separated link</a> </li> </ul> </li> </ul> </div> <!--- /.navbar-collapse collapse ---> </div> <!--- /#navtop ---> </div> <!-- /.container --> </div> <!-- /.navbar wrapper --> </header> <!--- JAMES-BALDWIN ========================================================
============================================================================ ---> <a href="#" target="_blank"> <img src="http://www.f-covers.com/cover/beautiful-view-facebook-cover-timeline-banner-for-fb.jpg" style="width:100%"> </a> <div class="image-caption"> </div> <!--- JUMBOTRON ============================================================
============================================================================ ---> <div class="jumbotron" id="about"> <div class="container"> <div class="text-center"> <h1>The James Baldwin School</h1> <h2>A School For Expeditionary Learning.</h2> <p>It is our mission to provide a philosophical and practical education for all students, an education that features creativity and inquiry, encourages habitual reading and productivity, as well as self-reflection and original thought. We agree with Socrates that the “unexamined life is not worth living,” and it is our desire to prepare students to live thoughtful and meaningful lives. We are committed to inspiring the love of learning in our students.</p> <p>It is our mission, as well, at the James Baldwin School, to provide a haven for students who have previously experienced school as unresponsive to their needs as individuals. We wish for all students to find their voice and to speak knowledgeably and thoughtfully on issues that concern their school, their world. We aid students in this endeavor by personalizing our learning situations, by democratizing and humanizing the school environment, and by creating a “talking culture,” an atmosphere of informal intellectual discourse among students and faculty.</p> <p>Democratizing the school would be impossible without our Core Values. Our core values help students aquire the important skills needed to continue their journey through life. Most importantly, our core values maintain safety and democracy for students and faculty.</p> <a class="btn btn-large btn-danger" href="#">Learn more about Core Values</a> </div> </div> </div> <!-- Marketing messaging and featurettes ===================================
============================================================================ --> <div class="container marketing" id="faculty"> <div class="row"> <div class="col-md-4 text-center"> <img class="img-circle" src="http://placehold.it/140x140"> <h2>Brady Smith</h2> <p>Principal Co-Director</p> <p><a class="btn btn-default" href="#">View details</a> </p> </div> <div class="col-md-4 text-center"> <img class="img-circle" src="http://placehold.it/140x140"> <h2>Josh Heisler</h2> <p>Teacher Co-Director</p> <p><a class="btn btn-default" href="#">View details</a> </p> </div> <div class="col-md-4 text-center"> <img class="img-circle" src="http://placehold.it/140x140"> <h2>Christine Olsen</h2> <p>Admissions</p> <p><a class="btn btn-default" href="#">View details</a> </p> </div> <div class="col-md-4 text-center"> <img class="img-circle" src="http://placehold.it/140x140"> <h2>Brady Smith</h2> <p>Principal Co-Director</p> <p><a class="btn btn-default" href="#">View details</a> </p> </div> <div class="col-md-4 text-center"> <img class="img-circle" src="http://placehold.it/140x140"> <h2>Josh Heisler</h2> <p>Teacher Co-Director</p> <p><a class="btn btn-default" href="#">View details</a> </p> </div> <div class="col-md-4 text-center"> <img class="img-circle" src="http://placehold.it/140x140"> <h2>Christine Olsen</h2> <p>Admissions</p> <p><a class="btn btn-default" href="#">View details</a> </p> </div> </div> <!-- /.row --> <div id="team-btn"> <div class="text-center"> <a class="btn btn-large btn-danger" href="#">See the rest of Our Team</a> </div> <!--- /.text-center ---> </div> <!--- /.team-btn ---> <!-- START THE FEATURETTES --> <!--- /END THE FEATURETTES ---> </div> <!-- /.container marketing --> <!-- FOOTER --> <hr> <div class="container"> <footer class="text-center" id="footer"> <p>This site was created by Isaac Perez.<a href="#"> Back to top.</a> </p> <p>Copyright 2014 © The James Baldwin School. <br>Some Rights Reserved</p> </footer> </div> <!-- /.container --> <!--- Javascript Bootsrap ---> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.js"></script>
</body>
</body>
</html>
A Pen by Sreekanth Are - Script Codes CSS Codes
/* BOOTSTRAP 3.x GLOBAL STYLES
-------------------------------------------------- */
body { padding-bottom: 40px; color: #5a5a5a; transition:all 0.5s;
}
/* NAVBAR
-------------------------------------------------- */
/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper { position: absolute; top: 0; left: 0; right: 0; z-index: 10;
}
.navbar-default { background-color: #763f8d; border-color: #5e2d73;
}
.navbar-default .navbar-brand { color: #ffffff;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus { color: #ecdbff;
}
.navbar-default .navbar-text { color: #ffffff;
}
.navbar-default .navbar-nav > li > a { color: #ffffff;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus { color: #ecdbff;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus { color: #ecdbff; background-color: #5e2d73;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus { color: #ecdbff; background-color: #5e2d73;
}
.navbar-default .navbar-toggle { border-color: #5e2d73;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background-color: #5e2d73;
}
.navbar-default .navbar-toggle .icon-bar { background-color: #ffffff;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form { border-color: #ffffff;
}
.navbar-default .navbar-link { color: #ffffff;
}
.navbar-default .navbar-link:hover { color: #ecdbff;
}
/* The navbar becomes detached from the top, so we round the corners */
.navbar-wrapper .navbar { border-radius: 4px;
}
/* Jumbotron
-------------------------------------------------- */
.jumbotron {}
/* MARKETING CONTENT
-------------------------------------------------- */
/* Pad the edges of the mobile views a bit */
.marketing { padding-top: 75px; padding-left: 15px; padding-right: 15px; padding-bottom: 75px;
}
/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 { text-align: center; margin-bottom: 20px;
}
.marketing h2 { font-weight: normal;
}
.marketing .col-lg-4 p { margin-left: 10px; margin-right: 10px;
}
#team-btn { padding-top: 25px; padding-bottom: 10px;
}
/* Featurettes
------------------------- */
.featurette-divider { margin: 80px 0; /* Space out the Bootstrap
more */
}
.featurette { padding-top: 120px; /* Vertically center images part 1: add padding above and below text. */ overflow: hidden; /* Vertically center images part 2: clear their floats. */
}
.featurette-image { margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
}
/* Give some space on the sides of the floated elements so text doesn't run right into it. */
.featurette-image.pull-left { margin-right: 40px;
}
.featurette-image.pull-right { margin-left: 40px;
}
/* Thin out the marketing headings */
.featurette-heading { font-size: 50px; font-weight: 300; line-height: 1; letter-spacing: -1px;
}
/* Footer
-------------------------------------------------- */
hr { display: block; margin-top: 0.5em; margin-bottom: 0.5em; margin-left: auto; margin-right: auto; border-style: inset; border-width: 1px;
}
footer {}
/* Responsive CSS
-------------------------------------------------- */
/* Navigation */
@media (max-width: 767px) { .navbar-default .navbar-nav .open .dropdown-menu > li > a { color: #ffffff; } .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { color: #ecdbff; } .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { color: #ecdbff; background-color: #5e2d73; }
}
/* Marketing */
@media (min-width: 768px) { .marketing { padding-left: 0; padding-right: 0; }
}
Developer | Sreekanth Are |
Username | srees |
Uploaded | November 21, 2022 |
Rating | 3 |
Size | 4,407 Kb |
Views | 12,144 |
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!
Name | Size |
Scrollable table header fixed in bootstrap | 1,750 Kb |
Css box with close button | 2,800 Kb |
Widget builder | 5,600 Kb |
Template | 5,801 Kb |
Bootstrap Tables - Responsive | 1,904 Kb |
Bootstrap Template | 5,983 Kb |
Bootstrap 3 carousel multi div slider | 3,465 Kb |
WonderWe mail templates | 3,535 Kb |
Subscribe | 3,321 Kb |
Add or Edit modal UI | 2,683 Kb |
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!
Name | Username | Size |
Sexy Social Buttons | Ipiyale | 2,226 Kb |
Tester1 | Sasquatchbrawley | 2,001 Kb |
JavaScript Animation | Rcmeisty | 4,581 Kb |
FontAwesome icons with animation | Nicotinell | 2,083 Kb |
A simple log in form made with css | Mayurelbhar | 2,160 Kb |
Spin | Elalemanyo | 8,262 Kb |
Flat buttons for Eliassen.com | Kdooley89 | 1,737 Kb |
Slide out Menu | Rbiggs | 4,936 Kb |
Slim Grid SASS SCSS v3.2 | Thesturs | 4,709 Kb |
Halo 5 REQ Guide Bookmarklet | Cwacht | 3,993 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!