Brak opisu
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.

_check-out.scss 17KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832
  1. /*------------------*
  2. # Check out Page
  3. *------------------*/
  4. .billing-info-wrap .billing-info input,
  5. .billing-info-wrap .billing-select input {
  6. background: transparent none repeat scroll 0 0;
  7. border: 1px solid #e6e6e6;
  8. color: #666;
  9. font-size: 14px;
  10. padding-left: 20px;
  11. padding-right: 10px;
  12. width: 100%;
  13. outline: none;
  14. height: 45px;
  15. }
  16. .billing-info-wrap .checkout-account-toggle input {
  17. background: transparent none repeat scroll 0 0;
  18. border: 1px solid #e6e6e6;
  19. color: #666;
  20. font-size: 14px;
  21. padding-left: 20px;
  22. padding-right: 10px;
  23. margin: 0 0 20px;
  24. width: 100%;
  25. height: 45px;
  26. outline: none;
  27. }
  28. .billing-info-wrap .additional-info-wrap .additional-info textarea {
  29. background: transparent none repeat scroll 0 0;
  30. border: 1px solid #e6e6e6;
  31. color: #333;
  32. font-size: 14px;
  33. height: 138px;
  34. padding: 17px 20px;
  35. width: 100%;
  36. outline: none;
  37. }
  38. .billing-info-wrap {
  39. .title {
  40. font-size: 30px;
  41. text-transform: capitalize;
  42. font-weight: fontweight(semi-bold);
  43. margin-bottom: 30px;
  44. }
  45. }
  46. .your-order-area {
  47. .title {
  48. font-size: 30px;
  49. text-transform: capitalize;
  50. font-weight: fontweight(semi-bold);
  51. margin-bottom: 30px;
  52. }
  53. }
  54. .billing-info {
  55. margin-bottom: 20px;
  56. }
  57. .billing-info label {
  58. font-size: 14px;
  59. margin-bottom: 10px;
  60. }
  61. .form-select {
  62. height: 45px;
  63. border-radius: 0px;
  64. outline: 0;
  65. color: #565656;
  66. }
  67. .form-select:focus {
  68. border-color: #e6e6e6;
  69. outline: 0;
  70. box-shadow: none;
  71. }
  72. .open-toggle,
  73. .open-toggle2 {
  74. display: none;
  75. }
  76. .your-order-area .your-order-wrap {
  77. padding: 38px 45px 44px;
  78. background: #f6f6f6;
  79. }
  80. .your-order-area .your-order-wrap .your-order-product-info .your-order-top ul li {
  81. font-size: 24px;
  82. text-transform: capitalize;
  83. color: #111;
  84. font-weight: 500;
  85. }
  86. .your-order-area .your-order-wrap .your-order-product-info .your-order-top ul {
  87. display: -webkit-box;
  88. display: -ms-flexbox;
  89. display: flex;
  90. -webkit-box-pack: justify;
  91. -ms-flex-pack: justify;
  92. justify-content: space-between;
  93. }
  94. .your-order-area .your-order-wrap .your-order-product-info .your-order-top ul li {
  95. font-size: 15px;
  96. font-weight: 500;
  97. list-style: outside none none;
  98. color: $color-dark;
  99. }
  100. .your-order-area .your-order-wrap .your-order-product-info .your-order-middle {
  101. border-bottom: 1px solid #dee0e4;
  102. border-top: 1px solid #dee0e4;
  103. margin: 29px 0;
  104. padding: 19px 0 18px;
  105. }
  106. .your-order-area .your-order-wrap .your-order-product-info .your-order-bottom ul li.your-order-shipping {
  107. font-size: 15px;
  108. color: $color-dark;
  109. font-weight: 500;
  110. }
  111. .your-order-area .your-order-wrap .your-order-product-info .your-order-middle ul li {
  112. display: -webkit-box;
  113. display: -ms-flexbox;
  114. display: flex;
  115. -webkit-box-pack: justify;
  116. -ms-flex-pack: justify;
  117. justify-content: space-between;
  118. margin: 0 0 10px;
  119. }
  120. .your-order-area .your-order-wrap .your-order-product-info .your-order-bottom ul {
  121. -webkit-box-align: center;
  122. -ms-flex-align: center;
  123. align-items: center;
  124. display: -webkit-box;
  125. display: -ms-flexbox;
  126. display: flex;
  127. -webkit-box-pack: justify;
  128. -ms-flex-pack: justify;
  129. justify-content: space-between;
  130. }
  131. .your-order-area .your-order-wrap .your-order-product-info .your-order-total ul {
  132. -webkit-box-align: center;
  133. -ms-flex-align: center;
  134. align-items: center;
  135. display: -webkit-box;
  136. display: -ms-flexbox;
  137. display: flex;
  138. -webkit-box-pack: justify;
  139. -ms-flex-pack: justify;
  140. justify-content: space-between;
  141. }
  142. .billing-info-wrap .billing-info input,
  143. .billing-info-wrap .billing-select input {
  144. background: transparent none repeat scroll 0 0;
  145. border: 1px solid #e6e6e6;
  146. color: #666;
  147. font-size: 14px;
  148. padding-left: 20px;
  149. padding-right: 10px;
  150. width: 100%;
  151. outline: none;
  152. height: 45px;
  153. }
  154. .billing-info-wrap .nice-select {
  155. width: 100%;
  156. margin-bottom: 20px;
  157. }
  158. .billing-info-wrap .nice-select .list {
  159. width: 100%;
  160. }
  161. .billing-info-wrap .nice-select:active,
  162. .billing-info-wrap .nice-select.open,
  163. .billing-info-wrap .nice-select:focus {
  164. border-color: #ebebeb;
  165. }
  166. .billing-info-wrap .billing-info input.billing-address,
  167. .billing-info-wrap .billing-select input.billing-address {
  168. margin-bottom: 10px;
  169. }
  170. .billing-info-wrap .checkout-account label {
  171. color: #666;
  172. font-weight: 400;
  173. margin: 0 0 0 12px;
  174. }
  175. .billing-info-wrap .checkout-account input {
  176. border: 1px solid #e6e6e6;
  177. display: inline-block;
  178. float: left;
  179. height: 12px;
  180. width: 12px;
  181. margin-top: 7px;
  182. cursor: pointer;
  183. }
  184. .billing-info-wrap .checkout-account-toggle input {
  185. background: transparent none repeat scroll 0 0;
  186. border: 1px solid #e6e6e6;
  187. color: #666;
  188. font-size: 14px;
  189. padding-left: 20px;
  190. padding-right: 10px;
  191. margin: 0 0 20px;
  192. width: 100%;
  193. height: 45px;
  194. outline: none;
  195. }
  196. .billing-info-wrap .additional-info-wrap h4 {
  197. font-size: 16px;
  198. font-weight: 700;
  199. color: $color-dark;
  200. margin: 0 0 10px;
  201. }
  202. .billing-info-wrap .additional-info-wrap .additional-info textarea {
  203. background: transparent none repeat scroll 0 0;
  204. border: 1px solid #e6e6e6;
  205. color: #333;
  206. font-size: 14px;
  207. height: 138px;
  208. padding: 17px 20px;
  209. width: 100%;
  210. outline: none;
  211. }
  212. .additional-info-wrap {
  213. margin: 30px 0;
  214. }
  215. .your-order-area .your-order-wrap {
  216. padding: 38px 45px 44px;
  217. @include max-screen(767) {
  218. padding: 15px;
  219. }
  220. background: #f6f6f6;
  221. }
  222. .your-order-area .your-order-wrap .your-order-product-info .your-order-top ul {
  223. display: -webkit-box;
  224. display: -ms-flexbox;
  225. display: flex;
  226. -webkit-box-pack: justify;
  227. -ms-flex-pack: justify;
  228. justify-content: space-between;
  229. }
  230. .your-order-area .your-order-wrap .your-order-product-info .your-order-top ul li {
  231. font-size: 15px;
  232. font-weight: 500;
  233. list-style: outside none none;
  234. color: $color-dark;
  235. }
  236. .your-order-area .your-order-wrap .your-order-product-info .your-order-middle {
  237. border-bottom: 1px solid #dee0e4;
  238. border-top: 1px solid #dee0e4;
  239. margin: 29px 0;
  240. padding: 19px 0 18px;
  241. }
  242. .your-order-area .your-order-wrap .your-order-product-info .your-order-middle ul li {
  243. display: -webkit-box;
  244. display: -ms-flexbox;
  245. display: flex;
  246. -webkit-box-pack: justify;
  247. -ms-flex-pack: justify;
  248. justify-content: space-between;
  249. margin: 0 0 10px;
  250. }
  251. .your-order-area .your-order-wrap .your-order-product-info .your-order-bottom ul {
  252. -webkit-box-align: center;
  253. -ms-flex-align: center;
  254. align-items: center;
  255. display: -webkit-box;
  256. display: -ms-flexbox;
  257. display: flex;
  258. -webkit-box-pack: justify;
  259. -ms-flex-pack: justify;
  260. justify-content: space-between;
  261. }
  262. .your-order-area .your-order-wrap .your-order-product-info .your-order-bottom ul li.your-order-shipping {
  263. font-size: 15px;
  264. color: $color-dark;
  265. font-weight: 500;
  266. }
  267. .your-order-area .your-order-wrap .your-order-product-info .your-order-total {
  268. border-bottom: 1px solid #dee0e4;
  269. border-top: 1px solid #dee0e4;
  270. margin: 18px 0 33px;
  271. padding: 17px 0 19px;
  272. }
  273. .your-order-area .your-order-wrap .your-order-product-info .your-order-total ul {
  274. -webkit-box-align: center;
  275. -ms-flex-align: center;
  276. align-items: center;
  277. display: -webkit-box;
  278. display: -ms-flexbox;
  279. display: flex;
  280. -webkit-box-pack: justify;
  281. -ms-flex-pack: justify;
  282. justify-content: space-between;
  283. }
  284. .your-order-area .your-order-wrap .your-order-product-info .your-order-total ul li.order-total {
  285. font-weight: 500;
  286. color: $color-dark;
  287. font-size: 15px;
  288. }
  289. .your-order-area .your-order-wrap .your-order-product-info .your-order-total ul li {
  290. font-weight: 600;
  291. color: $theme-color;
  292. font-size: 16px;
  293. list-style: outside none none;
  294. }
  295. .your-order-area .payment-accordion:last-child {
  296. margin: 0 0 0;
  297. }
  298. .your-order-area .payment-accordion {
  299. margin: 0 0 16px;
  300. }
  301. .your-order-area .payment-accordion {
  302. margin: 0 0 16px;
  303. }
  304. .your-order-area .payment-accordion h4 a {
  305. color: $color-dark;
  306. font-size: 16px;
  307. margin: 0;
  308. font-weight: 500;
  309. }
  310. .your-order-area .payment-accordion .panel-body {
  311. padding: 5px 0 0 0;
  312. }
  313. .your-order-area .payment-accordion .panel-body p {
  314. padding: 0 0 0 10px;
  315. }
  316. .Place-order {
  317. margin-top: 25px;
  318. }
  319. .open-toggle,
  320. .open-toggle2 {
  321. display: none;
  322. }
  323. .single-my-account h3.panel-title {
  324. background-color: #f9f9f9;
  325. border-bottom: 1px solid #ebebeb;
  326. color: $color-dark;
  327. font-size: 14px;
  328. font-weight: 700;
  329. margin: 0;
  330. position: relative;
  331. text-transform: uppercase;
  332. line-height: 2;
  333. }
  334. .single-my-account h3.panel-title span {
  335. color: $color-dark;
  336. font-size: 14px;
  337. left: 20px;
  338. position: absolute;
  339. top: 16px;
  340. }
  341. .single-my-account h3.panel-title a {
  342. color: $color-dark;
  343. display: block;
  344. padding: 16px 55px;
  345. position: relative;
  346. }
  347. .single-my-account h3.panel-title a:hover {
  348. color: $theme-color;
  349. }
  350. .single-my-account h3.panel-title a:hover::before {
  351. color: $theme-color;
  352. }
  353. .single-my-account h3.panel-title a::before {
  354. color: #000;
  355. content: "\f3d0";
  356. display: inline-block;
  357. font-family: "Ionicons";
  358. font-size: 14px;
  359. position: absolute;
  360. right: 10px;
  361. top: 50%;
  362. margin-top: -14px;
  363. }
  364. .single-my-account .myaccount-info-wrapper {
  365. padding: 30px 20px;
  366. background-color: #fff;
  367. }
  368. .single-my-account .myaccount-info-wrapper .account-info-wrapper {
  369. border-bottom: 1px solid #eaeaea;
  370. margin-bottom: 28px;
  371. padding-bottom: 30px;
  372. }
  373. .single-my-account .myaccount-info-wrapper .account-info-wrapper h4 {
  374. font-size: 14px;
  375. margin: 0;
  376. text-transform: uppercase;
  377. color: $color-dark;
  378. font-weight: 700;
  379. }
  380. .single-my-account .myaccount-info-wrapper .account-info-wrapper h5 {
  381. font-size: 14px;
  382. letter-spacing: 0.2px;
  383. margin-top: 7px;
  384. font-weight: 600;
  385. color: $color-dark;
  386. }
  387. .single-my-account .myaccount-info-wrapper .billing-info {
  388. margin-bottom: 20px;
  389. }
  390. .single-my-account .myaccount-info-wrapper .billing-info label {
  391. color: #666;
  392. font-size: 14px;
  393. text-transform: capitalize;
  394. }
  395. .single-my-account .myaccount-info-wrapper .billing-info input {
  396. background: transparent none repeat scroll 0 0;
  397. border: 1px solid #ebebeb;
  398. color: #666;
  399. height: 40px;
  400. padding: 0 15px;
  401. width: 100%;
  402. outline: none;
  403. }
  404. .single-my-account .myaccount-info-wrapper .billing-back-btn {
  405. display: -webkit-box;
  406. display: -ms-flexbox;
  407. display: flex;
  408. -webkit-box-pack: justify;
  409. -ms-flex-pack: justify;
  410. justify-content: space-between;
  411. margin-top: 26px;
  412. -webkit-box-align: center;
  413. -ms-flex-align: center;
  414. align-items: center;
  415. }
  416. .single-my-account .myaccount-info-wrapper .billing-back-btn .billing-back a {
  417. color: $color-dark;
  418. display: inline-block;
  419. font-size: 14px;
  420. font-weight: 700;
  421. text-transform: uppercase;
  422. }
  423. .single-my-account .myaccount-info-wrapper .billing-back-btn .billing-back a:hover {
  424. color: $theme-color;
  425. }
  426. .single-my-account .myaccount-info-wrapper .billing-back-btn .billing-back a i {
  427. font-size: 15px;
  428. color: $theme-color;
  429. }
  430. .single-my-account .myaccount-info-wrapper .entries-wrapper .entries-info {
  431. padding: 30px 20px;
  432. }
  433. .single-my-account .myaccount-info-wrapper .entries-wrapper .entries-info p {
  434. color: #666;
  435. font-size: 14px;
  436. margin: 0;
  437. text-transform: capitalize;
  438. }
  439. .single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a.edit {
  440. background-color: #0090f0;
  441. font-weight: 700;
  442. }
  443. .single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a.edit:hover {
  444. background-color: $theme-color;
  445. }
  446. .single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a:hover {
  447. background-color: $theme-color;
  448. }
  449. .single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a {
  450. background-color: #f32013;
  451. color: #fff;
  452. display: inline-block;
  453. line-height: 1;
  454. margin: 0 2px;
  455. padding: 12px 15px;
  456. text-transform: uppercase;
  457. font-weight: 700;
  458. }
  459. .single-my-account {
  460. margin-bottom: 20px;
  461. border: 1px solid #ebebeb;
  462. }
  463. .single-my-account:last-child {
  464. margin: 0;
  465. }
  466. .single-my-account .myaccount-info-wrapper .entries-wrapper {
  467. border: 1px solid #eaeaea;
  468. position: relative;
  469. }
  470. .single-my-account .myaccount-info-wrapper .entries-wrapper::before {
  471. position: absolute;
  472. content: "";
  473. height: 100%;
  474. width: 1px;
  475. left: 50%;
  476. top: 0;
  477. background-color: #eaeaea;
  478. }
  479. .login-register-wrapper .login-register-tab-list {
  480. display: -webkit-box;
  481. display: -ms-flexbox;
  482. display: flex;
  483. -webkit-box-pack: center;
  484. -ms-flex-pack: center;
  485. justify-content: center;
  486. margin-bottom: 40px;
  487. }
  488. .login-register-wrapper .login-register-tab-list a {
  489. position: relative;
  490. }
  491. .login-register-wrapper .login-register-tab-list a:last-child:before {
  492. display: none;
  493. }
  494. .login-register-wrapper .login-register-tab-list a::before {
  495. background-color: #000;
  496. bottom: 5px;
  497. content: "";
  498. height: 18px;
  499. margin: 0 auto;
  500. position: absolute;
  501. right: -2px;
  502. -webkit-transition: all 0.4s ease 0s;
  503. -o-transition: all 0.4s ease 0s;
  504. transition: all 0.4s ease 0s;
  505. width: 1px;
  506. }
  507. .login-register-wrapper .login-register-tab-list a.active h4 {
  508. color: $theme-color;
  509. }
  510. .login-register-wrapper .login-register-tab-list a h4 {
  511. font-size: 25px;
  512. font-weight: 700;
  513. margin: 0 20px;
  514. text-transform: capitalize;
  515. -webkit-transition: all 0.3s ease 0s;
  516. -o-transition: all 0.3s ease 0s;
  517. transition: all 0.3s ease 0s;
  518. color: $color-dark;
  519. }
  520. .login-register-wrapper .login-form-container {
  521. background: transparent none repeat scroll 0 0;
  522. -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  523. box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  524. padding: 80px;
  525. text-align: left;
  526. @include max-screen(768) {
  527. padding: 30px;
  528. }
  529. }
  530. .login-register-wrapper .login-form-container .login-register-form form input {
  531. background-color: transparent;
  532. border: 1px solid #ebebeb;
  533. color: #666;
  534. font-size: 14px;
  535. height: 45px;
  536. margin-bottom: 30px;
  537. padding: 0 15px;
  538. width: 100%;
  539. outline: none;
  540. }
  541. .login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn {
  542. padding: 10px 0 19px;
  543. }
  544. .login-register-wrapper .login-form-container .login-register-form form input[type="checkbox"] {
  545. height: 15px;
  546. margin: 0;
  547. position: relative;
  548. top: 1px;
  549. width: 17px;
  550. }
  551. .login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn label {
  552. color: $color-dark;
  553. font-size: 15px;
  554. font-weight: 400;
  555. }
  556. .login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn a.flote-none {
  557. float: none !important;
  558. }
  559. .login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn a {
  560. color: $color-dark;
  561. float: right;
  562. font-size: 14px;
  563. -webkit-transition: all 0.3s ease 0s;
  564. -o-transition: all 0.3s ease 0s;
  565. transition: all 0.3s ease 0s;
  566. @include max-screen(480) {
  567. float: none;
  568. }
  569. }
  570. .login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn a:hover {
  571. color: $theme-color;
  572. }
  573. .contact-map #mapid {
  574. height: 560px;
  575. }
  576. .custom-row-2 {
  577. display: -webkit-box;
  578. display: -ms-flexbox;
  579. display: flex;
  580. -ms-flex-wrap: wrap;
  581. flex-wrap: wrap;
  582. margin-right: -5px;
  583. margin-left: -5px;
  584. }
  585. .custom-row-2 div[class^="col-"] {
  586. padding-left: 5px;
  587. padding-right: 5px;
  588. }
  589. .contact-info-wrap {
  590. background-color: #f3f3f3;
  591. padding: 120px 70px 116px 90px;
  592. }
  593. .contact-info-wrap .single-contact-info {
  594. display: -webkit-box;
  595. display: -ms-flexbox;
  596. display: flex;
  597. -webkit-box-align: center;
  598. -ms-flex-align: center;
  599. align-items: center;
  600. margin-bottom: 40px;
  601. }
  602. .contact-info-wrap .single-contact-info .contact-icon {
  603. margin-right: 20px;
  604. }
  605. .contact-info-wrap .single-contact-info .contact-icon i {
  606. font-size: 20px;
  607. color: $color-dark;
  608. display: inline-block;
  609. width: 40px;
  610. height: 40px;
  611. line-height: 40px;
  612. border: 1px solid #252525;
  613. text-align: center;
  614. border-radius: 100%;
  615. -webkit-transition: all 0.3s ease 0s;
  616. -o-transition: all 0.3s ease 0s;
  617. transition: all 0.3s ease 0s;
  618. }
  619. .contact-info-wrap .single-contact-info .contact-info-dec p {
  620. line-height: 1;
  621. color: $color-dark;
  622. margin: 0 0 9px;
  623. }
  624. .contact-info-wrap .single-contact-info .contact-info-dec p a {
  625. color: $color-dark;
  626. }
  627. .contact-info-wrap .single-contact-info .contact-info-dec p a:hover {
  628. color: $theme-color;
  629. }
  630. .contact-info-wrap .single-contact-info:hover .contact-icon i {
  631. background-color: $theme-color;
  632. color: #fff;
  633. border-color: $theme-color;
  634. }
  635. .contact-social h3 {
  636. font-weight: 700;
  637. color: $color-dark;
  638. font-size: 24px;
  639. margin: 0 0 17px;
  640. line-height: 1;
  641. }
  642. .contact-social ul li a {
  643. color: #666;
  644. }
  645. .contact-social .social-info li a {
  646. margin-right: 15px;
  647. }
  648. .contact-form {
  649. background-color: #f3f3f3;
  650. padding: 35px;
  651. @include max-screen(767) {
  652. padding: 15px;
  653. }
  654. }
  655. .contact-form .contact-title h2 {
  656. font-size: 24px;
  657. font-weight: 700;
  658. color: $color-dark;
  659. line-height: 1;
  660. margin-bottom: 36px;
  661. margin-left: -10px;
  662. }
  663. .contact-form .contact-form-style input,
  664. .contact-form .contact-form-style textarea {
  665. background: transparent;
  666. border: 1px solid #c1c1c1;
  667. height: 40px;
  668. padding: 2px 14px;
  669. margin-bottom: 30px;
  670. color: #000;
  671. width: 100%;
  672. outline: none;
  673. }
  674. .contact-form p {
  675. color: #333;
  676. }
  677. .contact-form .contact-form-style textarea {
  678. padding: 20px 14px;
  679. margin-bottom: 0;
  680. height: 200px;
  681. }
  682. .contact-map {
  683. margin-bottom: 60px;
  684. }
  685. .contact-form .contact-form-style button {
  686. border: none;
  687. background-color: $theme-color;
  688. color: #fff;
  689. font-size: 14px;
  690. font-weight: 700;
  691. text-transform: uppercase;
  692. line-height: 1;
  693. padding: 15px 52px;
  694. margin-top: 33px;
  695. outline: none;
  696. -webkit-transition: all 0.3s ease 0s;
  697. -o-transition: all 0.3s ease 0s;
  698. transition: all 0.3s ease 0s;
  699. border-radius: 30px;
  700. }
  701. .contact-form .contact-form-style button:hover {
  702. background-color: $color-dark;
  703. color: #fff;
  704. }
  705. .coupon-title {
  706. font-size: 20px;
  707. text-transform: capitalize;
  708. font-weight: 600;
  709. margin: 20px 0px 15px;
  710. }
  711. .check-out-btn {
  712. padding: 14px 30px;
  713. }