Posted By

robnilas on 01/21/17


Tagged


Versions (?)

Hover Reveal Box


 / Published in: CSS
 

  1. .container {
  2. width: 980px;
  3. margin: 0 auto;
  4. }
  5.  
  6. li, ._row li, div, ._row div {
  7. font-size: 16px;
  8. font-size: 1.6rem;
  9. line-height: 150% !important;
  10. }
  11.  
  12. div {
  13. display: block;
  14. }
  15.  
  16. ._row {
  17. clear: both;
  18. overflow: auto;
  19. overflow: hidden;
  20. width: 100%;
  21. margin-bottom: 20px;
  22. }
  23.  
  24. ._row {
  25. margin-bottom: 20px;
  26. }
  27.  
  28. ._row ._top {
  29. margin-bottom: 86px;
  30. }
  31.  
  32. ._keyframes{
  33. background: url(img/Hover-Scroll/KeyFactors-bg.jpg) no-repeat;
  34. width: 931px;
  35. margin: 0px auto
  36. }
  37.  
  38. ._col {
  39. float: left;
  40. }
  41.  
  42. ._col>* {
  43. padding-left: 10px;
  44. padding-right: 10px;
  45. }
  46.  
  47. ._tri ._col {
  48. min-width: 33%;
  49. width: 310px;
  50. }
  51.  
  52. img.compose {
  53. padding: 0;
  54. margin: 10px 10px;
  55. }
  56.  
  57. img.compose.center {
  58. display: block;
  59. margin: 10px auto;
  60. }
  61.  
  62. /* -- BOX APPEARS -- */
  63. .appears-element {
  64. display: none;
  65. color: #fff;
  66. width: 270px;
  67. height: 170px;
  68. padding: 11px;
  69. position: absolute;
  70. background: #b54d9f;
  71. -webkit-border-radius: 5px;
  72. -moz-border-radius: 5px;
  73. border-radius: 5px;
  74. color: #ffffff;
  75. }
  76.  
  77. .appears-div:hover .appears-element {
  78. display: block;
  79. font-size: 14px;
  80. }
  81.  
  82. p.title_keyframes{
  83. text-align: center;
  84. font-family: 'league_gothicregular', arial, serif;
  85. font-size: 34px;
  86. line-height: 34px;
  87. color: #8d1f82;
  88. }

Report this snippet  

You need to login to post a comment.