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 #topbanner {
  62         width: 100%;
  63         height: 100px;
  64         margin-top: 20px;
  65 }
  66 #bannerinfo {
  67         float: right;
  68         margin-right: 12%;
  69         margin-top: 15px;
  70 }
  71 .navlink {
  72         color: #488dd2;
  73         text-decoration: underline;
  74 }
  75
  76
  77
  78 /* Index page components */
  79
  80 #directory_container {
  81         float: left;
  82         width: 300px;
  83         height: 450px;
  84         border: 1px #c6dcf1 solid;
  85 }
  86 #directory {
  87         margin-left: 10px;
  88 }
  89 .traditionname {
  90         text-decoration: underline;
  91 }
  92 .selected {
  93         font-style: italic;
  94 }
  95 .mainnav {
  96         position: absolute;
  97         top: 10px;
  98         right: 80px;
  99         font-size: 14px;
 100         font-weight: 100;
 101         color: #488dd2;
 102 }
 103 .mainnav a {
 104         color: #488dd2;
 105 }
 106 #variant_container {
 107         clear: both;
 108         height: 400px;
 109         padding-top: 20px;
 110 }
 111 #variant_graph {
 112         /* width: 900px; */
 113         height: 350px;
 114         clear: both;
 115         overflow: auto;
 116         text-align: center;
 117 }
 118 #variant_graph img {
 119         margin-top: expression(( 400 - this.height ) / 2);
 120 }
 121 #stemma_container {
 122         float: left;
 123         height: 450px;
 124         margin-left: 40px;
 125 }
 126 #stemma_container h2 h3 {
 127         color: #666;
 128 }
 129 #stemma_graph {
 130     height: 375px;
 131     width: 500px;
 132     text-align: center;
 133     border: 1px #c6dcf1 solid;
 134 }
 135 #stemma_graph img {
 136         margin-top: expression(( 450 - this.height ) / 2);
 137 }
 138 #stexaminer_button {
 139         bottom: 0;
 140         margin-top: 13px;
 141 }
 142 #relater_button {
 143         float: left;
 144     margin-left:  100px;
 145 }