Team:BAU-Indonesia

From 2012.igem.org

(Difference between revisions)
Line 9: Line 9:
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
     </head>
     </head>
 +
 +
<style>
 +
/*
 +
Design by Metamorphosis Design
 +
http://www.metamorphozis.com
 +
Released for free under a Creative Commons Attribution 2.5 License
 +
*/
 +
 +
*{
 +
    margin: 0px;
 +
    padding: 0px;
 +
}
 +
 +
img{
 +
    padding: 0px;
 +
    border: none;
 +
}
 +
 +
a{
 +
    color: #ffffff;
 +
    text-decoration: none;
 +
    font-weight: bold;
 +
}
 +
 +
a:hover {
 +
    text-decoration: none;
 +
    color: #c70000;
 +
}
 +
 +
h2{
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 20px;
 +
color: #ffffff;
 +
font-weight: normal;
 +
background: url(images/title_bg.png) repeat-x bottom;
 +
padding-bottom: 3px;
 +
}
 +
 +
h3{
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 20px;
 +
color: #000000;
 +
font-weight: normal;
 +
 +
padding-bottom: 3px;
 +
margin-bottom: 5px;
 +
}
 +
 +
h4{
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 20px;
 +
color: #ffffff;
 +
font-weight: normal;
 +
padding-bottom: 6px;
 +
background: url(images/title_bg.png) repeat-x bottom;
 +
}
 +
 +
body {
 +
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
    line-height: 22px;
 +
    color: #ffffff;
 +
    background: #000000 url(images/bg.jpg);
 +
}
 +
 +
.clear{
 +
clear: both;
 +
}
 +
 +
#bg_top{
 +
background: url(images/bg_top.jpg) no-repeat center top;
 +
min-height: 100%;
 +
}
 +
 +
#wrap{
 +
width: 1016px;
 +
margin: 0 auto;
 +
padding: 9px 0px 0px 0px;
 +
}
 +
 +
#wrap_bg{
 +
width: 1216px;
 +
margin: 0 auto;
 +
background: url(images/logo_bg.png) no-repeat left top;
 +
}
 +
 +
/*menu*/
 +
 +
#menu{
 +
float: right;
 +
width: 573px;
 +
height: 39px;
 +
}
 +
 +
#menu ul {
 +
    padding-left: 10px;
 +
    padding-top: 7px;
 +
    margin: 0px;
 +
}
 +
 +
#menu li {
 +
    display: inline;
 +
}
 +
 +
#menu a {
 +
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 14px;
 +
    font-weight: normal;
 +
    display: block;
 +
    float: left;
 +
    width: 108px;
 +
    height: 26px;
 +
    text-align: center;
 +
    text-decoration: none;
 +
    color: #AFAFAF;
 +
padding-right: 2px;
 +
padding-top: 3px;
 +
}
 +
 +
#menu .but1_menu a:hover, #menu .but1_menu .active {
 +
    height: 26px;
 +
    background: url(images/menu_active1.png) no-repeat center top;
 +
color: #ffffff;
 +
}
 +
 +
#menu .but2_menu a:hover, #menu .but2_menu .active {
 +
    height: 26px;
 +
    background: url(images/menu_active1.png) no-repeat center top;
 +
color: #ffffff;
 +
}
 +
 +
#menu .but3_menu a:hover, #menu .but3_menu .active {
 +
    height: 26px;
 +
    background: url(images/menu_active1.png) no-repeat center top;
 +
color: #ffffff;
 +
}
 +
 +
#menu .but4_menu a:hover, #menu .but4_menu .active {
 +
    height: 26px;
 +
    background: url(images/menu_active1.png) no-repeat center top;
 +
color: #ffffff;
 +
}
 +
 +
#menu .but5_menu a:hover, #menu .but5_menu .active {
 +
    height: 26px;
 +
    background: url(images/menu_active1.png) no-repeat center top;
 +
color: #ffffff;
 +
}
 +
/*logo*/
 +
 +
#logo{
 +
height: 110px;
 +
padding-top: 70px;
 +
}
 +
 +
#logo h1 a{
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 16px;
 +
color: #ffffff;
 +
font-style: italic;
 +
font-weight: normal;
 +
}
 +
 +
#logo a small{
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 12px;
 +
color: #ffffff;
 +
font-style: italic;
 +
font-weight: normal;
 +
}
 +
 +
/*prew_box*/
 +
 +
#prew_box{
 +
background: url(images/prew_bg.png) no-repeat top left;
 +
height: 329px;
 +
padding: 11px;
 +
}
 +
 +
#prew_but_box{
 +
width: 76px;
 +
margin: 0 auto;
 +
height: 20px;
 +
padding-top: 20px;
 +
}
 +
 +
#prew_but_left{
 +
float: left;
 +
}
 +
 +
#prew_but_right{
 +
float: right;
 +
}
 +
 +
/*content*/
 +
 +
#content{
 +
color: #ffffff;
 +
background: url(images/content_bg.png);
 +
margin-top: 10px;
 +
padding: 10px;
 +
}
 +
 +
.text{
 +
padding: 10px 0px 0px 0px;
 +
}
 +
 +
.italic_style{
 +
font-style: italic;
 +
}
 +
 +
.read{
 +
float: right;
 +
padding: 0px 10px 0px 0px;
 +
}
 +
 +
.read a{
 +
color: #c70000;
 +
font-weight: normal;
 +
}
 +
 +
.read a:hover{
 +
color: #000000;
 +
}
 +
 +
#left_column{
 +
width: 633px;
 +
float: left;
 +
}
 +
 +
.left_news_top{
 +
height: 22px;
 +
padding-top: 13px;
 +
}
 +
 +
.left_news_bg{
 +
padding: 0px 20px 0px 20px;
 +
}
 +
 +
.left_news_bot{
 +
height: 22px;
 +
}
 +
 +
#right_column{
 +
width: 360px;
 +
float: right;
 +
}
 +
 +
.right_news_top{
 +
height: 22px;
 +
padding-top: 13px;
 +
}
 +
 +
.right_news_bg{
 +
padding: 0px 20px 0px 20px;
 +
}
 +
 +
.right_news_bot{
 +
height: 22px;
 +
}
 +
 +
/*footer*/
 +
 +
#footer{
 +
padding: 10px 0px 20px 0px;
 +
color: #ffffff
 +
}
 +
 +
#footer a{
 +
color: #ffffff;
 +
}
 +
 +
#footer a:hover{
 +
color: #c70000;
 +
}
 +
 +
 +
#footer_bottom
 +
{
 +
padding-top: 10px;
 +
font-size: 10px;
 +
padding-left: 60px;
 +
}
 +
 +
#footer_bottom a{
 +
font-weight: normal;
 +
}
 +
 +
 +
.row-top {width:100%;padding:33px 0 42px;}
 +
.row-padding {padding:0 62px}
 +
.col-1, .col-2, .col-3, .col-4  {float:left}
 +
.list-services li {line-height:24px;padding-left:28px; list-style:none}
 +
.list-services li a {color:#9d9d9d;text-decoration:none}
 +
.list-services li a:hover {text-decoration:underline}
 +
.list-services li.item-1 {background:url(images/facebook.png) 0 3px no-repeat}
 +
.list-services li.item-2 {background:url(images/twitter.png) 0 3px no-repeat}
 +
.list-services li.item-3 {background:url(images/linkedin.png) 0 3px no-repeat}
 +
.menu li a, .list-1 li a,  {text-decoration:none}
 +
.list-1 li {line-height:24px;padding-left:10px;background:url(images/marker.gif) 0 10px no-repeat;  list-style:none}
 +
.list-1 li a {display:inline-block;color:#9d9d9d}
 +
.list-1 li a:hover {text-decoration:underline}
 +
 +
.indent3 {padding-top:28px}
 +
.footer-logo {display:block;color:#666666;font-size:30px;line-height:1em;text-transform:uppercase;letter-spacing:-3px;font-weight:400;margin-bottom:5px}
 +
.footer-logo strong {color:#666666;text-transform:none;display:inline-block}
 +
.phone {display:inline-block;font-size: 24px;line-height:1.2em;color:#666666;letter-spacing:-1px;padding-left:5px}
 +
.phone strong {color:#666666}
 +
.col-1 {width:190px;margin-right:55px}
 +
.col-2 {width:110px;margin-right:55px}
 +
.col-3 {width:140px;margin-right:65px}
 +
.col-4 {width:235px}
 +
 +
 +
.ls{
 +
    list-style: none;
 +
    padding-left: 0px;
 +
}
 +
 +
.ls li{
 +
    background: url(images/ls.gif) no-repeat 0px 7px;
 +
    margin-bottom: 4px;
 +
    padding-left: 15px;
 +
}
 +
 +
.ls2{
 +
    list-style: none;
 +
    padding-left: 0px;
 +
padding-top: 5px;
 +
}
 +
 +
.ls2 li{
 +
    background: url(images/ls2.gif) no-repeat 0px 7px;
 +
    padding-bottom: 4px;
 +
    padding-left: 15px;
 +
}
 +
 +
.button_box{
 +
padding-top: 5px;
 +
}
 +
 +
.button_box a{
 +
padding-right: 20px;
 +
}
 +
 +
/*blog*/
 +
 +
.news_top{
 +
    clear: both;
 +
}
 +
 +
.layer_border{
 +
background: url(images/title_bg.jpg) repeat-x bottom;
 +
padding-bottom: 3px;
 +
}
 +
 +
.news_top_left{
 +
    background: url(images/date_bg.jpg) no-repeat right;
 +
    width: 45px;
 +
    height: 42px;
 +
    float: left;
 +
    text-align: center;
 +
margin: 5px 0px 0px 0px;
 +
}
 +
 +
.news_top_left .date_day{
 +
    color: #ffffff;
 +
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
    font-weight: normal;
 +
    padding-top: 8px;
 +
line-height: 12px;
 +
}
 +
 +
.news_top_left .date_month{
 +
    color: #ffffff;
 +
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
    font-weight: normal;
 +
}
 +
 +
.news_top_right{
 +
    float: left;
 +
    padding-left: 15px;
 +
    width: 529px;
 +
}
 +
 +
.title_post_left{
 +
float: left;
 +
}
 +
 +
.title_post_right{
 +
float: right;
 +
}
 +
 +
/*gallery*/
 +
 +
.gallery_top{
 +
background: url(images/gallery_top.jpg) no-repeat;
 +
height: 21px;
 +
}
 +
 +
.gallery_bg{
 +
background: url(images/gallery_bg.jpg) repeat-y left;
 +
padding: 0px 11px 0px 11px;
 +
}
 +
 +
  .gallery_bot{
 +
background: url(images/gallery_bot.jpg) no-repeat;
 +
height: 21px;
 +
}
 +
 +
.gal{
 +
background: url(images/gal_bg.jpg) no-repeat 0px 0px;
 +
width: 457px;
 +
height: 250px;
 +
padding: 10px 10px 10px 10px;
 +
float: left;
 +
margin: 0px 10px 0px 10px;
 +
}
 +
 +
.gal h3{
 +
background: none;
 +
margin-bottom: 0px;
 +
}
 +
 +
.gal_img{
 +
border: 1px solid #ffffff;
 +
}
 +
 +
.gal p{
 +
color: #000000;
 +
}
 +
 +
.razd{
 +
height: 10px;
 +
clear: both;
 +
}
 +
 
 +
.pagenav{
 +
padding-left: 10px;
 +
}
 +
 +
.pagenav ul{
 +
list-style: none;
 +
padding: 0px;
 +
}
 +
 +
.pagenav ul li a{
 +
display: block;
 +
float: left;
 +
background: url(images/pagenav_bg.jpg) no-repeat;
 +
width: 20px;
 +
height: 21px;
 +
line-height: 21px;
 +
text-align: center;
 +
color: #ffffff;
 +
margin-right: 5px;
 +
font-weight: normal;
 +
}
 +
 +
.pagenav ul li a:hover{
 +
color: #ffffff;
 +
background: url(images/pagenav_select.jpg) no-repeat;
 +
}
 +
 +
.pagenav ul li .select{
 +
color: #ffffff;
 +
background: url(images/pagenav_select.jpg) no-repeat;
 +
}
 +
 +
/*about*/
 +
 +
.date_news{
 +
text-decoration: underline;
 +
}
 +
 +
.news{
 +
padding: 10px 0px 20px 0px;
 +
}
 +
 +
/*contact*/
 +
 +
#contact_form fieldset {
 +
    border: none;
 +
padding-top: 20px;
 +
}
 +
 +
#contact_form input {
 +
    margin-bottom: 5px;
 +
}
 +
 +
#contact-submit, #contact-clear{
 +
    width: 74px;
 +
    height: 19px;
 +
    color: #efefef;
 +
    background: url(images/contact_but.jpg);
 +
    background-repeat: no-repeat;
 +
    background-position: left bottom;
 +
    border: none;
 +
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
    font-weight: normal;
 +
font-style: italic;
 +
margin-right: 40px;
 +
}
 +
 +
#con_name, #con_email, #con_website {
 +
    width: 571px;
 +
    height: 29px;
 +
    padding-top: 0px;
 +
    padding-left: 10px;
 +
    padding-right: 10px;
 +
    border: none;
 +
    background: url(images/contact_input.jpg);
 +
    background-repeat: no-repeat;
 +
    background-position: left top;
 +
    color: #373636;
 +
line-height: 29px;
 +
}
 +
 +
#con_mess {
 +
    width: 571px;
 +
    height: 103px;
 +
    padding-top: 4px;
 +
    padding-left: 10px;
 +
    padding-right: 10px;
 +
    padding-bottom: 15px;
 +
    border: none;
 +
    background: url(images/contact_mess.jpg);
 +
    background-repeat: no-repeat;
 +
    background-position: left top;
 +
    color: #373636;
 +
    margin-bottom: 15px;
 +
font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
}
 +
 +
.pad_left{
 +
    padding-left: 30px;
 +
}
 +
 +
.contact_news{
 +
padding-top: 15px;
 +
}
 +
 +
 +
 +
/*=================================*/
 +
/* Nivo Slider Demo
 +
/* November 2010
 +
/* By: Gilbert Pellegrom
 +
/* http://dev7studios.com
 +
/*=================================*/
 +
 +
 +
#slider-wrapper {
 +
    background:url(images/top.jpg) no-repeat;
 +
    width:994px;
 +
    height: 299px;
 +
    margin:0 auto;
 +
}
 +
 +
#slider {
 +
position:relative;
 +
    width: 994px;
 +
    height: 299px;
 +
background:url(images/loading.gif) no-repeat 50% 50%;
 +
}
 +
#slider img {
 +
position:absolute;
 +
top:0px;
 +
left:0px;
 +
display:none;
 +
}
 +
#slider a {
 +
border:0;
 +
display:block;
 +
}
 +
 +
.nivo-controlNav {
 +
position:absolute;
 +
left: 440px;
 +
bottom:-42px;
 +
 +
}
 +
.nivo-controlNav a {
 +
display:block;
 +
width:22px;
 +
height:22px;
 +
background:url(images/bullets.png) no-repeat;
 +
text-indent:-9999px;
 +
border:0;
 +
margin-right:3px;
 +
float:left;
 +
}
 +
.nivo-controlNav a.active {
 +
background-position:0 -22px;
 +
}
 +
 +
.nivo-directionNav a {
 +
display:block;
 +
width:30px;
 +
height:30px;
 +
background:url(images/arrows.png) no-repeat;
 +
text-indent:-9999px;
 +
border:0;
 +
}
 +
a.nivo-nextNav {
 +
background-position:-30px 0;
 +
right:15px;
 +
}
 +
a.nivo-prevNav {
 +
left:15px;
 +
}
 +
 +
.nivo-caption {
 +
    text-shadow:none;
 +
    font-family: Helvetica, Arial, sans-serif;
 +
}
 +
.nivo-caption a {
 +
    color:#efe9d1;
 +
    text-decoration:underline;
 +
}
 +
 +
/*
 +
* jQuery Nivo Slider v2.3
 +
* http://nivo.dev7studios.com
 +
*
 +
* Copyright 2010, Gilbert Pellegrom
 +
* Free to use and abuse under the MIT license.
 +
* http://www.opensource.org/licenses/mit-license.php
 +
*
 +
* March 2010
 +
*/
 +
 +
 +
/* The Nivo Slider styles */
 +
.nivoSlider {
 +
position:relative;
 +
}
 +
.nivoSlider img {
 +
position:absolute;
 +
top:0px;
 +
left:0px;
 +
}
 +
/* If an image is wrapped in a link */
 +
.nivoSlider a.nivo-imageLink {
 +
position:absolute;
 +
top:0px;
 +
left:0px;
 +
width:100%;
 +
height:100%;
 +
border:0;
 +
padding:0;
 +
margin:0;
 +
z-index:60;
 +
display:none;
 +
}
 +
/* The slices in the Slider */
 +
.nivo-slice {
 +
display:block;
 +
position:absolute;
 +
z-index:50;
 +
height:100%;
 +
}
 +
/* Caption styles */
 +
.nivo-caption {
 +
position:absolute;
 +
left:0px;
 +
bottom:0px;
 +
background:#000;
 +
color:#fff;
 +
opacity:0.8; /* Overridden by captionOpacity setting */
 +
width:100%;
 +
z-index:89;
 +
}
 +
.nivo-caption p {
 +
padding:5px;
 +
margin:0;
 +
}
 +
.nivo-caption a {
 +
display:inline !important;
 +
}
 +
.nivo-html-caption {
 +
    display:none;
 +
}
 +
/* Direction nav styles (e.g. Next & Prev) */
 +
.nivo-directionNav a {
 +
position:absolute;
 +
top:45%;
 +
z-index:99;
 +
cursor:pointer;
 +
}
 +
.nivo-prevNav {
 +
left:0px;
 +
}
 +
.nivo-nextNav {
 +
right:0px;
 +
}
 +
/* Control nav styles (e.g. 1,2,3...) */
 +
.nivo-controlNav a {
 +
position:relative;
 +
z-index:99;
 +
cursor:pointer;
 +
}
 +
.nivo-controlNav a.active {
 +
font-weight:bold;
 +
}
 +
</style>
 +
     <body>
     <body>
         <div id="bg_top">
         <div id="bg_top">

Revision as of 09:01, 9 September 2012

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Metamorphosis Design Free Css Templates

Welcome To Our Website

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Nam sed massa nunc. Duis malesuada elit a orci auctor imperdiet ut vitae mauris. Proin ultrices est non dolor mollis condimentum at vel orci. Sed tristique ultricies orci sit amet placerat. Etiam tincidunt vestibulum arcu, in malesuada nibh mollis a. Aliquam erat volutpat. Sed ac


Proin ultrices est non dolor mollis condimentum at vel orci.
Sed tristique ultricies orci sit amet placerat. Etiam tincidunt vestibulum arcu, in malesuada nibh mollis a. Aliquam erat volutpat. Sed ac posuere odio. Etiam eu purus mi. Nunc dictum metus non nunc ultrices malesuada. Quisque dictum eros id metus lobortis hendrerit. Donec mollis venenatis pellentesque. Praesent massa enim, varius nec commodo eget, varius mollis augue. Mauris sodales vestibulum est,

read more »

Welcome To Our Website

Nam non diam diam, vel iaculis ligula.
Nullam interdum fermentum erat sed blandit. Nam tincidunt rutrum arcu, vel lacinia risus luctus vel. Duis sed eleifend sem. Etiam rhoncus orci quis orci tempor aliquam. Mauris sagittis enim eu quam pulvinar

read more »

Latest News

Cras volutpat urna ut nibh rutrum faucibus.
Duis rutrum porttitor vulputate. Suspendisse sed tellus id libero dignissim volut porttitor vulputate. Suspendisse sed tellus id libero

read more »

Nam adipiscing erat tristique arcu hendrerit at sagittis massa pharetra.
Nunc posuere gravida odio, et tincidunt elit posuere at. Integer turpis nisi, pellen porttitor vulputate. Suspendisse sed tellus id libero dignissim volutpat. Vestibulum tempus vulputate luctus.

read more »

Testimonials

"Praesent sagittis feugiat orci, eu suscipit justo dapibus nec. Duis at lacinia metus. Morbi interdum, justo ac blandit aliquet, nunc odio laoreet justo, vel accumsan libero"

John Doe

" Nam non diam diam, vel iaculis ligula. Nullam interdum fermentum erat sed blandit. Nam tincidunt rutrum arcu, vel lacinia risus luctus vel. Duis sed eleifend sem. "

John Doe

"Etiam rhoncus orci quis orci tempor aliquam. Mauris sagittis enim eu quam pulvinar dapibus. Pellentesque"

John Doe

Retrieved from "http://2012.igem.org/Team:BAU-Indonesia"