[css] css

Viewer

  1. body{
  2.     margin: 0;
  3.     font-family: "Poppins";
  4.     background:white;
  5. }
  6.  
  7.  
  8. h3.sofa{
  9.     text-align:center;
  10.     font-size:30px;
  11.     margin:0;
  12.     padding-top: 10px;
  13. }
  14.  
  15. a{
  16.     text-decoration: none;
  17. }
  18.  
  19. .gallery{
  20.     display: flex;
  21.     flex-wrap : wrap;
  22.     width:100%;
  23.     height:100%;
  24.     justify-content: center;
  25.     align-items:center;
  26.     margin:50px 0;
  27.  
  28.  
  29. }
  30.  
  31. .contentContainer{
  32.     width: 20%;
  33.     height:20%;
  34.     margin: 15px;
  35.     box-sizing:border-box;
  36.     float:left;
  37.     text-align:center;
  38.     border-radius:20px;
  39.     cursor:pointer;
  40.     padding-top:10px;
  41.     padding-left: 0;
  42.     box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
  43.     transition: .4s;
  44.     background: #f2f2f2;
  45.     
  46. }
  47.  
  48. .contentCo.contentContainer:hover{
  49.     box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
  50.     transform: translate(0px , -8px);
  51.  
  52. }
  53.  
  54. .productImage{
  55.     width: 200px;
  56.     height:200px;
  57.     text-align: center;
  58.     margin: 0 auto;
  59.     display: block;
  60.     border-radius: 20px;
  61. }
  62.  
  63.  
  64. .description{
  65.     color: #b2b3c3;
  66.     padding-top: 0 200px;
  67.     font-size: 15px;
  68.     margin-left:13px;
  69. }
  70.  
  71. h6 {
  72.     font-size: 26px;
  73.     text-align: center;
  74.     color: #222f3e;
  75.     margin:0;
  76. }
  77. .rating{
  78.     list-style:none;
  79.     display:flex;
  80.     justify-content: center;
  81.     align-items: center;
  82.     padding:0;
  83. }
  84. .gallery{
  85.     display: flex;
  86.     flex-wrap : wrap;
  87.     width:100%;
  88.     height:100%;
  89.     justify-content: center;
  90.     align-items:center;
  91.     margin:50px 0;
  92. }
  93. .sofa_main{
  94.     width:80%;
  95. }
  96. .bed_main{
  97.     width:80%;
  98. }
  99. .buy-1 {
  100.   background: #5c7364;
  101. }
  102.  
  103. .contentContainer{
  104.     width: 20%;
  105.     height:20%;
  106.     margin: 15px;
  107.     box-sizing:border-box;
  108.     float:left;
  109.     text-align:center;
  110.     border-radius:20px;
  111.     cursor:pointer;
  112.     padding-top:10px;
  113.     padding-left: 0;
  114.     box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
  115.     transition: .4s;
  116.     background: #f2f2f2;
  117.     
  118. }
  119.  
  120. .contentContainer:hover{
  121.     box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
  122.     transform: translate(0px , -8px);
  123.  
  124. }
  125.  
  126. .productImage{
  127.     width: 200px;
  128.     height:200px;
  129.     text-align: center;
  130.     margin: 0 auto;
  131.     display: block;
  132.     border-radius: 20px;
  133. }
  134.  
  135.  
  136. .description{
  137.     color: #b2b3c3;
  138.     padding-top: 0 200px;
  139.     font-size: 15px;
  140.     margin-left:13px;
  141. }
  142.  
  143. h6{
  144.     font-size: 26px;
  145.     text-align: center;
  146.     color: #222f3e;
  147.     margin:0;
  148. }
  149. .rating{
  150.     list-style:none;
  151.     display:flex;
  152.     justify-content: center;
  153.     align-items: center;
  154.     padding:0;
  155. }
  156.  
  157. li{
  158.     padding:5px;
  159.  
  160. }
  161. .fa{
  162.     font-size: 26px;
  163.     transition: .4s;
  164.     margin: 3px;
  165. }
  166. li{
  167.     padding:5px;
  168. }
  169. .fa{
  170.     font-size: 26px;
  171.     transition: .4s;
  172.     margin: 3px;
  173.  
  174. }
  175.  
  176. .checked{
  177.     color:#ff9f43;
  178. }
  179. .fa:hover{
  180.     transform: scale(1,3);
  181.     transition: .6s;
  182. }
  183. .contentContainer button{
  184.     text-align: center;
  185.     font-size: 24px;
  186.     color: #fff;
  187.     width: 100%;
  188.     padding:15px;
  189.     border: 0;
  190.     outline: none;
  191.     cursor: pointer;
  192.     margin-top: 5px;
  193.     border-bottom-right-radius: 20px;
  194.     border-bottom-left-radius: 20px;
  195.  
  196. }
  197.  
  198.  
  199.  
  200. .buy-1{
  201.     background: #5C7364;
  202.  
  203. }
  204. .sofaMainFarrah{
  205.  
  206.     width:80%;
  207. }
  208.  
  209.  
  210. @media(max-width:1000px){
  211.     .content{
  212.         width:45%;
  213.     }
  214. }
  215.  
  216. @media(max-width:750px){
  217.     .content{
  218.         width:100%;
  219.     }
  220. }

Editor

You can edit this paste and save as new:


File Description
  • css
  • Paste Code
  • 23 Mar-2023
  • 3.3 Kb
You can Share it: