style.less 1.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. .Girl-Conste-box {
  2. width: 630px;
  3. height: 315px;
  4. background: #fbfbfb;
  5. -webkit-box-shadow: 0 7px 14px 0 rgba(0, 0, 0, 0.04),
  6. 0 4px 36px 0 rgba(0, 0, 0, 0.08);
  7. box-shadow: 0 14px 28px 0 rgba(0, 0, 0, 0.04),
  8. 0 8px 72px 0 rgba(0, 0, 0, 0.08);
  9. border-radius: 38px;
  10. margin: 0 auto;
  11. margin-top: 3em;
  12. display: flex;
  13. .Girl-box-imageContent {
  14. width: 50%;
  15. height: 100%;
  16. position: relative;
  17. bottom: 8vw;
  18. .Girl-box-image {
  19. width: 200px;
  20. height: 360px;
  21. position: relative;
  22. bottom: -22px;
  23. left: 90px;
  24. filter: grayscale(100%);
  25. }
  26. .imageTwo {
  27. height: 420px;
  28. width: 240px;
  29. position: relative;
  30. left: 0em;
  31. bottom: 45px;
  32. filter: grayscale(100%);
  33. }
  34. .Girl-imageLess {
  35. filter: grayscale(0%);
  36. }
  37. }
  38. .Girl-box-content {
  39. width: 50%;
  40. height: 100%;
  41. display: inline-block;
  42. text-align: center;
  43. /* margin: 1em; */
  44. margin-top: 1.5em;
  45. .Girl-box-C-title {
  46. font-size: 66px;
  47. font-weight: bold;
  48. color: #140f0f;
  49. margin: 15px;
  50. }
  51. .Girl-box-C-moon {
  52. font-weight: bold;
  53. color: #140f0f;
  54. }
  55. }
  56. }
  57. .imageTwo {
  58. width: 200px;
  59. }