|
|
(20 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | <html>
| |
- | <head>
| |
- | <style>
| |
| | | |
- | /***START OF GLOBAL STYLES***/
| |
- |
| |
- |
| |
- | /*hides the team tag at the top*/
| |
- | #content h1.firstHeading{
| |
- | visibility:hidden;
| |
- | }
| |
- |
| |
- | /*hides the top of the default top banner*/
| |
- | #p-logo{
| |
- | display: none;
| |
- | }
| |
- |
| |
- | /*hides the outline for the top section*/
| |
- | #top-section{
| |
- | height: 0px;
| |
- | margin-bottom: 0px !important;
| |
- | border: none;
| |
- | }
| |
- |
| |
- | /*colours the footer box*/
| |
- | #footer-box{
| |
- | background: white;
| |
- | }
| |
- |
| |
- | /*hides the search bar & controls*/
| |
- | #search-controls{
| |
- | overflow:hidden;
| |
- | display:none;
| |
- | background: none;
| |
- | position: absolute;
| |
- | top: 170px;
| |
- | right: 40px;
| |
- | }
| |
- |
| |
- | /*stops the menubar mouseover effect*/
| |
- | #menubar{
| |
- | position: absolute;
| |
- | background: none;
| |
- | color: black;
| |
- | }
| |
- |
| |
- | /*prevents mouseover effects on top left/right menu bars*/
| |
- | /*START*/
| |
- | .left-menu, .right-menu{
| |
- | position: absolute;
| |
- | background: none;
| |
- | color: black;
| |
- | }
| |
- |
| |
- | .left-menu li a, .right-menu li a{
| |
- | color: #000 !important;
| |
- | }
| |
- |
| |
- | .left-menu ul li, .right-menu ul li a{
| |
- | background: none;
| |
- | color: #000 !important;
| |
- | }
| |
- |
| |
- | .left-menu li a:hover, .right-menu li a:hover, .right-menu li a:visited, .right-menu li a:active{
| |
- | color: #000 !important;
| |
- | }
| |
- | /*END*/
| |
- |
| |
- | /*alters background colour*/
| |
- | .mediawiki{
| |
- | background: #E8E8E8;
| |
- | }
| |
- |
| |
- | /*removes the bottom box for links*/
| |
- | #catlinks{
| |
- | display:none;
| |
- | }
| |
- |
| |
- | /*removes the page border and top margin*/
| |
- | #content{
| |
- | border: none;
| |
- | margin-top: 0px;
| |
- | background: #E8E8E8;
| |
- | }
| |
- |
| |
- | /***END OF GLOBAL STYLES***/
| |
- |
| |
- | div.row{
| |
- | width:(100% - 2px);
| |
- | padding:0px;
| |
- | height:200px;
| |
- | border:1px solid black;
| |
- | margin:0px;
| |
- | background:silver;
| |
- | }
| |
- |
| |
- | div.header
| |
- | {
| |
- | width:963px;
| |
- | height:150px;
| |
- | background-image:url('images/header.jpg');
| |
- | margin:0px;
| |
- | }
| |
- |
| |
- | div.navbar
| |
- | {
| |
- | width:963px;
| |
- | height:40px;
| |
- | background:navy;
| |
- | margin:0px;
| |
- | overflow:hidden;
| |
- | }
| |
- |
| |
- | div.navlink
| |
- | {
| |
- | float:left;
| |
- | width:106px;
| |
- | padding-top:10px;
| |
- | border:1px solid white;
| |
- | border-left:0px;
| |
- | border-top:0px;
| |
- | border-bottom:0px;
| |
- | height:40px;
| |
- | background:navy;
| |
- | margin:0px;
| |
- | color:white;
| |
- | text-align:center;
| |
- | text-vertical-align:middle;
| |
- | overflow:hidden;
| |
- | font-weight:bold;
| |
- | font-family:"Arial";
| |
- | }
| |
- |
| |
- | div.navlink:hover
| |
- | {
| |
- | background:blue;
| |
- | }
| |
- |
| |
- | div.row_small
| |
- | {
| |
- | width:963px;
| |
- | height:200px;
| |
- | background:E8E8E8;
| |
- | margin:0px;
| |
- | overflow:hidden;
| |
- | }
| |
- |
| |
- | div.row_large
| |
- | {
| |
- | width:963px;
| |
- | height:300px;
| |
- | background:E8E8E8;
| |
- | margin:0px;
| |
- | }
| |
- |
| |
- | div.buffer
| |
- | {
| |
- | width:963px;
| |
- | height:6px;
| |
- | overflow:hidden;
| |
- | background:#E8E8E8;
| |
- | margin:0px;
| |
- | padding:0px;
| |
- | }
| |
- |
| |
- | div.small_left
| |
- | {
| |
- | float:left;
| |
- | margin-right:6px;
| |
- | margin-left:0px;
| |
- | margin-top:0px;
| |
- | margin-bottom:0px;
| |
- | width:317px;
| |
- | height: 100%;
| |
- | background:#98c3cd;
| |
- | }
| |
- |
| |
- | div.small_left:hover
| |
- | {
| |
- | background:#196AF7;
| |
- | color:white;
| |
- | }
| |
- |
| |
- | div.small_center
| |
- | {
| |
- | float:left;
| |
- | margin:0px;
| |
- | margin-top:0px;
| |
- | margin-bottom:0px;
| |
- | width:317px;
| |
- | height: 100%;
| |
- | background:#98c3cd;
| |
- | }
| |
- |
| |
- | div.small_center:hover
| |
- | {
| |
- | background:#196AF7;
| |
- | color:white;
| |
- | }
| |
- |
| |
- | div.small_right
| |
- | {
| |
- | float:left;
| |
- | margin-right:0px;
| |
- | margin-left:6px;
| |
- | margin-top:0px;
| |
- | margin-bottom:0px;
| |
- | width:317px;
| |
- | height: 100%;
| |
- | background:#98c3cd;
| |
- | }
| |
- |
| |
- | div.small_right:hover
| |
- | {
| |
- | background:#196AF7;
| |
- | color:white;
| |
- | }
| |
- |
| |
- | div.large_left
| |
- | {
| |
- | float:left;
| |
- | margin-left:0px;
| |
- | margin-right:0px;
| |
- | margin-top:0px;
| |
- | margin-bottom:0px;
| |
- | width:640px;
| |
- | height: 100%;
| |
- | background:#98c3cd;
| |
- | }
| |
- |
| |
- | div.large_left:hover
| |
- | {
| |
- | background:#196AF7;
| |
- | color:white;
| |
- | }
| |
- |
| |
- | div.large_right
| |
- | {
| |
- | float:left;
| |
- | margin-left:0px;
| |
- | margin-right:0px;
| |
- | margin-top:0px;
| |
- | margin-bottom:0px;
| |
- | width:640px;
| |
- | height: 100%;
| |
- | background:#98c3cd;
| |
- | }
| |
- |
| |
- | </style>
| |
- | </head>
| |
- |
| |
- | <body>
| |
- |
| |
- | <div class="header">
| |
- | Header image here
| |
- |
| |
- | </div>
| |
- |
| |
- | <div class="navbar">
| |
- | <div class="navlink">
| |
- | Home
| |
- | </div>
| |
- | <div class="navlink">
| |
- | Team
| |
- | </div>
| |
- | <div class="navlink">
| |
- | Profile
| |
- | </div>
| |
- | <div class="navlink">
| |
- | Project
| |
- | </div>
| |
- | <div class="navlink">
| |
- | Parts
| |
- | </div>
| |
- | <div class="navlink">
| |
- | Modeling
| |
- | </div>
| |
- | <div class="navlink">
| |
- | Notebook
| |
- | </div>
| |
- | <div class="navlink">
| |
- | Safety
| |
- | </div>
| |
- | <div class="navlink" style="border-right:0px;">
| |
- | Attributions
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div class="buffer">
| |
- | </div>
| |
- |
| |
- | <div class="row_large">
| |
- | <div class="large_left">
| |
- | <h1>Project Summary</h1>
| |
- | <p>
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | Nullam dui turpis, rhoncus vehicula hendrerit vitae, rhoncus at odio.
| |
- | Nullam auctor nulla ac lorem dignissim, ut sodales diam pharetra.
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit. <br><br>
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | Nullam dui turpis, rhoncus vehicula hendrerit vitae, rhoncus at odio.
| |
- | Nullam auctor nulla ac lorem dignissim, ut sodales diam pharetra
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | Nullam dui turpis, rhoncus vehicula hendrerit vitae, rhoncus at odio.
| |
- | Nullam auctor nulla ac lorem dignissim, ut sodales diam pharetra
| |
- | </p>
| |
- | </div>
| |
- | <div class="small_right" style="background:#33ccff;" >
| |
- | <br><br><br><br><br><br><br>
| |
- | <center><i><b>twitter feed here</b></i></center>
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div class="buffer">
| |
- | </div>
| |
- |
| |
- | <div class="row_small">
| |
- | <div class="small_left" style="background-image:url('images/uclstock.jpg');">
| |
- |
| |
- | </div>
| |
- | <div class="small_center">
| |
- |
| |
- | <h1>Heading</h1>
| |
- |
| |
- | <p>
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | Nullam dui turpis, rhoncus vehicula hendrerit vitae, rhoncus at odio.
| |
- | Nullam auctor nulla ac lorem dignissim, ut sodales diam pharetra.
| |
- | </p>
| |
- |
| |
- | </div>
| |
- | <div class="small_right">
| |
- |
| |
- | <h1>Heading</h1>
| |
- |
| |
- | <p>
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | Nullam dui turpis, rhoncus vehicula hendrerit vitae, rhoncus at odio.
| |
- | Nullam auctor nulla ac lorem dignissim, ut sodales diam pharetra.
| |
- | </p>
| |
- |
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div class="buffer">
| |
- | </div>
| |
- |
| |
- | <div class="row_small">
| |
- | <div class="large_left">
| |
- |
| |
- | <h1>Heading</h1>
| |
- |
| |
- | <p>
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | Nullam dui turpis, rhoncus vehicula hendrerit vitae, rhoncus at odio.
| |
- | Nullam auctor nulla ac lorem dignissim, ut sodales diam pharetra.
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | </p>
| |
- |
| |
- | </div>
| |
- | <div class="small_right" style="background-image:url('images/petri.jpg');">
| |
- |
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div class="buffer">
| |
- | </div>
| |
- |
| |
- | <div class="row_small">
| |
- | <div class="small_left">
| |
- |
| |
- | <h1>Heading</h1>
| |
- |
| |
- | <p>
| |
- | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
| |
- | Pellentesque at augue placerat, fringilla lorem ac, condimentum tellus.
| |
- | Nullam dui turpis, rhoncus vehicula hendrerit vitae, rhoncus at odio.
| |
- | Nullam auctor nulla ac lorem dignissim, ut sodales diam pharetra.
| |
- | </p>
| |
- |
| |
- | </div>
| |
- | <div class="large_right" style="background-image:url('images/team.jpg');">
| |
- |
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | <div class="buffer">
| |
- | </div>
| |
- | </body>
| |
- | </html>
| |