Template:Team:BAU-Indonesia/css

From 2012.igem.org

(Difference between revisions)
 
(62 intermediate revisions not shown)
Line 2: Line 2:
<style>
<style>
-
*
+
/*
-
{
+
Design by Metamorphosis Design
-
margin: 0px;
+
http://www.metamorphozis.com
-
padding: 0px;
+
Released for free under a Creative Commons Attribution 2.5 License
 +
*/
 +
 
 +
*{
 +
    margin: 0px;
 +
    padding: 0px;
}
}
-
.left-menu,.left-menu a {
+
img{
-
color: white;
+
    padding: 0px;
-
left: 0;
+
    border: none;
-
text-align: left;
+
}
}
-
.left-menu:hover {
+
a{
-
background-color: transparent;
+
    color: #000;
 +
    text-decoration: none;
 +
    font-weight: bold;
}
}
-
.left-menu:hover a {
+
a:hover {
-
color: white;
+
    text-decoration: none;
-
text-decoration: none !important;
+
    color: #c70000;
}
}
-
.left-menu li a:hover {
+
h2{
-
color: #white;
+
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 24px;
 +
color: #000;
 +
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: #000;
 +
font-weight: normal;
 +
padding-bottom: 3px;
 +
margin-bottom: 5px;
 +
}
-
.right-menu li a {
+
h4{
-
background-color: transparent;
+
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 18px;
 +
color: #000;
 +
font-weight: normal;
 +
padding-bottom: 6px;
 +
background: url(images/title_bg.png) repeat-x bottom;
}
}
-
.right-menu li{
+
p{
-
background-color: transparent;
+
color:#000;}
 +
 
 +
body {
 +
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
    line-height: 22px;
 +
    color: #ffffff;
 +
    background: #000000 url(https://static.igem.org/mediawiki/2012/archive/9/98/20120923184816%21Bg.jpg);
}
}
-
.right-menu,.right-menu a {
+
.clear{
-
color: white;
+
clear: both;
-
right: 0;
+
-
text-align: right;
+
}
}
-
.right-menu:hover {
+
#bg_top{
-
background-color: transparent;
+
background: url(images/bg_top.jpg) no-repeat center top;
 +
min-height: 100%;
}
}
-
.right-menu:hover a {
+
#wrap{
-
color: white;
+
width: 1016px;
 +
margin: 0 auto;
 +
padding: 9px 0px 0px 0px;
}
}
-
.right-menu li a {
+
#wrap_bg{
-
background-color: transparent;
+
width: 1216px;
-
color: white;
+
margin: 0 auto;
-
padding: 0 15px 0 0;
+
}
}
-
.right-menu li a:hover {
+
/*menu*/
-
color: white;
+
 
 +
#menu{
 +
float: right;
 +
width: 573px;
 +
height: 39px;
}
}
 +
#menu ul {
 +
    padding-left: 10px;
 +
    padding-top: 7px;
 +
    margin: 0px;
 +
}
-
#p-logo {
+
#menu li {
-
display: none;
+
    display: inline;
}
}
-
#search-controls {
+
#menu a {
-
display: none;
+
    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;
}
}
-
#top-section {
+
#menu .but1_menu a:hover, #menu .but1_menu .active {
-
height: 30px;
+
    height: 26px;
-
width: 100%;
+
    background: url(images/menu_active1.png) no-repeat center top;
-
        background: none repeat scroll 0 0 #1C140D;
+
color: #ffffff;
-
+
}
}
-
#menubar {
+
#menu .but2_menu a:hover, #menu .but2_menu .active {
-
top: 1px;
+
    height: 26px;
-
font-family: 'Droid Sans', sans-serif;
+
    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;
 +
margin-top:-70px;
 +
margin-bottom:30px;
 +
margin-left:10px;
 +
}
-
.firstHeading {
+
#logo h1 a{
-
    display: none;
+
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 16px;
 +
color: #ffffff;
 +
font-style: italic;
 +
font-weight: normal;
}
}
-
#catlinks {
+
#logo a small{
-
display: none;
+
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 12px;
 +
color: #ffffff;
 +
font-style: italic;
 +
font-weight: normal;
}
}
-
#content {
+
/*prew_box*/
-
background: transparent;
+
 
-
padding: 0;
+
#prew_box{
-
width: 100%;
+
background: url(https://static.igem.org/mediawiki/2012/3/36/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;
 +
margin-top: 10px;
 +
padding: 10px;
}
}
 +
.text{
 +
padding: 10px 0px 0px 0px;
 +
}
-
#footer-box {
+
.italic_style{
-
border: 1px solid #dfdfdf;
+
font-style: italic;
-
width: 80%;
+
-
background: white;
+
-
padding: 0;
+
-
display: none;
+
}
}
 +
.read{
 +
float: right;
 +
padding: 0px 10px 0px 0px;
 +
}
-
#footer {
+
.read a{
-
margin: 0 auto;
+
color: #c70000;
-
width: 95%;
+
font-weight: normal;
}
}
 +
.read a:hover{
 +
color: #000000;
 +
}
-
a:link {
+
#left_column{
-
color: #c9f3ac;
+
width: 633px;
 +
float: left;
}
}
-
a:hover {
+
.left_news_top{
-
text-decoration: none;
+
height: 22px;
-
color: #FF0000;
+
padding-top: 13px;
}
}
-
a:visited {
+
.left_news_bg{
-
color: #A5A9B2;
+
padding: 0px 20px 0px 20px;
}
}
-
body {
+
.left_news_bot{
-
+
height: 22px;
-
background: #6A8B1A url(https://static.igem.org/mediawiki/igem.org/2/22/Back_all.gif);
+
-
font: 13px Arial, Helvetica, sans-serif;
+
-
color: #383838;
+
}
}
-
#content
+
#right_column{
-
{
+
width: 360px;
-
width: 774px;
+
float: right;
-
border-left: 15px solid #5E7D06;
+
-
border-right: 15px solid #5E7D06;
+
-
margin: 0px auto;
+
}
}
-
#main
+
.right_news_top{
-
{
+
height: 22px;
-
width: 754px;
+
padding-top: 13px;
-
padding: 10px;
+
-
padding-top: 20px;
+
-
background: #080064 url(images/table_back.gif) repeat-x top;
+
}
}
-
#back
+
.right_news_bg{
-
{
+
padding: 0px 20px 0px 20px;
-
width: 774px;
+
}
}
-
#header {
+
.right_news_bot{
-
height: 308px;
+
height: 22px;
-
text-align: right;
+
-
background: url(https://static.igem.org/mediawiki/igem.org/b/bc/Header12.jpg) no-repeat;
+
}
}
-
#logo {
+
/*footer*/
-
width: 754px;
+
#footer{
-
height: 100px;
+
padding: 10px 0px 20px 0px;
-
text-align: left;
+
color: #ffffff
-
padding-top: 208px;
+
-
padding-left: 20px;
+
}
}
 +
#footer a{
 +
color: #ffffff;
 +
}
-
#logo a {
+
#footer a:hover{
-
text-decoration: none;
+
color: #c70000;
-
font-style: italic;
+
-
font-size: 18px;
+
-
color: #6fff09;
+
}
}
-
#logo H2 a
+
 
 +
 
 +
#footer_bottom
{
{
-
font-size: 12px;
+
padding-top: 10px;
 +
font-size: 10px;
 +
padding-left: 60px;
}
}
 +
#footer_bottom a{
 +
font-weight: normal;
 +
}
-
#menu
+
 
-
{
+
.row-top {width:100%;padding:33px 0 42px;}
-
width: 774px;
+
.row-padding {padding:0 62px}
-
height: 61px;
+
.col-1, .col-2, .col-3, .col-4  {float:left}
-
background: url(images/menu.gif) repeat-x;
+
.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(https://static.igem.org/mediawiki/2012/3/35/Twitterads.png) 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;
}
}
-
#menu ul {
+
.ls li{
-
list-style: none;
+
    background: url(images/ls.gif) no-repeat 0px 7px;
 +
    margin-bottom: 4px;
 +
    padding-left: 15px;
}
}
-
#menu li {
+
.ls2{
-
+
    list-style: none;
-
display: inline;  
+
    padding-left: 0px;
-
+
padding-top: 5px;
}
}
-
#menu a {
+
.ls2 li{
-
float: left;
+
     background: url(images/ls2.gif) no-repeat 0px 7px;
-
width: 100px;
+
    padding-bottom: 4px;
-
height: 61px;
+
    padding-left: 15px;
-
     display: block;
+
-
text-align: center;
+
-
text-decoration: none;
+
-
color: #ffffff;
+
-
text-transform: uppercase;
+
-
font:bold 14px/61px Arial, Helvetica, sans-serif;
+
}
}
-
#menu a:hover {
+
.button_box{
-
width: 100px;
+
padding-top: 5px;
-
    height: 61px;
+
-
color: #c9f3ac;
+
-
text-decoration: underline;
+
-
background: url(images/menu_r.gif) repeat-x;
+
}
}
 +
.button_box a{
 +
padding-right: 20px;
 +
}
 +
/*blog*/
 +
.news_top{
 +
    clear: both;
 +
}
-
#right
+
.layer_border{
-
{
+
background: url(images/title_bg.jpg) repeat-x bottom;
-
width: 228px;
+
padding-bottom: 3px;
-
float: right;
+
}
}
-
#right H3
+
.news_top_left{
-
{
+
    background: url(images/date_bg.jpg) no-repeat right;
-
width: 228px;
+
    width: 45px;
-
height: 51px;
+
    height: 42px;
-
text-transform: uppercase;
+
    float: left;
-
color: #c9f3ac;
+
    text-align: center;
-
background: url(images/title.gif) no-repeat;
+
margin: 5px 0px 0px 0px;
-
font:bold 14px/51px Arial, Helvetica, sans-serif;
+
-
text-align:center;
+
}
}
-
#right ul {
+
.news_top_left .date_day{
-
list-style: none;
+
    color: #ffffff;
 +
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
    font-weight: normal;
 +
    padding-top: 8px;
 +
line-height: 12px;
}
}
-
#right ul li
+
 
-
{
+
.news_top_left .date_month{
-
font:normal 11px/18px Arial, Helvetica, sans-serif;
+
    color: #ffffff;
-
color:#FFFFFF;
+
    font-family: Arial, Helvetica, sans-serif;
 +
    font-size: 12px;
 +
    font-weight: normal;
}
}
-
#right .title_back
+
 
-
{
+
.news_top_right{
-
background: url(images/title_back.gif) repeat-y;
+
    float: left;
 +
    padding-left: 15px;
 +
    width: 529px;
}
}
-
#right li  {
+
.title_post_left{
-
padding: 7px;
+
float: left;
-
padding-left: 10px;
+
-
 
+
}
}
-
#right .sub
+
.title_post_right{
-
{
+
float: right;
-
padding-left: 30px;
+
}
}
-
#right a {
+
/*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;
color: #ffffff;
 +
background: url(images/pagenav_select.jpg) no-repeat;
}
}
-
#right a:visited {
+
 
 +
.pagenav ul li .select{
color: #ffffff;
color: #ffffff;
 +
background: url(images/pagenav_select.jpg) no-repeat;
}
}
-
#right p
+
/*about*/
-
{
+
 
-
font-size: 10px;
+
.date_news{
-
padding-left: 10px;
+
text-decoration: underline;
}
}
-
.bot
+
.news{
-
{
+
padding: 10px 0px 20px 0px;
-
padding: 10px;
+
}
}
 +
/*contact*/
-
#left
+
#contact_form fieldset {
-
{
+
    border: none;
-
width: 480px;
+
padding-top: 20px;
-
background: #c9e4f3;
+
-
border: 1px solid #f8ff2f;
+
-
padding: 10px;
+
}
}
 +
#contact_form input {
 +
    margin-bottom: 5px;
 +
}
-
#left H4
+
#contact-submit, #contact-clear{
-
{
+
    width: 74px;
-
margin: 0;
+
    height: 19px;
-
padding: 0px;
+
    color: #efefef;
-
font-size: 12px;
+
    background: url(images/contact_but.jpg);
-
color: #c9f3ac;
+
    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;
}
}
-
#left a
+
#con_name, #con_email, #con_website {
-
{
+
    width: 571px;
-
color: #208A06;
+
    height: 29px;
-
text-decoration: none;
+
    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;
}
}
-
#left p {
+
#con_mess {
-
margin: 5px;
+
    width: 571px;
-
padding: 0;
+
    height: 103px;
-
font-size:13px;
+
    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;
}
}
-
#left h2 {
+
.pad_left{
-
margin: 0;
+
    padding-left: 30px;
-
padding: 0;
+
-
padding-top: 10px;
+
-
color: #208A06;
+
-
font-size:20px;
+
}
}
-
#left ol, #left ul
+
.contact_news{
-
{
+
padding-top: 15px;
-
margin-left: 30px;
+
}
}
-
.date {
 
-
text-align: right;
 
-
color: #208A06;
 
-
font-size: 11px;
 
 +
 +
/*=================================*/
 +
/* 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;
}
}
-
.date a {
+
#slider {
-
color: #208A06;
+
position:relative;
 +
    width: 994px;
 +
    height: 299px;
 +
background:url(https://static.igem.org/mediawiki/2012/c/cf/Syu6.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(https://static.igem.org/mediawiki/2012/7/72/Loadingggs.gif) 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(https://static.igem.org/mediawiki/2012/2/2c/Tahu.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;
 +
}
 +
/*-----------------*/
 +
#floatMenu {
 +
position:absolute;
 +
top:10px;
 +
left:65%;
 +
margin-left:-870px;
 +
width:100px;}
 +
#floatMenu ul {list-style-type: none;}
 +
#floatMenu ul li a {
 +
display:block;
 +
background:-moz-linear-gradient(-90deg, #222, #2b2b2b) repeat scroll 0 0 transparent;
 +
background:-webkit-gradient(linear, left top, left bottom, from(#222), to(#2b2b2b));
 +
border:0px solid #99;
 +
border-left:3px solid #fff;
 +
text-decoration:none;
 +
color:#fff;
 +
padding:5px 5px 5px 25px;
 +
width:100px;
 +
-moz-border-radius-topleft: 5px;
 +
-moz-border-radius-bottomright: 5px;
 +
-moz-border-radius-bottomleft: 15px;
 +
-moz-border-radius-topright: 15px;
 +
-webkit-border-top-right-radius: 15px;
 +
-webkit-border-bottom-left-radius: 15px;
 +
-webkit-transition: all 0.6s ease-out;
 +
box-shadow: #333 0px 0px 10px;
 +
-moz-box-shadow: #333 0px 0px 10px;
 +
-webkit-box-shadow: #333 0px 0px 10px;
 +
}
 +
#floatMenu ul li a:hover {
 +
color:#AD3D29;
 +
background-color: #000;
 +
border-right:3px solid #999;
 +
width:100px;
 +
-moz-border-radius-topleft: 15px;
 +
-moz-border-radius-topright: 5px;
 +
-moz-border-radius-bottomright: 15px;
 +
-moz-border-radius-bottomleft: 5px;
 +
-webkit-border-top-left-radius: 15px;
 +
-webkit-border-top-right-radius: 0px;
 +
-webkit-border-bottom-right-radius: 15px;
 +
-webkit-border-bottom-left-radius: 0px;
 +
}
 +
#floatMenu ul.menu1 li a:hover {border-color:#bdbdbd;}
 +
#s {
 +
background:#AD3D29;
 +
color:#00ff00;
 +
width:230px;
 +
padding-left:15px;
 +
font-weight:bold;
 +
font-size:10px;
 +
padding:1px;
 +
border-bottom:1px solid #F0F0F0;
 +
border-right:1px solid #F0F0F0;
 +
border-top:1px solid #F0F0F0;
 +
border-left:0;
 +
font-family: Verdana;
 +
}
-
#footer {
+
 
-
height: 74px;
+
 
-
clear: both;
+
/*accordion menu tutorial for you
-
background: url(images/table_back.gif) repeat-x top;
+
**************************************/
 +
 
 +
#isinya{
 +
color:#000;
 +
}
 +
 +
 +
.verticalaccordion>ul {
 +
    margin: 0;
 +
margin-left:0px;
 +
margin-top:0px;
 +
    padding: 0;
 +
    list-style:none;
 +
  width: 300px;
 +
}
}
-
#footer p {
+
.verticalaccordion>ul>li {
-
margin: 0;
+
    display:block;
-
font-size: 10px;
+
    overflow: hidden;
-
text-align: center;
+
    margin: 0;
-
color: #ffffff;
+
    padding: 0;
-
padding:20px;
+
    list-style:none;
 +
    height:40px;
 +
    width: 300px;
 +
 
 +
    /* Decorative CSS */
 +
    background-color:#f0f0f0;
 +
 
 +
    /* CSS3 Transition Effect */
 +
    transition: height 0.3s ease-in-out;
 +
    -moz-transition: height 0.3s ease-in-out;
 +
    -webkit-transition: height 0.3s ease-in-out;
 +
    -o-transition: height 0.3s ease-in-out;
 +
 
}
}
-
#footer a {
+
.verticalaccordion>ul>li>h3 {
-
color: #ffffff;
+
    font-weight:normal;
 +
    margin: 0;
 +
    padding:10px;
 +
    height:19px;
 +
 +
 
 +
    /* Decorative CSS */
 +
    border-top:#f0f0f0 1px solid;
 +
    font-family: Flavors, Helvetica, sans-serif;
 +
    text-decoration:none;
 +
    color: #000;
 +
    background: #cccccc;
 +
 
 +
    /* CSS3 Gradient Effect */
 +
    background: -moz-linear-gradient( top, #999999, #cccccc);
 +
    background: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#cccccc));
 +
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff999999, endColorstr=#ffcccccc); /* IE 7 */
 +
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff999999, endColorstr=#ffcccccc)";   /* IE 8 */
}
}
 +
.verticalaccordion>ul>li>div {
 +
    margin:0;
 +
    overflow: auto;
 +
    padding:10px;
 +
    height:600px;
 +
}
 +
.verticalaccordion>ul>li:hover {
 +
    height: 600px;
 +
}
 +
 +
.verticalaccordion:hover>ul>li:hover>h3 {
 +
    /* Decorative CSS */
 +
    color:#FFF;
 +
    background: #000000;
 +
 +
    /* CSS3 Gradient Effect */
 +
    background: -moz-linear-gradient( top, #454545, #000000); /* FF, Flock */
 +
    background: -webkit-gradient(linear, left top, left bottom, from(#454545), to(#000000)); /* Safari, Chrome */
 +
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff454545, endColorstr=#ff000000); /* IE 5.5 - IE 7 */
 +
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff454545, endColorstr=#ff000000)";  /* IE 8 */
 +
}
 +
 +
.verticalaccordion>ul>li>h3:hover {
 +
    cursor:pointer;}
 +
 +
 +
</style>
</style>
</html>
</html>

Latest revision as of 22:34, 26 September 2012