You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

87 lines
2.2 KiB

1 year ago
  1. .wp-block-media-text{
  2. box-sizing:border-box;
  3. direction:ltr;
  4. display:grid;
  5. grid-template-columns:50% 1fr;
  6. grid-template-rows:auto;
  7. }
  8. .wp-block-media-text.has-media-on-the-right{
  9. grid-template-columns:1fr 50%;
  10. }
  11. .wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__content,.wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__media{
  12. align-self:start;
  13. }
  14. .wp-block-media-text .wp-block-media-text__content,.wp-block-media-text .wp-block-media-text__media,.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__content,.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__media{
  15. align-self:center;
  16. }
  17. .wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__content,.wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__media{
  18. align-self:end;
  19. }
  20. .wp-block-media-text .wp-block-media-text__media{
  21. grid-column:1;
  22. grid-row:1;
  23. margin:0;
  24. }
  25. .wp-block-media-text .wp-block-media-text__content{
  26. direction:ltr;
  27. grid-column:2;
  28. grid-row:1;
  29. padding:0 8%;
  30. word-break:break-word;
  31. }
  32. .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media{
  33. grid-column:2;
  34. grid-row:1;
  35. }
  36. .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content{
  37. grid-column:1;
  38. grid-row:1;
  39. }
  40. .wp-block-media-text__media img,.wp-block-media-text__media video{
  41. height:auto;
  42. max-width:unset;
  43. vertical-align:middle;
  44. width:100%;
  45. }
  46. .wp-block-media-text.is-image-fill .wp-block-media-text__media{
  47. background-size:cover;
  48. height:100%;
  49. min-height:250px;
  50. }
  51. .wp-block-media-text.is-image-fill .wp-block-media-text__media>a{
  52. display:block;
  53. height:100%;
  54. }
  55. .wp-block-media-text.is-image-fill .wp-block-media-text__media img{
  56. clip:rect(0, 0, 0, 0);
  57. border:0;
  58. height:1px;
  59. margin:-1px;
  60. overflow:hidden;
  61. padding:0;
  62. position:absolute;
  63. width:1px;
  64. }
  65. @media (max-width:600px){
  66. .wp-block-media-text.is-stacked-on-mobile{
  67. grid-template-columns:100% !important;
  68. }
  69. .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media{
  70. grid-column:1;
  71. grid-row:1;
  72. }
  73. .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content{
  74. grid-column:1;
  75. grid-row:2;
  76. }
  77. }