Guest User

Untitled

a guest
Oct 25th, 2013
42
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. body {
  2.     background: #5fadd3;
  3. }
  4.  
  5. .weather {
  6.     background-color: #1c77ec;
  7.     background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1c77ec), to(#7deaff));
  8.     background-image: -moz-linear-gradient(top, #1c77ec, #7deaff);
  9.     background-image: -ms-linear-gradient(top, #1c77ec, #7deaff);
  10.     border-radius: 20px;
  11.     width: 100px;
  12.     height: 100px;
  13.     display: inline-block;
  14. }
  15.  
  16. .weather:hover {
  17.     animation: jiggle 0.2s infinite;
  18.     -webkit-animation: jiggle 0.2s infinite;
  19.     -moz-animation-duration: 0.2s;
  20.     -moz-animation-name: jiggle;
  21.     -moz-animation-iteration-count: infinite;
  22.     -webkit-transform: rotate(-1deg);
  23.     -moz-transform: rotate(-1deg);
  24. }
  25.  
  26. .sun {
  27.     background-color: #fada0b;
  28.     border-radius: 100%;
  29.     width: 40px;
  30.     height: 40px;
  31.     top: 20px;
  32.     left: 15px;
  33.     position: relative;
  34. }
  35.  
  36. .cloud-main {
  37.     opacity: 0.9;
  38.     background: #fff;
  39.     width: 65px;
  40.     height: 25px;
  41.     border-radius: 20px;
  42.     position: relative;
  43.     left: 25px;
  44.     top: 10px;
  45. }
  46.  
  47. .cloud-bubble-one {
  48.     opacity: 1.0;
  49.     background: #fff;
  50.     width: 35px;
  51.     height: 35px;
  52.     position: relative;
  53.     border-radius: 100%;
  54.     left: 10px;
  55.     top: -15px;
  56. }
  57.  
  58. .cloud-bubble-two {
  59.     opacity: 1.0;
  60.     background: #fff;
  61.     width: 30px;
  62.     height: 25px;
  63.     position: relative;
  64.     border-top-right-radius: 20px;
  65.     border-bottom-right-radius: 10px;
  66.     left: 35px;
  67.     top: -40px;
  68. }
  69.  
  70. .notes {
  71.     background: #fed32c;
  72.     border-radius: 20px;
  73.     width: 100px;
  74.     height: 100px;
  75.     display: inline-block;
  76. }
  77.  
  78. .notes:hover {
  79.     animation: jiggle 0.2s infinite;
  80.     -webkit-animation: jiggle 0.2s infinite;
  81.     -moz-animation-duration: 0.2s;
  82.     -moz-animation-name: jiggle;
  83.     -moz-animation-iteration-count: infinite;
  84.     -webkit-transform: rotate(-1deg);
  85.     -moz-transform: rotate(-1deg);
  86. }
  87.  
  88. .note {
  89.     background: #fff;
  90.     height: 70px;
  91.     width: 100px;
  92.     border-bottom-right-radius: 20px;
  93.     border-bottom-left-radius: 20px;
  94.     position: relative;
  95.     top: 30px;
  96.     border-top: 3px solid #b9a046;
  97.     box-sizing:border-box;
  98.     -moz-box-sizing:border-box; /* Firefox */
  99. }
  100.  
  101. .dotted-line {
  102.     width: 100%;
  103.     height: 3px;
  104.     border-bottom: 3px dotted #acaead;
  105.     position: relative;
  106. }
  107.  
  108. .line {
  109.     width: 100%;
  110.     border-bottom: 2px solid #acaead;
  111.     position: relative;
  112.     height: 2px;
  113.     padding-top: 15px;
  114. }
  115.  
  116. .line-last {
  117.     width: 90px;
  118.     border-bottom: 2px solid #acaead;
  119.     position: relative;
  120.     height: 2px;
  121.     padding-top: 15px;
  122.     left: 5px;
  123.     border-radius: 3px;
  124. }
  125.  
  126. @keyframes jiggle {
  127.     0% {
  128.         transform: rotate(-1deg);
  129.     }
  130.     50% {
  131.         transform: rotate(1deg);
  132.     }
  133. }
  134.  
  135. @-webkit-keyframes jiggle {
  136.     0% {
  137.         -webkit-transform: rotate(-1deg);
  138.     }
  139.     50% {
  140.         -webkit-transform: rotate(1deg);
  141.     }
  142. }
  143.  
  144. @-moz-keyframes jiggle {
  145.     0% {
  146.         -moz-transform: rotate(-1deg);
  147.     }
  148.     50% {
  149.         -moz-transform: rotate(1deg);
  150.     }
  151. }
RAW Paste Data