Team:Alberta/sample.css
From 2011.igem.org
m |
|||
(324 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
/* NOTE This is an edited version of the MediaWiki 'monobook' style sheet | /* NOTE This is an edited version of the MediaWiki 'monobook' style sheet | ||
- | + | * edited by Team Alberta 2010 for their wiki | |
- | + | */ | |
- | + | ||
div#test{ | div#test{ | ||
Line 9: | Line 8: | ||
height:100px; | height:100px; | ||
} | } | ||
+ | |||
+ | div#preload { display: none; } | ||
/* things we want to hide */ | /* things we want to hide */ | ||
Line 38: | Line 39: | ||
position:absolute; | position:absolute; | ||
} | } | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
#searchGoButton{ | #searchGoButton{ | ||
Line 55: | Line 45: | ||
} | } | ||
#mw-searchButton{ | #mw-searchButton{ | ||
- | background-color:# | + | background-color:#3C2415; |
border:1px solid white; | border:1px solid white; | ||
color:transparent; | color:transparent; | ||
Line 69: | Line 59: | ||
} | } | ||
+ | #catlinks{ | ||
+ | display:none; | ||
+ | } | ||
Line 97: | Line 90: | ||
div#igem-logo-link{ | div#igem-logo-link{ | ||
- | + | background-color:transparent; | |
- | + | background-image:url("https://static.igem.org/mediawiki/2011/7/71/TeamAlberta_IGEMLOGO_100x77.png"); | |
- | + | height:77px; | |
- | + | margin:0; | |
- | + | position:absolute; | |
- | + | width:100px; | |
- | + | left:870px; | |
- | + | top:33px; | |
} | } | ||
div#igem-logo-link a{ | div#igem-logo-link a{ | ||
- | + | color:transparent; | |
- | + | display:block; | |
- | + | height:77px; | |
- | + | width:100px; | |
} | } | ||
+ | |||
+ | #second-nav{ | ||
+ | background-color:#F7941E; | ||
+ | position:absolute; | ||
+ | top:155px; | ||
+ | left:150px; | ||
+ | height:28px; | ||
+ | font-size:11px; | ||
+ | } | ||
+ | |||
+ | #second-nav ul { | ||
+ | list-style:none; | ||
+ | /* list-style-type:none;*/ | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | /*overflow:hidden;*/ | ||
+ | /* for IE */ | ||
+ | filter:alpha(opacity=96); | ||
+ | /* CSS3 standard */ | ||
+ | opacity:0.96; | ||
+ | |||
+ | } | ||
+ | #second-nav ul li{ | ||
+ | border-style: solid; | ||
+ | border-color: #000; | ||
+ | border-width: 1px; | ||
+ | float:left; | ||
+ | position:relative; | ||
+ | } | ||
+ | |||
+ | #second-nav ul li a:visited,#second-nav ul li a:link{ | ||
+ | display:block; | ||
+ | width:150px; | ||
+ | height:28px; | ||
+ | color:#FFFFFF; | ||
+ | background-color:#F7941E; | ||
+ | text-align:center; | ||
+ | |||
+ | } | ||
+ | #second-nav ul li a:hover,#second-nav ul li a.selected { | ||
+ | background-color:#3C2415; | ||
+ | text-decoration:none; | ||
+ | //left:auto; | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | #second-nav li.headlink ul{ | ||
+ | display:none; | ||
+ | list-style:none; | ||
+ | background-color:#3C2415; | ||
+ | text-align:center; | ||
+ | padding:6px,0px; | ||
+ | |||
+ | position:absolute; | ||
+ | |||
+ | |||
+ | } | ||
+ | #second-nav li.headlink ul li{ | ||
+ | float:center; | ||
+ | } | ||
+ | |||
+ | |||
#top-strip{ | #top-strip{ | ||
- | + | /* background-color:#FFFCD5; */ | |
clear:both; | clear:both; | ||
display:block; | display:block; | ||
- | + | /* height:200px;*/ | |
- | + | ||
- | + | ||
position:absolute; | position:absolute; | ||
- | top: | + | top:30px; |
- | width: | + | width:900px; |
} | } | ||
#top-strip h2{ | #top-strip h2{ | ||
- | color:# | + | color:#000000; |
- | display: | + | display:inline; |
- | font-size: | + | font-size:70px; |
font-weight:bold; | font-weight:bold; | ||
- | left: | + | left:200px; |
- | line-height: | + | line-height:79px; |
position:relative; | position:relative; | ||
- | top: | + | top:32px; |
} | } | ||
Line 146: | Line 200: | ||
/*** navbar styling **/ | /*** navbar styling **/ | ||
+ | #navbar { | ||
+ | width:1050px; | ||
+ | position:absolute; | ||
+ | top:16px; | ||
+ | left:-25px; | ||
+ | font-size:11px; | ||
+ | } | ||
+ | |||
+ | #navbar ul { | ||
+ | list-style:none; | ||
+ | /* list-style-type:none;*/ | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | /*overflow:hidden;*/ | ||
+ | /* for IE */ | ||
+ | filter:alpha(opacity=96); | ||
+ | /* CSS3 standard */ | ||
+ | opacity:0.96; | ||
+ | |||
+ | } | ||
+ | #navbar ul li{ | ||
+ | float:left; | ||
+ | position:relative; | ||
+ | } | ||
+ | |||
+ | #navbar ul li a:visited,#navbar ul li a:link{ | ||
+ | display:block; | ||
+ | width:150px; | ||
+ | height:28px; | ||
+ | color:#FFFFFF; | ||
+ | background-color:#F7941E; | ||
+ | text-align:center; | ||
+ | |||
+ | } | ||
+ | #navbar ul li a:hover,#navbar ul li a.selected { | ||
+ | background-color:#3C2415; | ||
+ | text-decoration:none; | ||
+ | left:auto; | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | #navbar li.headlink ul{ | ||
+ | display:none; | ||
+ | list-style:none; | ||
+ | background-color:#3C2415; | ||
+ | text-align:center; | ||
+ | padding:6px,0px; | ||
+ | |||
+ | position:absolute; | ||
+ | |||
+ | |||
+ | } | ||
+ | #navbar li.headlink ul li{ | ||
+ | float:center; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* | ||
+ | div#navbar { | ||
+ | width: 900px; | ||
+ | } | ||
#navbar { | #navbar { | ||
position:absolute; | position:absolute; | ||
- | + | top:20px; | |
} | } | ||
#navbar ul { | #navbar ul { | ||
Line 156: | Line 272: | ||
#navbar ul li{ | #navbar ul li{ | ||
float:left; | float:left; | ||
- | + | position:relative; | |
} | } | ||
#navbar ul li a:visited,#navbar ul li a:link{ | #navbar ul li a:visited,#navbar ul li a:link{ | ||
margin-right:30px; | margin-right:30px; | ||
color:#fff; | color:#fff; | ||
- | + | ||
} | } | ||
#navbar ul li a:hover,#navbar ul li a.selected { | #navbar ul li a:hover,#navbar ul li a.selected { | ||
text-decoration: underline; | text-decoration: underline; | ||
font-weight: bold; | font-weight: bold; | ||
- | + | color:#3C2415; | |
- | color:# | + | |
text-decoration:none; | text-decoration:none; | ||
} | } | ||
Line 173: | Line 288: | ||
display:table; | display:table; | ||
display:none; | display:none; | ||
- | background-color:# | + | background-color:#F7941E; |
- | + | ||
text-align:left; | text-align:left; | ||
padding:10px; | padding:10px; | ||
Line 183: | Line 297: | ||
} | } | ||
#navbar li.headlink ul li{ | #navbar li.headlink ul li{ | ||
- | float: | + | float:center; |
} | } | ||
+ | */ | ||
+ | |||
Line 191: | Line 307: | ||
float:left; | float:left; | ||
/* leave space for header */ | /* leave space for header */ | ||
- | margin-top: | + | margin-top:160px; |
min-height:1em; | min-height:1em; | ||
} | } | ||
Line 213: | Line 329: | ||
#left-sidebar, #right-sidebar{ | #left-sidebar, #right-sidebar{ | ||
+ | margin-top:160px; | ||
width:198px; | width:198px; | ||
} | } | ||
Line 225: | Line 342: | ||
border:none; | border:none; | ||
margin-left:20px; | margin-left:20px; | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
Line 470: | Line 580: | ||
} | } | ||
span.toctext { | span.toctext { | ||
- | color: # | + | color: #3C2415; |
font-size:14px; | font-size:14px; | ||
line-height:14px; | line-height:14px; | ||
Line 484: | Line 594: | ||
body { | body { | ||
- | background-color:# | + | background-color:#F7941E; |
- | background-image:url(" | + | background-image:url("https://static.igem.org/mediawiki/2011/7/74/TeamAlberta-strip2.png"); |
background-repeat:repeat-x; | background-repeat:repeat-x; | ||
+ | font-family:corbel; | ||
+ | text-align:justify; | ||
} | } | ||
Line 504: | Line 616: | ||
h1, h2, h3, h4, h5, h6 { | h1, h2, h3, h4, h5, h6 { | ||
- | color: # | + | color: #3c2415; |
border:none; | border:none; | ||
+ | font-family:eurostile; | ||
} | } | ||
Line 517: | Line 630: | ||
position:relative; | position:relative; | ||
top:-1em; | top:-1em; | ||
- | color: # | + | color: #3c2415; |
font-style: italic; | font-style: italic; | ||
margin-bottom: -0.5em; | margin-bottom: -0.5em; | ||
Line 530: | Line 643: | ||
#content{ | #content{ | ||
border:none; | border:none; | ||
- | + | ||
padding:0; | padding:0; | ||
background:none; | background:none; | ||
Line 547: | Line 660: | ||
/* table of contents */ | /* table of contents */ | ||
#toc{ | #toc{ | ||
- | background-color: # | + | background-color: #FFFCD5; |
- | border: | + | border:solid; |
+ | border-color:#3C2415; | ||
+ | height:150px; | ||
width:100%; | width:100%; | ||
- | + | margin-top: 30px; | |
-moz-border-radius: 10px; | -moz-border-radius: 10px; | ||
border-radius: 10px; | border-radius: 10px; | ||
+ | border-width: 1px; | ||
} | } | ||
/*timeline stuff*/ | /*timeline stuff*/ | ||
Line 586: | Line 702: | ||
height: 3px; | height: 3px; | ||
width: 100%; | width: 100%; | ||
- | background-color: # | + | background-color: #39b54a; |
margin-top: -1em; | margin-top: -1em; | ||
margin-bottom: 1em; | margin-bottom: 1em; | ||
} | } | ||
- | # | + | #manual { |
position: relative; | position: relative; | ||
- | top: | + | top: 2500px; |
+ | right:-50px; | ||
+ | } | ||
+ | |||
+ | #waste { | ||
+ | position: relative; | ||
+ | top: 500px; | ||
+ | right:-20px; | ||
+ | } | ||
+ | |||
+ | #labelledflask { | ||
+ | position: relative; | ||
+ | top: 800px; | ||
+ | left:-30px; | ||
+ | } | ||
+ | |||
+ | #part1 { | ||
+ | position: relative; | ||
+ | top:50px; | ||
+ | left:-20px; | ||
+ | } | ||
+ | |||
+ | #part2 { | ||
+ | position: relative; | ||
+ | top:50px; | ||
+ | right:-20px; | ||
+ | } | ||
+ | |||
+ | div.submenu { | ||
+ | position: absolute; | ||
+ | top: 175px; | ||
+ | left: 50px; | ||
+ | } | ||
+ | |||
+ | a.submenu { | ||
+ | float: left; | ||
+ | text-align: center; | ||
+ | border-style: solid; | ||
+ | border-radius: 10px; | ||
+ | border-width: 2px; | ||
+ | border-color: #000000; | ||
+ | background-color: #5BB567; | ||
+ | width: 200px; | ||
+ | padding:20px; | ||
+ | margin: 8px; | ||
+ | text-decoration: none; | ||
+ | color: #000000; | ||
+ | font-size: 16px; | ||
+ | } | ||
+ | |||
+ | a.submenu:hover { | ||
+ | background-color: #FFFCD5; | ||
} | } |
Latest revision as of 23:57, 24 August 2011
/* NOTE This is an edited version of the MediaWiki 'monobook' style sheet
* edited by Team Alberta 2010 for their wiki */
div#test{
background-color:red;
width:100px; height:100px; }
div#preload { display: none; }
/* things we want to hide */
- info-box1 h2 .editsection, #info-box2 h2 .editsection, #info-box3 h2 .editsection, #info-box4 h2 .editsection{
display:none; } h1.firstHeading { display:none; }
- p-logo{
display:none;
}
/* rearrange the topsection bar */
- top-section{
height:0;
}
- menubar{
top:0;
}
- search-controls{
top:4px; left:547px; width:0;
}
- searchInput{
border:1px solid white; position:absolute;
}
- searchGoButton{
display:none;
}
- mw-searchButton{
background-color:#3C2415; border:1px solid white; color:transparent; height:19px; left:124px; position:absolute; top:-1px; width:24px; cursor:pointer; background-image:url(""); background-position:center center; background-repeat:no-repeat;
}
- catlinks{
display:none; }
/******** things we added ****************/
- tour-link{
-moz-border-radius:10px 10px 10px 10px; -webkit-border-radius:10px 10px 10px 10px; background-color:#FFFCD5; position: absolute; bottom: 0px; left: 0px; padding:28px; width: 89%; text-align:center; z-index: 10;
}
- tour-link:hover{
background-color:#403B9D; cursor: pointer;
}
- tour-link p {
margin: 0; color:#FFFFFF; font-weight:bold; font-size:30px;
}
div#igem-logo-link{
background-color:transparent; background-image:url(""); height:77px; margin:0; position:absolute; width:100px; left:870px; top:33px;
}
div#igem-logo-link a{
color:transparent; display:block; height:77px; width:100px;
}
- second-nav{
background-color:#F7941E; position:absolute; top:155px; left:150px; height:28px; font-size:11px; }
- second-nav ul {
list-style:none; /* list-style-type:none;*/
margin:0; padding:0; /*overflow:hidden;*/ /* for IE */
filter:alpha(opacity=96); /* CSS3 standard */ opacity:0.96;
}
- second-nav ul li{
border-style: solid; border-color: #000; border-width: 1px;
float:left; position:relative;
}
- second-nav ul li a:visited,#second-nav ul li a:link{
display:block; width:150px; height:28px; color:#FFFFFF; background-color:#F7941E; text-align:center;
}
- second-nav ul li a:hover,#second-nav ul li a.selected {
background-color:#3C2415; text-decoration:none; //left:auto;
}
- second-nav li.headlink ul{
display:none;
list-style:none; background-color:#3C2415;
text-align:center; padding:6px,0px; position:absolute;
}
- second-nav li.headlink ul li{
float:center;
}
- top-strip{
/* background-color:#FFFCD5; */ clear:both; display:block; /* height:200px;*/ position:absolute; top:30px; width:900px;
}
- top-strip h2{
color:#000000; display:inline; font-size:70px; font-weight:bold; left:200px; line-height:79px; position:relative; top:32px;
}
/*** position the genomikon logo ***/
- top-strip a img{
position:absolute; top:38px; left:0; width:auto; height:79px;
}
/*** navbar styling **/
- navbar {
width:1050px;
position:absolute; top:16px;
left:-25px; font-size:11px; }
- navbar ul {
list-style:none; /* list-style-type:none;*/
margin:0; padding:0; /*overflow:hidden;*/ /* for IE */
filter:alpha(opacity=96); /* CSS3 standard */ opacity:0.96;
}
- navbar ul li{
float:left; position:relative;
}
- navbar ul li a:visited,#navbar ul li a:link{
display:block; width:150px; height:28px; color:#FFFFFF; background-color:#F7941E; text-align:center;
}
- navbar ul li a:hover,#navbar ul li a.selected {
background-color:#3C2415; text-decoration:none; left:auto;
}
- navbar li.headlink ul{
display:none;
list-style:none; background-color:#3C2415;
text-align:center; padding:6px,0px; position:absolute;
}
- navbar li.headlink ul li{
float:center;
}
/*
div#navbar {
width: 900px;
}
- navbar {
position:absolute; top:20px;
}
- navbar ul {
list-style:none; width:100%;
}
- navbar ul li{
float:left; position:relative;
}
- navbar ul li a:visited,#navbar ul li a:link{
margin-right:30px; color:#fff;
}
- navbar ul li a:hover,#navbar ul li a.selected {
text-decoration: underline; font-weight: bold; color:#3C2415; text-decoration:none;
}
- navbar li.headlink ul{
display:table; display:none; background-color:#F7941E; text-align:left; padding:10px; z-index:20; position:absolute; left:-10px; width:100%;
}
- navbar li.headlink ul li{
float:center;
}
- /
/* make a content area in center and a sidebar on each side*/
- left-sidebar, #right-sidebar, #center-content, #wide-content{
float:left; /* leave space for header */ margin-top:160px; min-height:1em;
}
- left-sidebar.not-top, #right-sidebar.not-top, #center-content.not-top, #wide-content.not-top{
margin-top:0;
}
- center-content{
width:550px;
}
/*The centre content for the Timeline needs to be a bit wider*/
- center-content .timeline{
width:800px; float:none;
}
- wide-content{
width:1075px;
}
- left-sidebar, #right-sidebar{
margin-top:160px; width:198px;
} /*Need Timeline to start at left*/
- left-sidebar .Timeline{
width:0px;
}
- left-sidebar{
margin-right:20px;
}
- right-sidebar{
border:none; margin-left:20px;
}
- tourbar-back{
clear:both; height: 3px; width: 100%; background-color: #EEEEEE;
} /* the tourbar */
- tourbar{
clear:both; height:5em; margin:173px auto 4em; width:788px;
}
- tourbar a{
background:none repeat scroll 0 0 #CCCCCC; color:black; display:block; float:left; height:1em; padding:3em 0; text-align:center; vertical-align:middle; font-weight: bold; width:100px; margin-right:5px; margin-left:5px; -moz-border-radius: 10px; border-radius: 10px;
}
- tourbar a:hover{
text-decoration: none; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;
}
- tourbar a.selected{
margin-top:1em;
}
- tourbar a.left{
background-color:white; background-image:url("/wiki/images/d/da/Team-alberta-left-arrow.png"); background-repeat:no-repeat; width:54px;
}
- tourbar a.right{
background-color:white; background-image:url("/wiki/images/6/6f/Team-alberta-right-arrow.png"); background-repeat:no-repeat; width:54px;
} /* the info boxes on homepage */
- main-info-box,#info-box1,#info-box2,#info-box3,#info-box4{
height:250px; padding:18px; z-index:-1; float:left;
}
- info-box1 ol,#info-box2 ol,#info-box3 ol,#info-box4 ol {
margin-left: 1em;
}
- main-info-box {
width:550px; overflow:hidden; padding:0; height:286px; position: relative; z-index: 10;
}
- tinted-info-box {
width:100% overflow:hidden; padding:10px; height:286px; clear:both; background-color: #00F2BC;
}
- left-gray-box {
width:100%; padding-left: 10px; background-color: #e6e6e6;
}
- info-box1,#info-box2,#info-box3,#info-box4 {
background-color:#00CDD0; color:#FFFCD5; overflow:hidden; width:228px; margin-top: 18px; cursor: pointer; -moz-border-radius: 10px; border-radius: 10px;
}
- info-box1 h2,#info-box2 h2,#info-box3 h2,#info-box4 h2{
color:#FFFCD5; text-align:center; text-transform:uppercase;
}
- info-box1 p,#info-box2 p,#info-box3 p,#info-box4 p{
color:#000
} .right-info-box{ } .center-info-box{
float:left;
} /* software */
- tourbar a.software{
background-color:#B5FFEE;
}
- info-box1{
margin-top:0; /* background-color:#00cdd0;*/ background-color:#B5FFEE; margin-left:12px;
}
- info-box1:hover {
background-color: #93DDB4
}
/* kit box */
- tourbar a.kit {
background-color:#b8fed1;
}
- info-box2{
/*background-color: # b8fed1;*/ background-color:#D6FFE2;
}
- info-box2:hover {
/*background-color:#9AC2FD;*/ background-color:#A6FFC0;
}
/* achievments boxes*/
- tourbar a.achievements{
background-color:#B4FFC9;
}
- info-box3{
/* background-color:# 7 3FF9A;*/ background-color:#B4FFC9; margin-left:17px;
}
- info-box3:hover {
background-color:#93DDb8;
}
/* biobytes boxes */
- tourbar a.biobytes{
background-color:#BCD7FF;
}
- info-box4 {
/* background-color:#00F2BC;*/ background-color:#BCD7FF; margin-left:18px;
}
- info-box4:hover {
/* background-color:#33f5f6;*/ background-color:#9AC2FD;
}
/* parts table */
- mytable
{
width: 100%; padding: 0; margin: 0;
}
- mytable th
{
background-color:#FFFCD5; color:#fff; padding:6px 6px 6px 12px; text-align:left;
}
- mytable td
{
background: #ccc; padding: 0.3em 0.3em 0.3em 0.7em; color: #FFFCD5;
}
- mytable td.alt
{
background: #ffffff; color: #FFFCD5;
}
- mytable th.spec
{
background: #a5a5a5 no-repeat; font: bold 1em "Trebuchet MS", Times; color: #ffffff;
}
- mytable th.specalt
{
background: #ffffff no-repeat; font: bold 1em "Trebuchet MS", Times; color: #656565;
}
- mytable a:visited, #mytable a:link, #mytable a:hover{
color:#FFFCD5; text-decoration:underline;
}
- mytable a:hover {
color:#00F2BC;
}
/********* things we changed ***********/
- toctitle, span.tocnumber {
display:none;
} .toclevel-1{
margin-bottom:1em;
} .toclevel-2{
display:none;
} span.toctext {
color: #3C2415; font-size:14px; line-height:14px;
}
- footer-box{
background-color:#E6E6E6; border:none; margin:100px auto 0; padding:5px; width:965px;
}
body {
background-color:#F7941E; background-image:url(""); background-repeat:repeat-x; font-family:corbel; text-align:justify;
}
- thanks-footer{
position: relative; width: 1032px; left: 0px; clear:both; background-color: #DDDDDD; top: 12px; border-radius: 10px; -moz-border-radius: 10px; text-align: center;
}
/* new colors */
h1, h2, h3, h4, h5, h6 {
color: #3c2415; border:none;
font-family:eurostile; }
h2 {
line-height:125%;
}
h3{
font-size:100%; font-weight:normal; position:relative; top:-1em; color: #3c2415; font-style: italic; margin-bottom: -0.5em;
}
span.editsection, span.editsection a{
color:#ccc;
} body{
background-color:#fff;
}
- content{
border:none;
padding:0;
background:none;
}
- menubar li a, #menubar .selected a, #menubar li a:visited{
color: #888;
}
- menubar li a:hover{
color: #00F2BC;
}
/* table of contents */
- toc{
background-color: #FFFCD5; border:solid;
border-color:#3C2415; height:150px;
width:100%; margin-top: 30px; -moz-border-radius: 10px; border-radius: 10px; border-width: 1px;
} /*timeline stuff*/
/*months and their overlaying divs*/
- May{
background-color: Orange;
height: 500px; width: 780 px;
}
ul.rolodex{
list-style-type: none; list-style-image: none;
}
ul.rolodex li{
color: #FFFCD5;
} ul.rolodex li:hover {
color: #00F2BC; cursor: pointer;
}
.startimage:hover {
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;
} div#horiz-line {
height: 3px; width: 100%; background-color: #39b54a; margin-top: -1em; margin-bottom: 1em;
}
- manual {
position: relative; top: 2500px;
right:-50px; }
- waste {
position: relative; top: 500px;
right:-20px; }
- labelledflask {
position: relative; top: 800px;
left:-30px; }
- part1 {
position: relative;
top:50px; left:-20px; }
- part2 {
position: relative;
top:50px; right:-20px; }
div.submenu {
position: absolute; top: 175px; left: 50px;
}
a.submenu {
float: left; text-align: center; border-style: solid; border-radius: 10px; border-width: 2px; border-color: #000000; background-color: #5BB567; width: 200px; padding:20px; margin: 8px; text-decoration: none; color: #000000; font-size: 16px;
}
a.submenu:hover {
background-color: #FFFCD5;
}