Advertisement
RyanJEarnshaw

Untitled

Oct 11th, 2016
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.66 KB | None | 0 0
  1. @import 'https://fonts.googleapis.com/css?family=Raleway:100,200,300,400';
  2. @import url(http://fonts.googleapis.com/css?family=Roboto);
  3.  
  4. * {
  5. margin:0;
  6. padding:0;
  7. }
  8.  
  9. html, body {
  10. font-family: 'Raleway', sans-serif;
  11. margin:0;
  12. padding:0;
  13. height:auto;
  14. background-color: rgba(255,255,255,1);
  15. }
  16.  
  17. .container {
  18. min-height:100%;
  19. position:relative;
  20. background-color: rgba(255,255,255,1);
  21. }
  22.  
  23.  
  24.  
  25.  
  26. .title {
  27. font-family: 'roboto', sans-serif;
  28. text-align: center;
  29. color: rgba(1,1,1,0.2);
  30. margin: 4% 0;
  31. font-size: 5vmax;
  32. }
  33. .greeting {
  34. font-family: 'roboto', sans-serif;
  35. text-align: center;
  36. color: rgba(1,1,1,0.6);
  37. margin: 4% 0;
  38. font-size: 2vmax;
  39. }
  40. .information {
  41. display: flex;
  42. float: middle;
  43. text-align: center;
  44. vertical-align: center;
  45. width: 100%;
  46. height: auto;
  47. justify-content: center;
  48. }
  49. .cubiccont {
  50. margin: 1% 1%;
  51. float: left;
  52. height: 15vmax;
  53. width: 15%;
  54. border: 3px dotted rgba(1,1,1,0.3);
  55. }
  56. .cubiccont h3 {
  57. font-family: 'roboto', sans-serif;
  58. text-align: left;
  59. color: rgba(1,1,1,0.6);
  60. margin: 80% 3%;
  61. font-size: 1vmax;
  62. }
  63.  
  64.  
  65.  
  66. a {
  67. font-family: 'Roboto';
  68. text-decoration: none;
  69. margin: 1%;
  70. padding: 1%;
  71. width: 15%;
  72. cursor: pointer;
  73. background: white;
  74. text-decoration: none;
  75. color: SALMON;
  76. border: 3px solid SALMON;
  77.  
  78. }
  79. .content {
  80. text-align: center;
  81. }
  82. .button {
  83. display: inline-block;
  84. vertical-align: middle;
  85. -webkit-transform: translateZ(0);
  86. transform: translateZ(0);
  87. box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  88. -webkit-backface-visibility: hidden;
  89. backface-visibility: hidden;
  90. -moz-osx-font-smoothing: grayscale;
  91. position: relative;
  92. -webkit-transition-property: color;
  93. transition-property: color;
  94. -webkit-transition-duration: 0.5s;
  95. transition-duration: 0.5s;
  96. }
  97. .button:before {
  98. content: "";
  99. position: absolute;
  100. z-index: -1;
  101. top: 0;
  102. left: 0;
  103. right: 0;
  104. bottom: 0;
  105. background: SALMON;
  106. -webkit-transform: scaleY(0);
  107. transform: scaleY(0);
  108. -webkit-transform-origin: 50% 0;
  109. transform-origin: 50% 0;
  110. -webkit-transition-property: transform;
  111. transition-property: transform;
  112. -webkit-transition-duration: 0.5s;
  113. transition-duration: 0.5s;
  114. -webkit-transition-timing-function: ease-out;
  115. transition-timing-function: ease-out;
  116. }
  117. .button:hover, .button:focus, .button:active {
  118. color: WHITE;
  119. }
  120. .button:hover:before, .button:focus:before, .button:active:before {
  121. -webkit-transform: scaleY(1);
  122. transform: scaleY(1);
  123. -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  124. transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  125. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement