Advertisement
RyanJEarnshaw

Untitled

Sep 21st, 2016
94
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.26 KB | None | 0 0
  1. @import url('https://fonts.googleapis.com/css?family=Baloo+Bhaina');
  2.  
  3.  
  4. #persontable, #teamstable {
  5. display: inline-block;
  6. transition: 0.4s ease;
  7. width: 45%;
  8. height: auto;
  9. text-align: center;
  10. float: middle;
  11. margin: auto;
  12. margin: 2% 2% 0;
  13.  
  14. border: 1px solid #FF4646;
  15. background-color: #FF4646;
  16. }
  17.  
  18. .item {
  19. transition: 0.4s ease;
  20. width: 100%;
  21. display: flex;
  22. float: left;
  23. border: 1px solid #FF4646;
  24. background-color: rgba(255,100,100,1);
  25. }
  26.  
  27.  
  28. .topitem{
  29. background-color: rgba(255,1,1,0.4);
  30. }
  31. /*Top Image*/
  32. .topitem .image .circle {
  33. margin: 10px 0px;
  34. width: 15vh;
  35. height: 15vh;
  36. }
  37. .image {
  38. margin: 5px 0px;
  39. }
  40.  
  41. .circle {
  42. width: 7vh;
  43. height: 7vh;
  44. border-radius: 50%;
  45. color: #fff;
  46. text-align: center;
  47. background-color: #989a8f;;
  48. overflow: hidden;
  49. margin: auto;
  50. }
  51. .circle img {
  52. width: auto;
  53. height: inherit;
  54. color: #fff;
  55. text-align: center;
  56. background-color: #989a8f;
  57. }
  58.  
  59. .name, .image, .points {
  60. vertical-align:middle;
  61. float: left;
  62. width: 32%;
  63. display: flex;
  64. align-items: center;
  65. justify-content: center;
  66. }
  67. .position, .trophy {
  68. vertical-align:middle;
  69. float: left;
  70. width: 4%;
  71. display: flex;
  72. align-items: center;
  73. justify-content: center;
  74. background-color: #FF4646;
  75. }
  76.  
  77. .item:hover {
  78. background-color: #FFF842;
  79. font-weight: bold;
  80. box-shadow: #7F7C21 -1px 1px, #7F7C21 -2px 2px, #7F7C21 -3px 3px, #7F7C21 -4px 4px, #7F7C21 -5px 5px, #7F7C21 -6px 6px;
  81. transform: translate3d(6px, -6px, 0);
  82. transition-delay: 0s;
  83. transition-duration: 0.4s;
  84. transition-property: all;
  85. transition-timing-function: line;
  86. }
  87.  
  88. .topcontainer {
  89. display: block;
  90. transition: 0.4s ease;
  91. width: 100%;
  92. height: 27vh;
  93. }
  94. .topcontainer .image {
  95. vertical-align:middle;
  96. float: left;
  97. width: 100%;
  98. }
  99.  
  100. .topcontainer .name{
  101. font-size: 60px;
  102. vertical-align:middle;
  103. float: middle;
  104. width: 100%;
  105. }
  106. .trophy .trophyimage {
  107. display: flex;
  108. display: inline-block;
  109. }
  110. .topitem .position, .topitem .trophy {
  111. width: 30%;
  112. }
  113. .trophyimage img, .trophyimage {
  114. vertical-align:middle;
  115. float: middle;
  116. width: 82%;
  117. }
  118. .trophytext {
  119. margin-top: 10%;
  120. font-size: 16px;
  121. font-family: 'Baloo Bhaina';
  122. line-height: 100%;
  123. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement