woocommerce-layout-grid.css 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619
  1. /**
  2. * woocommerce-layout-grid.scss
  3. * Applies layout to the default WooCommerce frontend design
  4. */
  5. /**
  6. * Imports
  7. */
  8. /**
  9. * Deprecated
  10. * Fallback for bourbon equivalent
  11. */
  12. /**
  13. * Deprecated
  14. * Vendor prefix no longer required.
  15. */
  16. /**
  17. * Deprecated
  18. * Vendor prefix no longer required.
  19. */
  20. /**
  21. * Deprecated
  22. * Vendor prefix no longer required.
  23. */
  24. /**
  25. * Deprecated
  26. * Vendor prefix no longer required.
  27. */
  28. /**
  29. * Deprecated
  30. * Vendor prefix no longer required.
  31. */
  32. /**
  33. * Deprecated
  34. * Vendor prefix no longer required.
  35. */
  36. /**
  37. * Deprecated
  38. * Vendor prefix no longer required.
  39. */
  40. /**
  41. * Deprecated
  42. * Vendor prefix no longer required.
  43. */
  44. /**
  45. * Deprecated
  46. * Vendor prefix no longer required.
  47. */
  48. /**
  49. * Deprecated
  50. * Vendor prefix no longer required.
  51. */
  52. /**
  53. * Deprecated
  54. * Vendor prefix no longer required.
  55. */
  56. /**
  57. * Deprecated
  58. * Use bourbon mixin instead `@include transform(scale(1.5));`
  59. */
  60. /**
  61. * Deprecated
  62. * Use bourbon mixin instead `@include box-sizing(border-box);`
  63. */
  64. /**
  65. * Objects
  66. */
  67. /**
  68. * WooCommerce CSS Variables
  69. */
  70. /**
  71. * Astra Theme compatibility with WooCommerce
  72. */
  73. /*---------- Media Query min-width Structure ----------*/
  74. /*---------- Media Query max-width Structure ----------*/
  75. /*---------- Break-point min-width Structure ----------*/
  76. /*---------- Break-point max-width Structure ----------*/
  77. /**
  78. * Styling begins
  79. */
  80. .woocommerce, .woocommerce-page {
  81. /**
  82. * General layout styles
  83. */
  84. /**
  85. * Product page
  86. */
  87. /**
  88. * Product loops
  89. */
  90. /**
  91. * Cart page
  92. */
  93. /**
  94. * Cart sidebar
  95. */
  96. /**
  97. * Forms
  98. */
  99. /**
  100. * oEmbeds
  101. */
  102. }
  103. .woocommerce .woocommerce-message .button,
  104. .woocommerce .woocommerce-error .button,
  105. .woocommerce .woocommerce-info .button, .woocommerce-page .woocommerce-message .button,
  106. .woocommerce-page .woocommerce-error .button,
  107. .woocommerce-page .woocommerce-info .button {
  108. float: right;
  109. }
  110. .woocommerce .col2-set, .woocommerce-page .col2-set {
  111. *zoom: 1;
  112. width: 100%;
  113. }
  114. .woocommerce .col2-set::before, .woocommerce .col2-set::after, .woocommerce-page .col2-set::before, .woocommerce-page .col2-set::after {
  115. content: ' ';
  116. display: table;
  117. }
  118. .woocommerce .col2-set::after, .woocommerce-page .col2-set::after {
  119. clear: both;
  120. }
  121. .woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
  122. float: left;
  123. width: 48%;
  124. }
  125. .woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
  126. float: right;
  127. width: 48%;
  128. }
  129. .woocommerce img, .woocommerce-page img {
  130. height: auto;
  131. max-width: 100%;
  132. }
  133. .woocommerce div.product div.images,
  134. .woocommerce #content div.product div.images, .woocommerce-page div.product div.images,
  135. .woocommerce-page #content div.product div.images {
  136. float: left;
  137. width: 48%;
  138. }
  139. .woocommerce div.product div.thumbnails,
  140. .woocommerce #content div.product div.thumbnails, .woocommerce-page div.product div.thumbnails,
  141. .woocommerce-page #content div.product div.thumbnails {
  142. *zoom: 1;
  143. }
  144. .woocommerce div.product div.thumbnails::before, .woocommerce div.product div.thumbnails::after,
  145. .woocommerce #content div.product div.thumbnails::before,
  146. .woocommerce #content div.product div.thumbnails::after, .woocommerce-page div.product div.thumbnails::before, .woocommerce-page div.product div.thumbnails::after,
  147. .woocommerce-page #content div.product div.thumbnails::before,
  148. .woocommerce-page #content div.product div.thumbnails::after {
  149. content: ' ';
  150. display: table;
  151. }
  152. .woocommerce div.product div.thumbnails::after,
  153. .woocommerce #content div.product div.thumbnails::after, .woocommerce-page div.product div.thumbnails::after,
  154. .woocommerce-page #content div.product div.thumbnails::after {
  155. clear: both;
  156. }
  157. .woocommerce div.product div.thumbnails a,
  158. .woocommerce #content div.product div.thumbnails a, .woocommerce-page div.product div.thumbnails a,
  159. .woocommerce-page #content div.product div.thumbnails a {
  160. float: left;
  161. width: 30.75%;
  162. margin-right: 3.8%;
  163. margin-bottom: 1em;
  164. }
  165. .woocommerce div.product div.thumbnails a.last,
  166. .woocommerce #content div.product div.thumbnails a.last, .woocommerce-page div.product div.thumbnails a.last,
  167. .woocommerce-page #content div.product div.thumbnails a.last {
  168. margin-right: 0;
  169. }
  170. .woocommerce div.product div.thumbnails a.first,
  171. .woocommerce #content div.product div.thumbnails a.first, .woocommerce-page div.product div.thumbnails a.first,
  172. .woocommerce-page #content div.product div.thumbnails a.first {
  173. clear: both;
  174. }
  175. .woocommerce div.product div.thumbnails.columns-1 a,
  176. .woocommerce #content div.product div.thumbnails.columns-1 a, .woocommerce-page div.product div.thumbnails.columns-1 a,
  177. .woocommerce-page #content div.product div.thumbnails.columns-1 a {
  178. width: 100%;
  179. margin-right: 0;
  180. float: none;
  181. }
  182. .woocommerce div.product div.thumbnails.columns-2 a,
  183. .woocommerce #content div.product div.thumbnails.columns-2 a, .woocommerce-page div.product div.thumbnails.columns-2 a,
  184. .woocommerce-page #content div.product div.thumbnails.columns-2 a {
  185. width: 48%;
  186. }
  187. .woocommerce div.product div.thumbnails.columns-4 a,
  188. .woocommerce #content div.product div.thumbnails.columns-4 a, .woocommerce-page div.product div.thumbnails.columns-4 a,
  189. .woocommerce-page #content div.product div.thumbnails.columns-4 a {
  190. width: 22.05%;
  191. }
  192. .woocommerce div.product div.thumbnails.columns-5 a,
  193. .woocommerce #content div.product div.thumbnails.columns-5 a, .woocommerce-page div.product div.thumbnails.columns-5 a,
  194. .woocommerce-page #content div.product div.thumbnails.columns-5 a {
  195. width: 16.9%;
  196. }
  197. .woocommerce div.product div.summary,
  198. .woocommerce #content div.product div.summary, .woocommerce-page div.product div.summary,
  199. .woocommerce-page #content div.product div.summary {
  200. float: right;
  201. width: 48%;
  202. clear: none;
  203. }
  204. .woocommerce div.product .woocommerce-tabs,
  205. .woocommerce #content div.product .woocommerce-tabs, .woocommerce-page div.product .woocommerce-tabs,
  206. .woocommerce-page #content div.product .woocommerce-tabs {
  207. clear: both;
  208. }
  209. .woocommerce div.product .woocommerce-tabs ul.tabs,
  210. .woocommerce #content div.product .woocommerce-tabs ul.tabs, .woocommerce-page div.product .woocommerce-tabs ul.tabs,
  211. .woocommerce-page #content div.product .woocommerce-tabs ul.tabs {
  212. *zoom: 1;
  213. }
  214. .woocommerce div.product .woocommerce-tabs ul.tabs::before, .woocommerce div.product .woocommerce-tabs ul.tabs::after,
  215. .woocommerce #content div.product .woocommerce-tabs ul.tabs::before,
  216. .woocommerce #content div.product .woocommerce-tabs ul.tabs::after, .woocommerce-page div.product .woocommerce-tabs ul.tabs::before, .woocommerce-page div.product .woocommerce-tabs ul.tabs::after,
  217. .woocommerce-page #content div.product .woocommerce-tabs ul.tabs::before,
  218. .woocommerce-page #content div.product .woocommerce-tabs ul.tabs::after {
  219. content: ' ';
  220. display: table;
  221. }
  222. .woocommerce div.product .woocommerce-tabs ul.tabs::after,
  223. .woocommerce #content div.product .woocommerce-tabs ul.tabs::after, .woocommerce-page div.product .woocommerce-tabs ul.tabs::after,
  224. .woocommerce-page #content div.product .woocommerce-tabs ul.tabs::after {
  225. clear: both;
  226. }
  227. .woocommerce div.product .woocommerce-tabs ul.tabs li,
  228. .woocommerce #content div.product .woocommerce-tabs ul.tabs li, .woocommerce-page div.product .woocommerce-tabs ul.tabs li,
  229. .woocommerce-page #content div.product .woocommerce-tabs ul.tabs li {
  230. display: inline-block;
  231. }
  232. .woocommerce div.product #reviews .comment,
  233. .woocommerce #content div.product #reviews .comment, .woocommerce-page div.product #reviews .comment,
  234. .woocommerce-page #content div.product #reviews .comment {
  235. *zoom: 1;
  236. }
  237. .woocommerce div.product #reviews .comment::before, .woocommerce div.product #reviews .comment::after,
  238. .woocommerce #content div.product #reviews .comment::before,
  239. .woocommerce #content div.product #reviews .comment::after, .woocommerce-page div.product #reviews .comment::before, .woocommerce-page div.product #reviews .comment::after,
  240. .woocommerce-page #content div.product #reviews .comment::before,
  241. .woocommerce-page #content div.product #reviews .comment::after {
  242. content: ' ';
  243. display: table;
  244. }
  245. .woocommerce div.product #reviews .comment::after,
  246. .woocommerce #content div.product #reviews .comment::after, .woocommerce-page div.product #reviews .comment::after,
  247. .woocommerce-page #content div.product #reviews .comment::after {
  248. clear: both;
  249. }
  250. .woocommerce div.product #reviews .comment img,
  251. .woocommerce #content div.product #reviews .comment img, .woocommerce-page div.product #reviews .comment img,
  252. .woocommerce-page #content div.product #reviews .comment img {
  253. float: right;
  254. height: auto;
  255. }
  256. .woocommerce ul.products, .woocommerce-page ul.products {
  257. display: grid;
  258. column-gap: 20px;
  259. }
  260. .woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
  261. display: flex;
  262. flex-direction: column;
  263. width: 100%;
  264. padding: 0;
  265. position: relative;
  266. }
  267. .woocommerce ul.products:not(.elementor-grid), .woocommerce-page ul.products:not(.elementor-grid) {
  268. grid-template-columns: repeat(4, 1fr);
  269. }
  270. .woocommerce ul.products:not(.elementor-grid).columns-1, .woocommerce-page ul.products:not(.elementor-grid).columns-1 {
  271. grid-template-columns: repeat(1, minmax(0, 1fr));
  272. width: 100%;
  273. margin-right: 0;
  274. }
  275. .woocommerce ul.products:not(.elementor-grid).columns-2, .woocommerce-page ul.products:not(.elementor-grid).columns-2 {
  276. grid-template-columns: repeat(2, minmax(0, 1fr));
  277. }
  278. .woocommerce ul.products:not(.elementor-grid).columns-3, .woocommerce-page ul.products:not(.elementor-grid).columns-3 {
  279. grid-template-columns: repeat(3, minmax(0, 1fr));
  280. }
  281. .woocommerce ul.products:not(.elementor-grid).columns-5, .woocommerce-page ul.products:not(.elementor-grid).columns-5 {
  282. grid-template-columns: repeat(5, minmax(0, 1fr));
  283. }
  284. .woocommerce ul.products:not(.elementor-grid).columns-6, .woocommerce-page ul.products:not(.elementor-grid).columns-6 {
  285. grid-template-columns: repeat(6, minmax(0, 1fr));
  286. }
  287. .woocommerce .woocommerce-result-count, .woocommerce-page .woocommerce-result-count {
  288. float: left;
  289. }
  290. .woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering {
  291. float: right;
  292. }
  293. .woocommerce .woocommerce-pagination ul.page-numbers, .woocommerce-page .woocommerce-pagination ul.page-numbers {
  294. *zoom: 1;
  295. }
  296. .woocommerce .woocommerce-pagination ul.page-numbers::before, .woocommerce .woocommerce-pagination ul.page-numbers::after, .woocommerce-page .woocommerce-pagination ul.page-numbers::before, .woocommerce-page .woocommerce-pagination ul.page-numbers::after {
  297. content: ' ';
  298. display: table;
  299. }
  300. .woocommerce .woocommerce-pagination ul.page-numbers::after, .woocommerce-page .woocommerce-pagination ul.page-numbers::after {
  301. clear: both;
  302. }
  303. .woocommerce .woocommerce-pagination ul.page-numbers li, .woocommerce-page .woocommerce-pagination ul.page-numbers li {
  304. display: inline-block;
  305. }
  306. .woocommerce table.cart img,
  307. .woocommerce #content table.cart img, .woocommerce-page table.cart img,
  308. .woocommerce-page #content table.cart img {
  309. height: auto;
  310. }
  311. .woocommerce table.cart td.actions,
  312. .woocommerce #content table.cart td.actions, .woocommerce-page table.cart td.actions,
  313. .woocommerce-page #content table.cart td.actions {
  314. text-align: right;
  315. }
  316. .woocommerce table.cart td.actions .input-text,
  317. .woocommerce #content table.cart td.actions .input-text, .woocommerce-page table.cart td.actions .input-text,
  318. .woocommerce-page #content table.cart td.actions .input-text {
  319. width: 80px;
  320. }
  321. .woocommerce table.cart td.actions .button,
  322. .woocommerce #content table.cart td.actions .button, .woocommerce-page table.cart td.actions .button,
  323. .woocommerce-page #content table.cart td.actions .button {
  324. line-height: 1;
  325. border-width: 1px;
  326. border-style: solid;
  327. }
  328. .woocommerce table.cart td.actions .coupon,
  329. .woocommerce #content table.cart td.actions .coupon, .woocommerce-page table.cart td.actions .coupon,
  330. .woocommerce-page #content table.cart td.actions .coupon {
  331. float: left;
  332. display: flex;
  333. margin: 0 auto;
  334. }
  335. .woocommerce table.cart td.actions .coupon label,
  336. .woocommerce #content table.cart td.actions .coupon label, .woocommerce-page table.cart td.actions .coupon label,
  337. .woocommerce-page #content table.cart td.actions .coupon label {
  338. display: none;
  339. }
  340. .woocommerce table.cart td.actions .button,
  341. .woocommerce #content table.cart td.actions .button, .woocommerce-page table.cart td.actions .button,
  342. .woocommerce-page #content table.cart td.actions .button {
  343. margin-left: 5px;
  344. }
  345. @media (min-width: 545px) {
  346. .woocommerce table.cart td.actions > input[type="submit"],
  347. .woocommerce #content table.cart td.actions > input[type="submit"], .woocommerce-page table.cart td.actions > input[type="submit"],
  348. .woocommerce-page #content table.cart td.actions > input[type="submit"] {
  349. margin: 5px auto;
  350. }
  351. }
  352. .woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals {
  353. *zoom: 1;
  354. width: 100%;
  355. }
  356. .woocommerce .cart-collaterals::before, .woocommerce .cart-collaterals::after, .woocommerce-page .cart-collaterals::before, .woocommerce-page .cart-collaterals::after {
  357. content: ' ';
  358. display: table;
  359. }
  360. .woocommerce .cart-collaterals::after, .woocommerce-page .cart-collaterals::after {
  361. clear: both;
  362. }
  363. .woocommerce .cart-collaterals .related, .woocommerce-page .cart-collaterals .related {
  364. width: 30.75%;
  365. float: left;
  366. }
  367. .woocommerce .cart-collaterals .cross-sells, .woocommerce-page .cart-collaterals .cross-sells {
  368. width: 48%;
  369. float: left;
  370. }
  371. .woocommerce .cart-collaterals .cross-sells ul.products, .woocommerce-page .cart-collaterals .cross-sells ul.products {
  372. float: none;
  373. }
  374. .woocommerce .cart-collaterals .cross-sells ul.products li, .woocommerce-page .cart-collaterals .cross-sells ul.products li {
  375. width: calc(50% - 10px);
  376. }
  377. .woocommerce .cart-collaterals .cross-sells ul.products li.first, .woocommerce-page .cart-collaterals .cross-sells ul.products li.first {
  378. clear: both;
  379. }
  380. .woocommerce .cart-collaterals .cross-sells ul.products li.last, .woocommerce-page .cart-collaterals .cross-sells ul.products li.last {
  381. margin-right: 0;
  382. }
  383. .woocommerce .cart-collaterals .shipping_calculator, .woocommerce-page .cart-collaterals .shipping_calculator {
  384. width: 48%;
  385. *zoom: 1;
  386. clear: right;
  387. float: right;
  388. }
  389. .woocommerce .cart-collaterals .shipping_calculator::before, .woocommerce .cart-collaterals .shipping_calculator::after, .woocommerce-page .cart-collaterals .shipping_calculator::before, .woocommerce-page .cart-collaterals .shipping_calculator::after {
  390. content: ' ';
  391. display: table;
  392. }
  393. .woocommerce .cart-collaterals .shipping_calculator::after, .woocommerce-page .cart-collaterals .shipping_calculator::after {
  394. clear: both;
  395. }
  396. .woocommerce .cart-collaterals .shipping_calculator .col2-set .col-1,
  397. .woocommerce .cart-collaterals .shipping_calculator .col2-set .col-2, .woocommerce-page .cart-collaterals .shipping_calculator .col2-set .col-1,
  398. .woocommerce-page .cart-collaterals .shipping_calculator .col2-set .col-2 {
  399. width: 47%;
  400. }
  401. .woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {
  402. float: right;
  403. width: 48%;
  404. }
  405. .woocommerce ul.cart_list li,
  406. .woocommerce ul.product_list_widget li, .woocommerce-page ul.cart_list li,
  407. .woocommerce-page ul.product_list_widget li {
  408. *zoom: 1;
  409. }
  410. .woocommerce ul.cart_list li::before, .woocommerce ul.cart_list li::after,
  411. .woocommerce ul.product_list_widget li::before,
  412. .woocommerce ul.product_list_widget li::after, .woocommerce-page ul.cart_list li::before, .woocommerce-page ul.cart_list li::after,
  413. .woocommerce-page ul.product_list_widget li::before,
  414. .woocommerce-page ul.product_list_widget li::after {
  415. content: ' ';
  416. display: table;
  417. }
  418. .woocommerce ul.cart_list li::after,
  419. .woocommerce ul.product_list_widget li::after, .woocommerce-page ul.cart_list li::after,
  420. .woocommerce-page ul.product_list_widget li::after {
  421. clear: both;
  422. }
  423. .woocommerce ul.cart_list li img,
  424. .woocommerce ul.product_list_widget li img, .woocommerce-page ul.cart_list li img,
  425. .woocommerce-page ul.product_list_widget li img {
  426. float: right;
  427. height: auto;
  428. }
  429. .woocommerce form .form-row, .woocommerce-page form .form-row {
  430. *zoom: 1;
  431. }
  432. .woocommerce form .form-row::before, .woocommerce form .form-row::after, .woocommerce-page form .form-row::before, .woocommerce-page form .form-row::after {
  433. content: ' ';
  434. display: table;
  435. }
  436. .woocommerce form .form-row::after, .woocommerce-page form .form-row::after {
  437. clear: both;
  438. }
  439. .woocommerce form .form-row label, .woocommerce-page form .form-row label {
  440. display: block;
  441. }
  442. .woocommerce form .form-row label.checkbox, .woocommerce-page form .form-row label.checkbox {
  443. display: inline;
  444. }
  445. .woocommerce form .form-row select, .woocommerce-page form .form-row select {
  446. width: 100%;
  447. }
  448. .woocommerce form .form-row .input-text, .woocommerce-page form .form-row .input-text {
  449. box-sizing: border-box;
  450. width: 100%;
  451. }
  452. .woocommerce form .form-row-first,
  453. .woocommerce form .form-row-last, .woocommerce-page form .form-row-first,
  454. .woocommerce-page form .form-row-last {
  455. width: 47%;
  456. overflow: visible;
  457. }
  458. .woocommerce form .form-row-first, .woocommerce-page form .form-row-first {
  459. float: left;
  460. }
  461. .woocommerce form .form-row-last, .woocommerce-page form .form-row-last {
  462. float: right;
  463. }
  464. .woocommerce form .form-row-wide, .woocommerce-page form .form-row-wide {
  465. clear: both;
  466. }
  467. .woocommerce #payment .form-row select, .woocommerce-page #payment .form-row select {
  468. width: auto;
  469. }
  470. .woocommerce #payment .wc-terms-and-conditions, .woocommerce #payment .terms, .woocommerce-page #payment .wc-terms-and-conditions, .woocommerce-page #payment .terms {
  471. text-align: left;
  472. padding: 0;
  473. width: 100%;
  474. margin-bottom: 1em;
  475. }
  476. .woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
  477. float: right;
  478. }
  479. .woocommerce .woocommerce-billing-fields,
  480. .woocommerce .woocommerce-shipping-fields, .woocommerce-page .woocommerce-billing-fields,
  481. .woocommerce-page .woocommerce-shipping-fields {
  482. *zoom: 1;
  483. }
  484. .woocommerce .woocommerce-billing-fields::before, .woocommerce .woocommerce-billing-fields::after,
  485. .woocommerce .woocommerce-shipping-fields::before,
  486. .woocommerce .woocommerce-shipping-fields::after, .woocommerce-page .woocommerce-billing-fields::before, .woocommerce-page .woocommerce-billing-fields::after,
  487. .woocommerce-page .woocommerce-shipping-fields::before,
  488. .woocommerce-page .woocommerce-shipping-fields::after {
  489. content: ' ';
  490. display: table;
  491. }
  492. .woocommerce .woocommerce-billing-fields::after,
  493. .woocommerce .woocommerce-shipping-fields::after, .woocommerce-page .woocommerce-billing-fields::after,
  494. .woocommerce-page .woocommerce-shipping-fields::after {
  495. clear: both;
  496. }
  497. .woocommerce .woocommerce-terms-and-conditions, .woocommerce-page .woocommerce-terms-and-conditions {
  498. margin-bottom: 1.618em;
  499. padding: 1.618em;
  500. }
  501. .woocommerce .woocommerce-oembed, .woocommerce-page .woocommerce-oembed {
  502. position: relative;
  503. }
  504. .woocommerce-account .woocommerce-MyAccount-navigation {
  505. float: left;
  506. width: 30%;
  507. }
  508. .woocommerce-account .woocommerce-MyAccount-content {
  509. float: right;
  510. width: 68%;
  511. }
  512. .woocommerce-account .woocommerce-MyAccount-content fieldset {
  513. border: 0;
  514. margin: 1em 0 0;
  515. padding: 3px;
  516. }
  517. .woocommerce-account .woocommerce-MyAccount-content fieldset legend {
  518. padding: 3px 0;
  519. border-bottom: 1px solid #e5e5e5;
  520. width: 100%;
  521. margin: 10px 0;
  522. }
  523. .woocommerce-account .woocommerce-MyAccount-content fieldset .form-row {
  524. padding-left: 0;
  525. padding-right: 0;
  526. }