Advertisement
Guest User

Untitled

a guest
Jul 25th, 2016
73
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.18 KB | None | 0 0
  1. /*
  2. * Navigation
  3. */
  4. #header {
  5. height: 60px;
  6. }
  7.  
  8. .transparent-header #header {
  9. background-color: rgba(0,0,0,.7);
  10. }
  11. .header-inner {
  12. padding: 10px 0 8px 0px;
  13. max-width: 930px;
  14. }
  15.  
  16. @media screen and (max-width: 690px) {
  17. .header-inner {
  18. padding-left: 0px;
  19. }
  20. }
  21.  
  22. #header #logoImage {
  23. width: 135px;
  24. }
  25.  
  26. #headerNav nav a {
  27. font-family: 'GalanoClassic-Medium';
  28. letter-spacing: 0px;
  29. }
  30.  
  31. #headerNav nav a:hover {
  32. color: #2d4650 !important;
  33. }
  34.  
  35. /*
  36. * Banner image
  37. */
  38. .desc-wrapper {
  39. text-align: left;
  40. padding: 14px;
  41. }
  42.  
  43.  
  44. .transparent-header.view-list .banner-thumbnail-wrapper {
  45. padding: 330px 0 0;
  46. @media screen and (max-width: 690px) {
  47. padding-top: 140px;
  48. }
  49. }
  50. // Pre-headline
  51. .desc-wrapper p:first-child {
  52. font-family: 'GalanoClassic-Bold';
  53. text-transform: lowercase;
  54. font-size: 42px;
  55. letter-spacing: 0px;
  56. margin-bottom: -10px;
  57. }
  58. // Main headline
  59. .desc-wrapper p>strong {
  60. font-family: 'GalanoClassic-Light';
  61. font-size: 68px;
  62. letter-spacing: 0;
  63. }
  64. // Button link
  65. .desc-wrapper p:last-child>a,
  66. body:not(.collection-type-gallery).banner-button-style-outline .desc-wrapper p:last-child>a
  67. {
  68. font-size: 16px;
  69. padding: 20px;
  70. font-family: 'GalanoClassic-Medium';
  71. letter-spacing: 0.1em;
  72.  
  73. }
  74. // Button on mobile should be 16px too.
  75. @media only screen and (max-width: 640px) {
  76. body:not(.collection-type-gallery) .desc-wrapper p:last-child>a {
  77. font-size: 16px;
  78. }
  79. }
  80.  
  81.  
  82. /*
  83. * Main Typography
  84. */
  85. *
  86. {
  87. font-family: 'GalanoClassic-Regular', ', Helvetica';
  88. letter-spacing: 0;
  89. }
  90.  
  91. *, .transparent-header #header {
  92. -webkit-font-smoothing: antialiased !important;
  93. -moz-osx-font-smoothing: grayscale;
  94. }
  95.  
  96. // Text links
  97. .html-block a:not(.sqs-block-button-element) {
  98. text-decoration: none;
  99. }
  100. .html-block a:hover {
  101. text-decoration: underline;
  102. }
  103.  
  104. strong {
  105. font-family: 'GalanoClassic-Semibold';
  106. font-weight: normal;
  107. }
  108.  
  109. // Buttons
  110. body:not(.button-style-default) .sqs-editable-button, body:not(.button-style-default) .sqs-editable-button-font {
  111. font-family :'GalanoClassic-Medium';
  112. font-size: 16px;
  113. letter-spacing: 0.1em;
  114. }
  115.  
  116. h1, h2 {
  117. font-family: 'GalanoClassic-Regular';
  118. letter-spacing: 0;
  119. }
  120.  
  121. /*
  122. * Quotes
  123. */
  124. .quote-block figure {
  125. padding: 0;
  126. text-align: left;
  127. color: #2d4650;
  128. }
  129.  
  130. .quote-block .source {
  131. font-size: 16px;
  132. text-align: left;
  133. color: #ff503c;
  134. opacity: 1;
  135. }
  136.  
  137. /*
  138. * COUNTDOWN TIMER CSS
  139. */
  140.  
  141. #timer {
  142. margin: 0 auto;
  143. display: table;
  144. div {
  145. display: table-cell;
  146. // STYLE NUMBERS
  147. font-size: 50px;
  148. letter-spacing: 2px;
  149. font-weight: 500;
  150. color: #f65959;
  151. padding: 20px;
  152. border-radius: 300px;
  153. text-align: center;
  154. span {
  155. // STYLES DAYS, HOURS, MINUTES, SECONDS
  156. letter-spacing: 0px;
  157. color: #B4BAC3;
  158. font-size: 17px;
  159. margin-left: -4px;
  160. margin-top: 16px;
  161. display: block;
  162. }
  163. }
  164. }
  165. @media (max-width : 667px) {
  166. #timer {
  167. div {
  168. padding: 16px;
  169. font-size: 26px !important;
  170. span {
  171. margin-top: 2px;
  172. font-size: 12px !important;
  173. }
  174. }
  175. }
  176. }
  177.  
  178. #cta-button-container {
  179. text-align: center !important;
  180. }
  181.  
  182.  
  183.  
  184. #cta-button {
  185. text-align: center !important;
  186. background-color: #FF4338;
  187. border-radius: 0px;
  188. position: center;
  189. -webkit-transition: .1s background-color linear;
  190. -moz-transition: .1s background-color linear;
  191. -o-transition: .1s background-color linear;
  192. transition: .1s background-color linear;
  193. padding: 25px 46px;
  194. color: #fff;
  195. border-color: #d34b27;
  196. font-size: 20px;
  197. text-transform: uppercase;
  198. letter-spacing: 1px;
  199. font-weight: 600;
  200. font-style: normal;
  201. width: 220px;
  202. }
  203.  
  204.  
  205.  
  206. #cta-button:hover {
  207. background-color: #3F5360;
  208. border-radius: 0px;
  209. position: relative;
  210. -webkit-transition: .1s background-color linear;
  211. -moz-transition: .1s background-color linear;
  212. -o-transition: .1s background-color linear;
  213. transition: .1s background-color linear;
  214. color: #FFFFFF;
  215. }
  216.  
  217. /* "Slim" theme from Tilt/Open */
  218.  
  219. .tilt_modal {
  220. max-width: 350px;
  221. }
  222.  
  223. .tilt_content {
  224. background-color: #ffffff;
  225. padding: 0px 10px 0px 10px;
  226. }
  227.  
  228. .tilt_content_bottom {
  229. border-top: none;
  230. padding-top: 0px;
  231. }
  232.  
  233. #expiration_year {
  234. margin-right: 16px;
  235. }
  236.  
  237. input {
  238. box-shadow: none;
  239. -moz-box-shadow: none;
  240. -webkit-box-shadow: none;
  241. }
  242.  
  243. @media only screen and (max-width: 479px) {
  244. #expiration_year {
  245. margin-right: 0px;
  246. }
  247. }
  248.  
  249.  
  250.  
  251. /*
  252. * Forms
  253. */
  254. label,
  255. fieldset .title{
  256. font-size: 16px;
  257. }
  258.  
  259. .form-wrapper .field-list .field .field-element {
  260. font-size: 13px;
  261. font-family: 'GalanoClassic-Regular';
  262. }
  263.  
  264. input {
  265. font-family: 'GalanoClassic-Regular';
  266. }
  267.  
  268. /*
  269. * Quote
  270. */
  271. blockquote {
  272. font-family: 'GalanoClassic-Light';
  273. }
  274. // Quotation marks
  275. .quote-block blockquote>span:first-child {
  276. display: none;
  277. }
  278. .quote-block .source {
  279. margin-left: -4px;
  280. }
  281. figcaption.source::first-letter {
  282. font-size: 0;
  283. }
  284.  
  285. // Pre-footer / Newsletter
  286. .newsletter-block .newsletter-form-body {
  287. padding: 0
  288. }
  289. .newsletter-block .newsletter-form-header-description p {
  290. margin: 0
  291. }
  292. button.newsletter-form-button.sqs-system-button.sqs-editable-button-layout.sqs-editable-button-style.sqs-editable-button-shape {
  293. vertical-align: middle;
  294. height: 50px;
  295. }
  296. input.newsletter-form-field-element {
  297. vertical-align: middle;
  298. }
  299. span.newsletter-form-button-label {
  300. font-family: GalanoClassic-Medium;
  301. font-size: 16px;
  302. letter-spacing: 0.1em;
  303. }
  304. .newsletter-block .newsletter-form-footnote p {
  305. font-family: 'GalanoClassic-Regular';
  306. font-size: 13px !important;
  307. }
  308.  
  309. /*
  310. * Footer
  311. */
  312. .footer-inner .sqs-block-html {
  313. margin-top: 5px;
  314. font-size: 13px;
  315. }
  316.  
  317. #footer .html-block a, #footer .html-block a:visited {
  318. border: none;
  319. }
  320.  
  321. /*
  322. * Page margins
  323. */
  324. // Main content
  325. .page-content, .collection-type-index .page-content, .collection-type-page #content {
  326. padding: 0px 0px 0px;
  327. max-width: 930px;
  328. }
  329.  
  330. // Non-index pages need less margin
  331. #page {
  332. padding-top: 0px;
  333. }
  334.  
  335. .sqs-block-html .sqs-block-content>h1:first-child {
  336. margin-top: 0px
  337. }
  338.  
  339. // Pre-footer
  340. .footer-inner,
  341. .pre-footer-inner {
  342. max-width: 1060px;
  343. }
  344.  
  345. .pre-footer-inner .sqs-layout {
  346. padding: 70px 0;
  347. }
  348.  
  349. @media screen and (max-width:690px) {
  350. .pre-footer-inner .sqs-layout {
  351. padding: 32px 20px;
  352. }
  353. .sqs-svg-icon--list.social-icon-alignment-right {
  354. text-align: center;
  355. }
  356. }
  357.  
  358. // Footer
  359. @media screen and (min-width: 690px) {
  360. .sqs-block-socialaccountlinks-v2 {
  361. // width: 140px;
  362. }
  363. .footer-inner {
  364. padding: 10px 0px 50px;
  365. }
  366. }
  367.  
  368. @media screen and (max-width: 690px) {
  369. .socialaccountlinks-v2-block,
  370. .sqs-block {
  371. // width: 100%;
  372. // padding: 0;
  373. }
  374. }
  375.  
  376. // Open house page
  377. #collection-56ff9218f850820e70aa96a7 #page {
  378. background-image: url('http://static1.squarespace.com/static/56c22ccdb09f95f2a778538b/t/56ffa4cb5559868c75f06aa6/1459594456138');
  379. background-size: cover;
  380. max-width: none;
  381. }
  382. #collection-56ff9218f850820e70aa96a7 #content p,
  383. #collection-56ff9218f850820e70aa96a7 label,
  384. #collection-56ff9218f850820e70aa96a7 .form-submission-text {
  385. color: white;
  386. }
  387. main#page {
  388. position: relative;
  389. padding-bottom: 0px;
  390. }
  391.  
  392. main#page div#content {
  393. padding-top: 0;
  394. }
  395.  
  396. h3{
  397. font-family: 'GalanoClassic-regular';
  398. font-size: 25px !important;
  399. text-transform: inherit;
  400. letter-spacing: 0;
  401. color: #3c6472;
  402. }
  403.  
  404.  
  405. .desc-wrapper p {
  406. font-size: 28px;
  407. text-transform: none;
  408. font-family: "GalanoClassic-Regular";
  409. letter-spacing: 0.01em;
  410. }
  411.  
  412. #page .html-block, #page .form-block, #page .map-block{
  413. padding-top: 60px;
  414. padding-bottom: 80px;
  415. max-width: 700px;
  416. margin: 0 auto;
  417. }
  418.  
  419. @media only screen and (max-width: 640px){
  420. .sqs-gallery-design-grid-slide {
  421. width: 33% !important;
  422. clear: none !important;
  423. }
  424. }
  425.  
  426. @media only screen and (max-width: 640px){
  427. #preFooter {
  428. padding: 32px 20px;
  429. }
  430. }
  431.  
  432. @media only screen and (max-width: 930px){
  433. .pre-footer-inner .sqs-layout {
  434. padding: 32px 20px;
  435. }
  436. }
  437.  
  438. @media only screen and (max-width: 800px){
  439. main#page div#content {
  440. padding: 0 !important;
  441. }
  442. }
  443. @media only screen and (max-width: 800px){
  444. .sqs-gallery-design-grid-slide {
  445. width: 33% !important;
  446. }
  447. }
  448.  
  449. @media only screen and (max-width: 800px){
  450. .sqs-block.gallery-block.sqs-block-gallery {
  451. padding: 0 !important;
  452. }
  453. }
  454.  
  455. @media only screen and (max-width: 640px){
  456.  
  457. .sqs-layout .sqs-row .sqs-block{
  458. padding-bottom: 0px !important;
  459. padding-top: 0px !important;
  460. }
  461.  
  462. .sqs-layout .sqs-row .sqs-block:last-child {
  463. padding-bottom: 0px !important;
  464. }
  465.  
  466. .sqs-layout .sqs-row .sqs-block:first-child {
  467. padding-top: 0px !important;
  468. }
  469.  
  470. .sqs-layout .sqs-row .sqs-block.html-block:last-child {
  471. padding-bottom: 17px !important;
  472. }
  473.  
  474. .sqs-layout .sqs-row .sqs-block.html-block:first-child {
  475. padding-top: 17px !important;
  476. }
  477.  
  478. }
  479.  
  480. @media only screen and (max-width: 640px){
  481. body:not(.collection-type-gallery) .desc-wrapper p>strong{
  482. font-size: 40px;
  483. }
  484. }
  485.  
  486. body{overflow-x: hidden;}
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement