CSS/gifu/home

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html>
+
/* A Free Design by Bryant Smith (bryantsmith.com) */
-
<head>
+
-
<meta http-equiv="Content-Script-Type" content="text/javascript">
+
-
<meta http-equiv="Content-Script-Type" content="text/css">
+
-
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript">
+
-
</script>
+
-
////// test
 
-
//// test
 
 +
body {
 +
margin: 0;
 +
padding: 0;
 +
text-align: left;
 +
font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif;
 +
font-size: 13px;
 +
color: #000000;
 +
background: #000000 url(background.png);
 +
background-repeat:repeat-x;
 +
}
 +
*
 +
{
 +
  margin: 0 auto 0 auto;
 +
text-align:left;}
 +
#page
 +
{
 +
  display: block;
 +
  height:auto;
 +
  position: relative;
 +
  overflow: hidden;
 +
  width: 670px;
 +
}
-
<style type="text/css">
+
.topNaviagationLink
 +
{
 +
text-align:center;
 +
position:relative;
 +
margin-top:30px;
 +
font-size:16px;
 +
margin-left:-10px;
 +
width:121px;
 +
height: 35px;
 +
line-height: 35px;
 +
float:left;
 +
color:#000000;
 +
font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif;
 +
}
-
/*#home{background:url(https://static.igem.org/mediawiki/2014/f/f6/Circular_rna.png) fixed;
+
 
-
width:;
+
.topNaviagationLink a
-
background-position:center 80%;
+
{
-
background-repeat:no-repeat;
+
text-decoration:none;
 +
color:#000000;
 +
margin-bottom:0px;
}
}
-
*/
 
-
#base{
+
.topNaviagationLink a:hover
-
  position:relative;
+
{
-
  top:130px;
+
text-align:center;
-
  margin-left:auto;
+
color:#FFFFFF;
-
  margin-right:auto;  
+
display: block;
-
  width:500px;  
+
width:121px;
-
  z-index:100;
+
height: 35px;
 +
line-height: 35px;
 +
background-image:url(tab.png);
 +
border-bottom:none;
}
}
-
#point{
+
#mainPicture
-
  position:absolute;
+
{
-
  top:200px;
+
clear:both;
-
  left:600px;
+
width:670px;
-
  transform: rotate(0 deg);
+
height:345px;
-
  z-index:1000;
+
background-color:#000000;
-
  }
+
}
-
#menu1 {
+
#mainPicture .picture
-
  position:absolute;
+
{
-
  top:10px;
+
position:relative;
-
  left:170px;
+
width:650px;
-
  width:100px;
+
height:325px;
-
  z-index:10000;
+
top:10px;
-
}
+
margin-left:10px;
 +
background-image:url(mainImage.jpg);
 +
background-repeat:no-repeat;
 +
}
-
#menu2 {
+
#headerTitle
-
  display:inline;
+
{
 +
position:relative;
 +
top:14px;
 +
left:22px;
 +
font-size:27px;
 +
color:#000000;
 +
font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif;
}
}
 +
#headerSubtext
 +
{
 +
position:relative;
 +
top:12px;
 +
left:22px;
 +
font-size:14px;
 +
color:#484848;
 +
font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif;
 +
}
-
.tabs {
+
.contentBox
-
    position: relative;
+
{
-
    padding: 0;
+
margin-top:10px;
-
  margin-left:auto;  
+
width:670px;
-
    margin-right:auto;
+
height:auto;
 +
background-color:#000000;
 +
}
 +
.contentBox .innerBox
 +
{
 +
position:relative;
 +
 +
width:650px;
 +
height:auto;
 +
top:10px;
 +
margin-left:10px;
 +
background-image:url(contentBack.png);
 +
background-color:#FFFFFF;
 +
background-repeat:repeat-x;
}
}
-
.tabs li {
+
 
-
    list-style: none;
+
h1
-
    display: inline-block;
+
{
 +
font-size:25px;
 +
margin-bottom:10px;
 +
padding-top:18px;
 +
margin-left:15px;
 +
margin-top:15px;
 +
color:#1F1603;
}
}
-
.tabs input[type=radio] {
+
 
-
    display: none;
+
.contentText
 +
{
 +
font-size:13px;
 +
line-height:24px;
 +
margin-left:13px;
 +
margin-right:13px;
}
}
-
.tabs label {
+
 
-
    display: block;
+
h4 {
-
    cursor: pointer;
+
text-align:center;
-
    padding: 5px;
+
padding-top:30px;
-
    line-height: 20px;
+
font-size:9px;
-
    background-color: #dcdcdc;
+
font-family:Arial, Helvetica, sans-serif;
-
    color: #000000;
+
color:#000000;
-
margin:0;
+
margin:0px;
}
}
-
.tabs label:hover {
+
 
-
    background-color: #e0ffff;
+
h4
-
    color: #000000;
+
{
 +
text-decoration:none;
 +
font-size:9px;
}
}
-
.tabs input[type=radio]:checked + label {
+
 
-
    background-color: #afeeee;
+
a
-
    color: #000000;
+
{
 +
color:#484848;
 +
border-bottom:dotted 1px;
}
}
-
.tabs .contents {
+
 
-
    display: none;
+
a:hover
-
    position: absolute;
+
{
-
    top:30px;
+
color:#000000;
-
    left: 0;
+
text-decoration:none;
-
    padding: 0px;
+
border-bottom:dotted 2px;
-
    background: #f0f8ff;
+
}
}
-
.tabs input[type=radio]:checked + label + .contents{
+
a:visited
-
    display: block;
+
{
 +
color:#000000;
 +
 
}
}
-
</style>
 
-
</style>
 
-
</head>
 
 +
blockquote {
 +
font-size:12px;
 +
text-align:justify;
 +
width:400px;
 +
color:#000000;
 +
padding:15px;
 +
margin:10px;
 +
font-family:Arial, Helvetica, sans-serif;
 +
background-image:url(blockquote.png);
 +
background-repeat:no-repeat;
 +
border:dashed 1px;
 +
border-color:#484848;
 +
}
-
</html>
+
html, body {
 +
text-align: center;
 +
}
 +
p {text-align: left;}

Revision as of 15:28, 1 September 2014

/* A Free Design by Bryant Smith (bryantsmith.com) */





body { margin: 0; padding: 0; text-align: left; font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif; font-size: 13px; color: #000000; background: #000000 url(background.png); background-repeat:repeat-x; }

{ 

 margin: 0 auto 0 auto;
text-align:left;}
  1. page

{ 

 display: block; 
 height:auto;
 position: relative; 
 overflow: hidden; 
 width: 670px;

}

.topNaviagationLink { text-align:center; position:relative; margin-top:30px; font-size:16px; margin-left:-10px; width:121px; height: 35px; line-height: 35px; float:left; color:#000000; font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif; }


.topNaviagationLink a { text-decoration:none; color:#000000; margin-bottom:0px; }

.topNaviagationLink a:hover { text-align:center; color:#FFFFFF; display: block; width:121px; height: 35px; line-height: 35px; background-image:url(tab.png); border-bottom:none; }

  1. mainPicture

{ clear:both; width:670px; height:345px; background-color:#000000; }

  1. mainPicture .picture

{ position:relative; width:650px; height:325px; top:10px; margin-left:10px; background-image:url(mainImage.jpg); background-repeat:no-repeat; }

  1. headerTitle

{ position:relative; top:14px; left:22px; font-size:27px; color:#000000; font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif; }

  1. headerSubtext

{ position:relative; top:12px; left:22px; font-size:14px; color:#484848; font-family:"Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif; }

.contentBox { margin-top:10px; width:670px; height:auto; background-color:#000000; }

.contentBox .innerBox { position:relative;

width:650px; height:auto; top:10px; margin-left:10px; background-image:url(contentBack.png); background-color:#FFFFFF; background-repeat:repeat-x; }

h1 { font-size:25px; margin-bottom:10px; padding-top:18px; margin-left:15px; margin-top:15px; color:#1F1603; }

.contentText { font-size:13px; line-height:24px; margin-left:13px; margin-right:13px; }

h4 { text-align:center; padding-top:30px; font-size:9px; font-family:Arial, Helvetica, sans-serif; color:#000000; margin:0px; }

h4 { text-decoration:none; font-size:9px; }

a { color:#484848; border-bottom:dotted 1px; }

a:hover { color:#000000; text-decoration:none; border-bottom:dotted 2px; } a:visited { color:#000000;

}


blockquote { font-size:12px; text-align:justify; width:400px; color:#000000; padding:15px; margin:10px; font-family:Arial, Helvetica, sans-serif; background-image:url(blockquote.png); background-repeat:no-repeat; border:dashed 1px; border-color:#484848; }

html, body { text-align: center; } p {text-align: left;}

Retrieved from "http://2014.igem.org/CSS/gifu/home"