style-front.css 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261
  1. /*
  2. Theme Name: Captivating Theme
  3. Theme URI: http://restored316designs.com/themes
  4. Description: A mobile responsive and HTML5 feminine WordPress theme built for the Genesis Framework by Lauren Gaige of Restored 316.
  5. Author: Restored 316 Designs // Lauren Gaige
  6. Author URI: http://www.restored316designs.com/
  7. Copyright: Copyright (c) 2015, Restored 316 LLC, Released 08/09/2017
  8. Template: genesis
  9. Template Version: 2.0.1
  10. License: GPL-2.0+
  11. License URI: http://www.opensource.org/licenses/gpl-license.php
  12. */
  13. /* Front Page
  14. ---------------------------------------------------------------------------------------------------- */
  15. .front-page .blog {
  16. margin-top: 30px;
  17. }
  18. .front-page .wrap {
  19. margin: 0 auto;
  20. max-width: 1280px;
  21. }
  22. .front-page .entry-header {
  23. margin-bottom: 0;
  24. }
  25. .front-page .home-slider-overlay.widget-area h3 {
  26. margin-bottom: 30px;
  27. }
  28. .home-slider-overlay .widget-title {
  29. font-family: 'Cormorant Garamond', serif;
  30. font-style: italic;
  31. font-size: 22px;
  32. letter-spacing: 5px;
  33. color: #ae9d78;
  34. margin: 0;
  35. }
  36. .front-page .featured-content .entry {
  37. position: relative;
  38. }
  39. .front-page .content .widget-title {
  40. border-left: 15px solid #fff7e1;
  41. padding-left: 30px;
  42. font-size: 28px;
  43. font-family:'Satisfy', cursive;
  44. text-transform:none;
  45. letter-spacing:normal;
  46. }
  47. .front-page .content .widget:nth-of-type(3n+2) .widget-title {
  48. border-color: #fff4f0;
  49. }
  50. .front-page .content .widget:nth-of-type(3n+3) .widget-title {
  51. border-color: #f7f9fc;
  52. }
  53. .home-above-content .widget-wrap,
  54. .home-below-content .widget-wrap {
  55. position: relative;
  56. overflow: hidden;
  57. }
  58. .home-above-content .widget-wrap .more-from-category,
  59. .home-below-content .widget-wrap .more-from-category {
  60. position: absolute;
  61. top: 0;
  62. right: 0px;
  63. }
  64. /* Front Page Areas
  65. --------------------------------------------- */
  66. .home-featured {
  67. background: url(https://cottageatthecrossroads.com/wp-content/uploads/2018/06/400.png)repeat;
  68. background-size:100px;
  69. margin-bottom: 10px;
  70. }
  71. .home-featured .wrap {
  72. padding: 30px;
  73. }
  74. .home-featured .entry {
  75. float: left;
  76. margin-right: 2%;
  77. width: 32%;
  78. }
  79. .home-featured .featured-content .entry {
  80. margin-bottom: 0;
  81. padding: 0;
  82. }
  83. .home-above-content .entry,
  84. .home-below-content .entry {
  85. float: left;
  86. margin-right: 2%;
  87. width: 32%;
  88. }
  89. .home-above-content .widget,
  90. .home-below-content .widget {
  91. margin-bottom: 30px;
  92. }
  93. .home-featured .entry:nth-of-type(3n+3),
  94. .home-featured .widget:nth-of-type(3n+3) .entry,
  95. .home-above-content .entry:nth-of-type(3n+3),
  96. .home-below-content .entry:nth-of-type(3n+3) {
  97. margin-right: 0;
  98. }
  99. .home-featured .entry-title {
  100. font-size: 20px;
  101. text-align: center;
  102. }
  103. .home-above-content .entry-title,
  104. .home-below-content .entry-title {
  105. font-size: 20px;
  106. }
  107. .front-page .site-wide-cta {
  108. background: none;
  109. border-bottom: 1px solid #eee;
  110. border-top: 1px solid #eee;
  111. }
  112. /* Blog
  113. --------------------------------------------- */
  114. .home-blog {
  115. margin-bottom: 50px;
  116. }
  117. .home-blog .entry {
  118. float: left;
  119. width: 48.7179%;
  120. }
  121. .home-blog .entry:nth-of-type(2n+3) {
  122. margin-left: 2.5641%;
  123. }
  124. .home-blog .entry:nth-of-type(1) {
  125. width: 100%;
  126. }
  127. /* Carousel
  128. --------------------------------------------- */
  129. .home-carousel .title {
  130. background: transparent;
  131. color: #000;
  132. font-family: 'Playfair Display', serif;
  133. line-height: 24px;
  134. padding: 10px 0;
  135. font-size: 20px;
  136. text-align: left;
  137. }
  138. .home-featured .slick-list .entry,
  139. .home-above-content .slick-list .entry,
  140. .home-below-content .slick-list .entry {
  141. background: transparent;
  142. margin: 0;
  143. }
  144. .slick-slide {
  145. margin: 0 10px;
  146. }
  147. .slick-list {
  148. margin: 0;
  149. }
  150. .slick-arrow {
  151. position: absolute;
  152. top: 40%;
  153. z-index: 1;
  154. font-size: 20px;
  155. cursor: pointer;
  156. color: #333333;
  157. width: 40px;
  158. height: 40px;
  159. vertical-align: middle;
  160. }
  161. .slick-arrow:before {
  162. position: absolute;
  163. left: 16px;
  164. top: 10px;
  165. }
  166. .slick-arrow-prev {
  167. left: 0;
  168. }
  169. .slick-arrow-next {
  170. right: 0;
  171. }
  172. .slick-arrow-next:before {
  173. left: 0px;
  174. }
  175. .slick-arrow:hover {
  176. color: #55c7cf;
  177. }
  178. /* Media Queries
  179. ---------------------------------------------------------------------------------------------------- */
  180. @media only screen and (max-width: 1280px) {
  181. .front-page .wrap {
  182. width: 100%;
  183. }
  184. .site-inner {
  185. padding: 0;
  186. }
  187. }
  188. @media only screen and (max-width: 600px) {
  189. .home-featured .wrap {
  190. padding: 20px;
  191. }
  192. .home-blog .entry,
  193. .home-above-content .entry,
  194. .home-below-content .entry {
  195. float: none;
  196. width: 100%;
  197. }
  198. .home-blog .entry:nth-of-type(2n+3) {
  199. margin-left: 0;
  200. }
  201. .home-above-content .widget-wrap .more-from-category,
  202. .home-below-content .widget-wrap .more-from-category {
  203. clear: both;
  204. position: relative;
  205. text-align: right;
  206. }
  207. }