264e6dec8b1310821f77068a707e6778ec2abe62
[scpubgit/stemmatology.git] / stemmaweb / root / css / style.css
1 /* General site-wide layout */
2 body { 
3     margin: 0; 
4     padding: 20px; 
5     font: 1em Arial, Helvetica, sans-serif; 
6     font-size: 85%; 
7     color: #666;
8 }
9 h1 {
10     border-bottom: 1px solid #488dd2;
11     color: #488dd2;
12     font-size: 24px;
13     font-weight: 100;
14     margin: 0 0 17px;
15     padding: 0;
16     width: 650px;
17 }
18 h2 {
19     margin-top: 10px;
20     color: #488dd2;
21     font-size: 18px;
22
23 h3 {
24         color: #488dd2;
25         font-size: 14px;
26         font-style: italic;
27 }
28
29 div.button {
30   background: transparent url('../images/b_button_a.png') no-repeat scroll top right;
31   color: #fff;
32   display: block;
33   float: left;
34   font: normal 12px Times, Times New Roman, Serif; /* arial, sans-serif; */
35   height: 24px;
36   margin-right: 6px;
37   padding-right: 18px; /* sliding doors padding */
38   text-decoration: none;
39 }
40 div.button.reset {
41   background: transparent url('../images/c_button_a.png') no-repeat scroll top right;
42 }
43 div.button span {
44   background: transparent url('../images/b_button_span.png') no-repeat;
45   display: block;
46   line-height: 14px;
47   padding: 5px 0 5px 18px;
48 }
49 div.button.reset span {
50   background: transparent url('../images/c_button_span.png') no-repeat;
51 }
52 div.button:hover {
53   background-position: bottom right;
54   color: #444;
55   outline: none; /* hide dotted outline in Firefox */
56 }
57 div.button:hover span {
58   background-position: bottom left;
59 }
60
61
62 /* Index page components */
63
64 #directory_container {
65         float: left;
66         width: 300px;
67         height: 450px;
68         border: 1px #c6dcf1 solid;
69 }
70 #directory {
71         margin-left: 10px;
72 }
73 .traditionname {
74         text-decoration: underline;
75 }
76 .selected {
77         font-style: italic;
78 }
79 .mainnav {
80         position: absolute;
81         top: 10px;
82         right: 80px;
83         font-size: 14px;
84         font-weight: 100;
85         color: #488dd2;
86 }
87 .mainnav a {
88         color: #488dd2;
89 }
90 #variant_container {
91         clear: both;
92         height: 400px;
93         padding-top: 20px;
94 }
95 #variant_graph {
96         /* width: 900px; */
97         height: 350px;
98         clear: both;
99         overflow: auto; 
100         text-align: center;
101 }
102 #variant_graph img {
103         margin-top: expression(( 400 - this.height ) / 2);
104 }
105 #stemma_container {
106         float: left;
107         height: 450px;
108         margin-left: 40px;
109 }
110 #stemma_container h2 h3 {
111         color: #666;
112 }
113 #stemma_graph {
114     height: 375px;
115     width: 500px;
116     text-align: center;
117     border: 1px #c6dcf1 solid;
118 }
119 #stemma_graph img {
120         margin-top: expression(( 450 - this.height ) / 2);
121 }
122 #stexaminer_button {
123         bottom: 0;
124         margin-top: 5px;
125 }
126 #relater_button {
127         float: left;
128         margin-left: 83px;
129     margin-top:  7px;
130 }