home-category.css 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. /*========================================
  2. HOME-CATEGORY PAGE STYLE
  3. =========================================*/
  4. .suggest-part {
  5. padding: 30px 0px 22px;
  6. }
  7. .suggest-slider li {
  8. margin: 0px 10px;
  9. }
  10. @media (max-width: 575px) {
  11. .suggest-part {
  12. padding: 20px 0px 12px;
  13. }
  14. .suggest-slider li {
  15. margin: 0px 5px;
  16. }
  17. }
  18. .banner-part {
  19. margin-bottom: 25px;
  20. }
  21. .home-category-slider a img {
  22. width: 100%;
  23. border-radius: 8px;
  24. }
  25. @media (max-width: 575px) {
  26. .home-category-slider a {
  27. margin: 0px 5px;
  28. }
  29. }
  30. .promo-img {
  31. width: 100%;
  32. overflow: hidden;
  33. border-radius: 8px;
  34. }
  35. .promo-img a {
  36. width: 100%;
  37. }
  38. .promo-img a img {
  39. width: 100%;
  40. border-radius: 8px;
  41. transition: all linear .3s;
  42. -webkit-transition: all linear .3s;
  43. -moz-transition: all linear .3s;
  44. -ms-transition: all linear .3s;
  45. -o-transition: all linear .3s;
  46. }
  47. .promo-img a img:hover {
  48. -webkit-transform: scale(1.05);
  49. transform: scale(1.05);
  50. }
  51. @media (max-width: 767px) {
  52. .promo-img {
  53. margin: 12px 0px;
  54. }
  55. }
  56. .new-slider li {
  57. margin: 0px 12px;
  58. }
  59. @media (max-width: 575px) {
  60. .new-slider .product-card {
  61. width: 220px;
  62. }
  63. }
  64. .brand-slider .dandik,
  65. .brand-slider .bamdik {
  66. top: 35%;
  67. }
  68. .testimonial-slider .slick-slide {
  69. opacity: 0.3;
  70. -webkit-transform: scale(0.75);
  71. transform: scale(0.75);
  72. transition: all linear .3s;
  73. -webkit-transition: all linear .3s;
  74. -moz-transition: all linear .3s;
  75. -ms-transition: all linear .3s;
  76. -o-transition: all linear .3s;
  77. }
  78. .testimonial-slider .slick-center {
  79. opacity: 1;
  80. -webkit-transform: scale(1);
  81. transform: scale(1);
  82. transition: all linear .3s;
  83. -webkit-transition: all linear .3s;
  84. -moz-transition: all linear .3s;
  85. -ms-transition: all linear .3s;
  86. -o-transition: all linear .3s;
  87. }
  88. .testimonial-slider .dandik,
  89. .testimonial-slider .bamdik {
  90. opacity: 1;
  91. visibility: visible;
  92. }
  93. .testimonial-slider .dandik {
  94. right: 50px;
  95. }
  96. .testimonial-slider .bamdik {
  97. left: 50px;
  98. }
  99. .blog-slider .blog-card {
  100. margin: 0px 15px 25px;
  101. }
  102. .blog-slider .dandik,
  103. .blog-slider .bamdik {
  104. top: 43%;
  105. }
  106. @media (max-width: 767px) {
  107. .blog-slider .blog-card {
  108. margin: 0px 10px 25px;
  109. }
  110. }