openrat-cms

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README

docs.css (4103B)


      1 @font-face {
      2   font-family: 'Source Sans Pro';
      3   font-style: normal;
      4   font-weight: 400;
      5   src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url(//themes.googleusercontent.com/static/fonts/sourcesanspro/v5/ODelI1aHBYDBqgeIAH2zlBM0YzuT7MdOe03otPbuUS0.woff) format('woff');
      6 }
      7 
      8 body, html { margin: 0; padding: 0; height: 100%; }
      9 section, article { display: block; padding: 0; }
     10 
     11 body {
     12   background: #f8f8f8;
     13   font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
     14   line-height: 1.5;
     15 }
     16 
     17 p { margin-top: 0; }
     18 
     19 h2, h3, h1 {
     20   font-weight: normal;
     21   margin-bottom: .7em;
     22 }
     23 h1 { font-size: 140%; }
     24 h2 { font-size: 120%; }
     25 h3 { font-size: 110%; }
     26 article > h2:first-child, section:first-child > h2 { margin-top: 0; }
     27 
     28 #nav h1 {
     29   margin-right: 12px;
     30   margin-top: 0;
     31   margin-bottom: 2px;
     32   color: #d30707;
     33   letter-spacing: .5px;
     34 }
     35 
     36 a, a:visited, a:link, .quasilink {
     37   color: #A21313;
     38   text-decoration: none;
     39 }
     40 
     41 em {
     42   padding-right: 2px;
     43 }
     44 
     45 .quasilink {
     46   cursor: pointer;
     47 }
     48 
     49 article {
     50   max-width: 700px;
     51   margin: 0 0 0 160px;
     52   border-left: 2px solid #E30808;
     53   border-right: 1px solid #ddd;
     54   padding: 30px 50px 100px 50px;
     55   background: white;
     56   z-index: 2;
     57   position: relative;
     58   min-height: 100%;
     59   box-sizing: border-box;
     60   -moz-box-sizing: border-box;
     61 }
     62 
     63 #nav {
     64   position: fixed;
     65   padding-top: 30px;
     66   max-height: 100%;
     67   box-sizing: -moz-border-box;
     68   box-sizing: border-box;
     69   overflow-y: auto;
     70   left: 0; right: none;
     71   width: 160px;
     72   text-align: right;
     73   z-index: 1;
     74 }
     75 
     76 @media screen and (min-width: 1000px) {
     77   article {
     78     margin: 0 auto;
     79   }
     80   #nav {
     81     right: 50%;
     82     width: auto;
     83     border-right: 349px solid transparent;
     84   }
     85 }
     86 
     87 #nav ul {
     88   display: block;
     89   margin: 0; padding: 0;
     90   margin-bottom: 32px;
     91 }
     92 
     93 #nav li {
     94   display: block;
     95   margin-bottom: 4px;
     96 }
     97 
     98 #nav li ul {
     99   font-size: 80%;
    100   margin-bottom: 0;
    101   display: none;
    102 }
    103 
    104 #nav li.active ul {
    105   display: block;
    106 }
    107 
    108 #nav li li a {
    109   padding-right: 20px;
    110   display: inline-block;
    111 }
    112 
    113 #nav ul a {
    114   color: black;
    115   padding: 0 7px 1px 11px;
    116 }
    117 
    118 #nav ul a.active, #nav ul a:hover {
    119   border-bottom: 1px solid #E30808;
    120   margin-bottom: -1px;
    121   color: #E30808;
    122 }
    123 
    124 #logo {
    125   border: 0;
    126   margin-right: 12px;
    127   margin-bottom: 25px;
    128 }
    129 
    130 section {
    131   border-top: 1px solid #E30808;
    132   margin: 1.5em 0;
    133 }
    134 
    135 section.first {
    136   border: none;
    137   margin-top: 0;
    138 }
    139 
    140 #demo {
    141   position: relative;
    142 }
    143 
    144 #demolist {
    145   position: absolute;
    146   right: 5px;
    147   top: 5px;
    148   z-index: 25;
    149 }
    150 
    151 .yinyang {
    152   position: absolute;
    153   top: -10px;
    154   left: 0; right: 0;
    155   margin: auto;
    156   display: block;
    157   height: 120px;
    158 }
    159 
    160 .actions {
    161   margin: 1em 0 0;
    162   min-height: 100px;
    163   position: relative;
    164 }
    165 
    166 .actionspicture {
    167   pointer-events: none;
    168   position: absolute;
    169   height: 100px;
    170   top: 0; left: 0; right: 0;
    171 }
    172 
    173 .actionlink {
    174   pointer-events: auto;
    175   font-family: arial;
    176   font-size: 80%;
    177   font-weight: bold;
    178   position: absolute;
    179   top: 0; bottom: 0;
    180   line-height: 1;
    181   height: 1em;
    182   margin: auto;
    183 }
    184 
    185 .actionlink.download {
    186   color: white;
    187   right: 50%;
    188   margin-right: 13px;
    189   text-shadow: -1px 1px 3px #b00, -1px -1px 3px #b00, 1px 0px 3px #b00;
    190 }
    191 
    192 .actionlink.fund {
    193   color: #b00;
    194   left: 50%;
    195   margin-left: 15px;
    196 }
    197 
    198 .actionlink:hover {
    199   text-decoration: underline;
    200 }
    201 
    202 .actionlink a {
    203   color: inherit;
    204 }
    205 
    206 .actionsleft {
    207   float: left;
    208 }
    209 
    210 .actionsright {
    211   float: right;
    212   text-align: right;
    213 }
    214 
    215 @media screen and (max-width: 800px) {
    216   .actions {
    217     padding-top: 120px;
    218   }
    219   .actionsleft, .actionsright {
    220     float: none;
    221     text-align: left;
    222     margin-bottom: 1em;
    223   }
    224 }
    225 
    226 th {
    227   text-decoration: underline;
    228   font-weight: normal;
    229   text-align: left;
    230 }
    231 
    232 #features ul {
    233   list-style: none;
    234   margin: 0 0 1em;
    235   padding: 0 0 0 1.2em;
    236 }
    237 
    238 #features li:before {
    239   content: "-";
    240   width: 1em;
    241   display: inline-block;
    242   padding: 0;
    243   margin: 0;
    244   margin-left: -1em;
    245 }
    246 
    247 .rel {
    248   margin-bottom: 0;
    249 }
    250 .rel-note {
    251   margin-top: 0;
    252   color: #555;
    253 }
    254 
    255 pre {
    256   padding-left: 15px;
    257   border-left: 2px solid #ddd;
    258 }
    259 
    260 code {
    261   padding: 0 2px;
    262 }
    263 
    264 strong {
    265   text-decoration: underline;
    266   font-weight: normal;
    267 }
    268 
    269 .field {
    270   border: 1px solid #A21313;
    271 }