Pastebin launched a little side project called VERYVIRAL.com, check it out ;-) Want more features on Pastebin? Sign Up, it's FREE!
Guest

Untitled

By: a guest on Sep 22nd, 2012  |  syntax: CSS  |  size: 2.90 KB  |  views: 132  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. /* --- Overall card layout --- */
  2.   .card
  3.   {
  4.     position: fixed;
  5.     background-color: #8c8c95;
  6.     height: 100%;
  7.     margin: 0;
  8.     padding: 0;
  9.   }
  10.  
  11.   #tableContainer
  12.   {
  13.     display: table;
  14.     height: 100%;
  15.     width: 100%;
  16.     margin: auto;
  17.     background-size:cover;
  18.     background-repeat:no-repeat;
  19.     background-position: 50% 50%;
  20.   }
  21.  
  22.   #cardContainer
  23.   {
  24.     font-size: 1em;
  25.     display: table-cell;
  26.     vertical-align: middle;
  27.   }
  28.  
  29.   #contentContainer
  30.   {
  31.     margin-left: 6%;
  32.     margin-right: 6%;
  33.     text-align: center;
  34.     padding: 1em .4em 1em .4em;
  35.     border-radius: .4em;
  36.     background-color: rgba(0, 0, 0, .65);
  37.   }
  38.  
  39.   @media screen and (orientation:landscape)
  40.   {
  41.     .mobile #contentContainer
  42.     {
  43.       margin-left: 2%;
  44.       margin-right: 2%;
  45.     }
  46.   }
  47.  
  48.   @media screen and (orientation:portrait)
  49.   {
  50.     .mobile #contentContainer
  51.     {
  52.       margin-left: 0%;
  53.       margin-right: 0%;
  54.       padding: .7em 0;
  55.     }
  56.   }
  57. /* --- --- ---*/
  58.  
  59. /* --- Outer question box --- */
  60.   #expression
  61.   {
  62.     font-size: 2em;
  63.     color: #ed9;
  64.     font-family: VL PGothic;
  65.   }
  66.  
  67.   /* Remove bold style and use a colour instead */
  68.   #expression b
  69.   {
  70.     font-weight: normal;
  71.     color: #f0b570;
  72.   }
  73.   /* Inlined English in cloze */
  74.   .englishTranslateCard #expression b
  75.   {
  76.     font-size:.9em;
  77.   }
  78.  
  79.   #sentenceEnglish
  80.   {
  81.     display: inline-block;
  82.     font-size: 1.1em;
  83.     margin-top: 10px;
  84.     margin-top: .4em;
  85.     color: #dfb;
  86.   }
  87.  
  88.   .question #sentenceEnglish
  89.   {
  90.     color: #000;
  91.     background-color: #000;
  92.   }
  93.  
  94.   /* English sentence hint on hover for English Translate cards */
  95.   .englishTranslateCard #sentenceEnglish:hover,
  96.   .englishTranslateCard.answer #sentenceEnglish
  97.   {
  98.     color: #dfb;
  99.     background-color: #000;
  100.   }
  101.  
  102.     /*Things to hide in the question. */
  103.   .question #vocabContainer,                    /* no answer box */
  104.   .question ruby rt,                            /* no furigana */
  105.   .readingCard.question #sentenceEnglish        /* no answer! */
  106.   {
  107.     visibility: hidden;
  108.   }
  109. /* --- --- --- */
  110.  
  111. /* --- Inner answer box --- */
  112.   #vocabContainer
  113.   {
  114.     position: relative;
  115.     border-radius: .4em;
  116.     background-color: rgba(0, 0, 0, .35);
  117.     padding: .4em;
  118.     top: .4em;
  119.     margin-left: 15%;
  120.     margin-right: 15%;
  121.   }
  122.  
  123.   #vocabFurigana
  124.   {
  125.     font-stretch: wider;
  126.     font-size: 2.2em;
  127.     color: #f90;
  128.     font-family: VL PGothic;
  129.   }
  130.  
  131.   .englishTranslateCard #vocabFurigana
  132.   {
  133.     font-size:2.6em;
  134.   }
  135.  
  136.   #vocabEnglish
  137.   {
  138.     color: #ed9;
  139.     font-size: 1.1em;
  140.   }
  141. /* --- --- --- */
  142.  
  143. /* --- Audio images for ankidroid --- */
  144.   #sentenceAudio
  145.   {
  146.     position: absolute;
  147.     bottom: 0.2em;
  148.     left: -3em;
  149.   }
  150.   #sentenceAudio img
  151.   {
  152.     width: 50%;
  153.   }
  154.  
  155.   #vocabAudio
  156.   {
  157.     position: absolute;
  158.     bottom: 0.2em;
  159.     right: -3em;
  160.   }
  161.   #vocabAudio img
  162.   {
  163.     width: 50%;
  164.   }
  165. /* --- --- --- */
clone this paste RAW Paste Data