Browse code

Delete rule-41 campaign

hiromipaw authored on 07/09/2017 17:54:09
Showing 1 changed files
1 1
deleted file mode 100644
... ...
@@ -1,778 +0,0 @@
1
-$yellow: #F2C45A;
2
-
3
-/* normalise.css v3 */
4
-
5
-html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,progress,video{display:inline-block;vertical-align:baseline;}audio:not([controls]){display:none;height:0;}[hidden],template{display:none;}a{background:transparent;}a:active,a:hover{outline:0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}h1{font-size:2em;margin:0.67em 0;}mark{background:#ff0;color:#000;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:1em 40px;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}pre{overflow:auto;}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em;}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;}button{overflow:visible;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}input{line-height:normal;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}textarea{overflow:auto;}optgroup{font-weight:bold;}table{border-collapse:collapse;border-spacing:0;}td,th{padding:0;}
6
-
7
-@font-face {
8
-    font-family: 'brandon_grotesque';
9
-    src: url('../fonts/brandongrotesque-regular-webfont.eot');
10
-    src: url('../fonts/brandongrotesque-regular-webfont.eot?#iefix') format('embedded-opentype'),
11
-         url('../fonts/brandongrotesque-regular-webfont.woff') format('woff'),
12
-         url('../fonts/brandongrotesque-regular-webfont.ttf') format('truetype'),
13
-         url('../fonts/brandongrotesque-regular-webfont.svg#brandon_grotesque_regularRg') format('svg');
14
-    font-weight: normal;
15
-    font-style: normal;
16
-}
17
-@font-face {
18
-    font-family: 'brandon_grotesque';
19
-    src: url('../fonts/brandongrotesque-mediumitalic-webfont.eot');
20
-    src: url('../fonts/brandongrotesque-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
21
-         url('../fonts/brandongrotesque-mediumitalic-webfont.woff') format('woff'),
22
-         url('../fonts/brandongrotesque-mediumitalic-webfont.ttf') format('truetype'),
23
-         url('../fonts/brandongrotesque-mediumitalic-webfont.svg#brandon_grotesqueMdIt') format('svg');
24
-    font-weight: 500;
25
-    font-style: italic;
26
-}
27
-@font-face {
28
-    font-family: 'brandon_grotesque';
29
-    src: url('../fonts/brandongrotesque-blackitalic-webfont.eot');
30
-    src: url('../fonts/brandongrotesque-blackitalic-webfont.eot?#iefix') format('embedded-opentype'),
31
-         url('../fonts/brandongrotesque-blackitalic-webfont.woff') format('woff'),
32
-         url('../fonts/brandongrotesque-blackitalic-webfont.ttf') format('truetype'),
33
-         url('../fonts/brandongrotesque-blackitalic-webfont.svg#brandon_grotesqueblack_italic') format('svg');
34
-    font-weight: 700;
35
-    font-style: italic;
36
-}
37
-
38
-@font-face {
39
-    font-family: 'brandon_grotesque';
40
-    src: url('../fonts/brandongrotesque-black-webfont.eot');
41
-    src: url('../fonts/brandongrotesque-black-webfont.eot?#iefix') format('embedded-opentype'),
42
-         url('../fonts/brandongrotesque-black-webfont.woff') format('woff'),
43
-         url('../fonts/brandongrotesque-black-webfont.ttf') format('truetype'),
44
-         url('../fonts/brandongrotesque-black-webfont.svg#brandon_grotesqueblack') format('svg');
45
-    font-weight: 700;
46
-    font-style: normal;
47
-}
48
-
49
-
50
-
51
-/////////////////
52
-// Semantic.gs // for SCSS: http://sass-lang.com/
53
-/////////////////
54
-
55
-// Defaults which you can freely override
56
-$column-width: 60px;
57
-$gutter-width: 20px;
58
-$columns: 12;
59
-
60
-// Utility function — you should never need to modify this
61
-@function gridsystem-width($columns:$columns) {
62
-	@return ($column-width * $columns) + ($gutter-width * $columns);
63
-}
64
-
65
-// Set $total-width to 100% for a fluid layout
66
-$total-width: 100%;
67
-
68
-// Uncomment these two lines and the star-hack width/margin lines below to enable sub-pixel fix for IE6 & 7. See http://tylertate.com/blog/2012/01/05/subpixel-rounding.html
69
-// $min-width: 999999;
70
-// $correction: 0.5 / $min-width * 100;
71
-
72
-// The micro clearfix http://nicolasgallagher.com/micro-clearfix-hack/
73
-@mixin clearfix() {
74
-	*zoom:1;
75
-
76
-	&:before,
77
-	&:after {
78
-	    content:"";
79
-	    display:table;
80
-	}
81
-	&:after {
82
-	    clear:both;
83
-	}
84
-}
85
-
86
-
87
-//////////
88
-// GRID //
89
-//////////
90
-
91
-body {
92
-	width: 100%;
93
-	@include clearfix();
94
-	background: #FAFAFA;
95
-	line-height: 1.5em;
96
-	font-family: 'brandon_grotesque', Helvetica, Arial, sans-serif;
97
-	color: #666;
98
-	padding-bottom: 0;
99
-}
100
-
101
-a {
102
-	color: $yellow;
103
-	text-decoration: none;
104
-	&:hover {
105
-		text-decoration: underline;
106
-	}
107
-}
108
-
109
-@mixin row($columns:$columns) {
110
-	display: block;
111
-	width: $total-width*(($gutter-width + gridsystem-width($columns))/gridsystem-width($columns));
112
-	margin: 0 $total-width*((($gutter-width*.5)/gridsystem-width($columns))*-1);
113
-	// *width: $total-width*(($gutter-width + gridsystem-width($columns))/gridsystem-width($columns))-$correction;
114
-	// *margin: 0 $total-width*((($gutter-width*.5)/gridsystem-width($columns))*-1)-$correction;
115
-	@include clearfix();
116
-}
117
-@mixin column($x,$columns:$columns) {
118
-	display: inline;
119
-	float: left;
120
-	width: $total-width*(((($gutter-width+$column-width)*$x)-$gutter-width) / gridsystem-width($columns));
121
-	margin: 0 $total-width*(($gutter-width*.5)/gridsystem-width($columns));
122
-	// *width: $total-width*(((($gutter-width+$column-width)*$x)-$gutter-width) / gridsystem-width($columns))-$correction;
123
-	// *margin: 0 $total-width*(($gutter-width*.5)/gridsystem-width($columns))-$correction;
124
-}
125
-@mixin push($offset:1) {
126
-	margin-left: $total-width*((($gutter-width+$column-width)*$offset) / gridsystem-width($columns)) + $total-width*(($gutter-width*.5)/gridsystem-width($columns));
127
-}
128
-@mixin pull($offset:1) {
129
-	margin-right: $total-width*((($gutter-width+$column-width)*$offset) / gridsystem-width($columns)) + $total-width*(($gutter-width*.5)/gridsystem-width($columns));
130
-}
131
-
132
-
133
-/* CSS START */
134
-
135
-header {
136
-	background: #000;
137
-	width: 100%;
138
-	line-height: 0;
139
-	padding: 1em 0;	
140
-	h1 {
141
-		margin: 0;
142
-		max-width: 748px;
143
-		margin: 0 auto;
144
-		padding: 0 2em;
145
-		font-size: 1em;
146
-	}
147
-	h1 span {
148
-		font-size: 0em;
149
-	}
150
-	img {
151
-		height: auto;
152
-		width: 100%;
153
-		margin: 0 auto;
154
-		display: block;
155
-	}
156
-}
157
-
158
-
159
-
160
-form, section {
161
-	max-width: 768px;
162
-	margin: 0 auto;
163
-	padding: 1em 2em;
164
-}
165
-
166
-form {
167
-	padding-top: 0;
168
-	h2 {
169
-		text-transform: uppercase;
170
-		font-weight: bold;
171
-		letter-spacing: 0.1em;
172
-		font-style: italic;
173
-		padding-top: 1em;
174
-		border-top: 1px solid #EEE;
175
-		color: #333;
176
-		font-size: 1.2em;
177
-		margin-bottom: 0.5em;
178
-	}
179
-	fieldset {
180
-		display: block;
181
-		@include column(6);
182
-		border: none;
183
-		padding: 0;
184
-		padding-bottom: 1em;
185
-		label {
186
-			padding-top: 2em;
187
-		}
188
-	}
189
-	input {
190
-		border: 1px solid #AAA;
191
-		padding: 0.5em 2.5%;
192
-		line-height: 1em;
193
-		width: 95%;
194
-		font-size: 0.9em;
195
-	}
196
-}
197
-
198
-
199
-label, h3 {
200
-	text-transform: uppercase;
201
-	font-weight: bold;
202
-	display: block;
203
-	padding: 0.5em 0;
204
-	padding-top: 1em;
205
-	font-size: 0.9em;
206
-	line-height: 1em;
207
-	color: #555;
208
-	font-style: italic;
209
-	letter-spacing: 0.1em;
210
-}
211
-
212
-.popover-content {
213
-padding: 9px 14px;
214
-}
215
-.popover {
216
-text-align: left;
217
-white-space: normal;
218
-}
219
-.popover.top {
220
-margin-top: -10px;
221
-}
222
-.fade.in {
223
-opacity: 1;
224
-}
225
-span.popovertext {
226
-cursor:hand;
227
-cursor: pointer;
228
-color: #F2C45A;
229
-}
230
-.popover {
231
-text-align: left;
232
-white-space: normal;
233
-}
234
-.popover {
235
-position: absolute;
236
-top: 0;
237
-left: 0;
238
-z-index: 1010;
239
-display: none;
240
-max-width: 276px;
241
-padding: 1px;
242
-text-align: left;
243
-background-color: #fff;
244
-background-clip: padding-box;
245
-border: 1px solid #ccc;
246
-border: 1px solid rgba(0,0,0,0.2);
247
-border-radius: 6px;
248
--webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
249
-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
250
-white-space: normal;
251
-}
252
-.fade {
253
-opacity: 0;
254
--webkit-transition: opacity .15s linear;
255
-transition: opacity .15s linear;
256
-}
257
-.popover.top .arrow {
258
-left: 50%;
259
-margin-left: -11px;
260
-border-bottom-width: 0;
261
-border-top-color: #999;
262
-border-top-color: rgba(0,0,0,0.25);
263
-bottom: -11px;
264
-}
265
-.popover .arrow {
266
-border-width: 11px;
267
-}
268
-.popover .arrow, .popover .arrow:after {
269
-position: absolute;
270
-display: block;
271
-width: 0;
272
-height: 0;
273
-border-color: transparent;
274
-border-style: solid;
275
-}
276
-a:hover {
277
-text-decoration:none;
278
-}
279
-
280
-	div#content {
281
-		@include column(7);
282
-		p {
283
-			font-weight: bold;
284
-			text-transform: uppercase;
285
-			font-size: 0.9em;
286
-			line-height: 1em;
287
-		}
288
-		textarea {
289
-			-moz-box-shadow: inset 0 1px 2px #000;
290
-			border: 1px solid #AAA;
291
-			background: #FFF;
292
-			padding: 2.5%;
293
-			height: 500px;
294
-			display: block;
295
-			width: 95%;
296
-		}
297
-		input#email-checkbox {
298
-			width: auto;
299
-			padding: 0;
300
-			display: inline;
301
-			margin-right: 0.5em;
302
-			margin-top: 1em;
303
-		}
304
-		label {
305
-			display: inline;
306
-			text-transform: none;
307
-			font-weight: normal;
308
-			letter-spacing: normal;
309
-			font-size: 1.1em;
310
-			font-style: normal;
311
-		}
312
-		input.cta-button {
313
-			padding: 0.5em 0;
314
-		}
315
-		#read-more {
316
-			text-align: center;
317
-			font-size: 1.25em;
318
-			font-style: italic;
319
-			display: block;
320
-			padding-top: 0;
321
-			padding-bottom: 0.75em;
322
-			margin-bottom: 1em;
323
-			text-align: center;
324
-			border-bottom: 1px solid #EEE;
325
-		}
326
-	}
327
-
328
-		.cta-button, input.cta-button {
329
-			font-weight: bold;
330
-			display: block;
331
-			background: $yellow;
332
-			color: #333;
333
-			padding: 0.75em 0;
334
-			letter-spacing: 0.1em;
335
-			font-size: 1.25em;
336
-			display: block;
337
-			font-style: italic;
338
-			text-align: center;
339
-			text-decoration: none;
340
-			text-transform: uppercase;
341
-			line-height: 1em;
342
-			margin: 1em 0;
343
-			width: 100%;
344
-			border: none;
345
-			border-bottom: 2px solid #EEE;
346
-			&:hover {
347
-				background: #333;
348
-				color: $yellow;
349
-			}
350
-			&:active {
351
-				background: #111;
352
-				color: darken($yellow, 10%);
353
-			}
354
-		}
355
-		
356
-
357
-aside {
358
-	@include column(5);
359
-	h3 {
360
-		padding-bottom: 0.5em;
361
-		padding-top: 0;
362
-		margin-bottom: 1.5em;
363
-		display: inline-block;
364
-		border-bottom: 2px solid #EEE;
365
-	}
366
-	p {
367
-		margin-top: 0;
368
-	}
369
-	ol {
370
-		display: block;
371
-		background: #FFF;
372
-		padding: 0.5em 1.5em;
373
-		padding-bottom: 1.5em;
374
-		list-style-type: none;
375
-		border-bottom: 3px solid #EEE;
376
-		li {
377
-			margin-bottom: 1.5em;
378
-			&:last-child {
379
-				padding:0;
380
-				margin: 0;
381
-				border: 0;
382
-			}
383
-			h4 {
384
-				margin: 0;
385
-				color: #333;
386
-			}
387
-		}
388
-	}
389
-	
390
-}
391
-
392
-footer {
393
-	background: #000;
394
-	width: 100%;
395
-	padding: 1em 0;
396
-	clear: both;
397
-	div {
398
-		max-width: 768px;
399
-		padding: 0 2em;
400
-		margin: 0 auto;
401
-		@include clearfix;
402
-		p {
403
-			float: left;
404
-			width: 51%;
405
-			margin: 0;
406
-			font-size: 0.85em;
407
-			color: #FFF;
408
-			line-height: 1.2em;
409
-		}
410
-		i {
411
-			float: right;
412
-			display: inline-block;
413
-			vertical-align: middle;
414
-		}
415
-	}
416
-}
417
-
418
-/* Call Page */
419
-.call {
420
-	div#content {
421
-		text-align: center;
422
-		max-width: 600px;
423
-		width: auto;
424
-		margin: 0 auto;
425
-		float: none;
426
-		display: block;
427
-		aside {
428
-			width: auto;
429
-			display: block;
430
-			float: none;
431
-			text-align: left;
432
-			margin-top: 2em;
433
-			font-size: 1.1em;
434
-			p {
435
-				font-style: normal;
436
-				&:last-child {
437
-					margin-bottom:0;
438
-				}
439
-			}
440
-		}
441
-		h2 {
442
-			font-weight: normal;
443
-			line-height: 1.25em;
444
-			font-size: 1.25em;
445
-		}
446
-		img {
447
-			margin-top: 1em;
448
-		}
449
-		a.cta-button {
450
-			padding-left: 0;
451
-			padding-right: 0;
452
-			width: 98%;
453
-			margin: 0 auto;
454
-		}
455
-		p {
456
-			line-height: 1.5em;
457
-			text-transform: none;
458
-			font-weight: normal;
459
-			font-style: italic;
460
-			font-size: 1.05em;
461
-			color: #777;
462
-			a {
463
-				white-space: nowrap;
464
-				text-shadow: 0 1px 3px #FFF;
465
-			}
466
-		}
467
-		ul#bill-details {
468
-			text-align: left;
469
-			padding: 0 1em;
470
-			list-style-type: none;
471
-			li {
472
-				margin-bottom: 1em;
473
-				padding-bottom: 1em;
474
-				border-bottom: 1px solid #DDD;
475
-			}
476
-			&.invisible {
477
-				display: none;
478
-			}
479
-		}
480
-	}
481
-	footer a {
482
-		opacity: 0.6;
483
-		transition: all 0.2s ease-in-out;
484
-		&.tdwfb {
485
-			opacity: 1;
486
-		}
487
-		img {
488
-			height: auto;
489
-			vertical-align: middle;
490
-			width: 171px;
491
-			&.twilio-privacy {
492
-				width: 114px;
493
-			}
494
-		}
495
-
496
-		&:hover {
497
-			opacity: 0.9;
498
-		}
499
-	}
500
-	
501
-} 
502
-
503
-/* Thank You page */
504
-
505
-.thank-you {
506
-	background: #000;
507
-	color: #EEE;
508
-	text-align: center;
509
-	font-size: 0.95em;
510
-	line-height: 1.5em;
511
-	padding-bottom: 1em;
512
-	header {
513
-		padding-bottom: 0;
514
-		h1 {
515
-			padding: 2em;
516
-			padding-bottom: 0;
517
-			max-width: 400px;
518
-		}
519
-	}
520
-	form {
521
-		padding: 0 2em;
522
-		max-width: 400px;
523
-	}
524
-	input {
525
-		margin: 0;
526
-		width: 92%;
527
-		padding: 1em 4%;
528
-		border: none;
529
-		line-height: normal;
530
-		color: #333;
531
-		&#submit {
532
-			padding: 0.8em 0;
533
-			width: 100%;
534
-			border: none;
535
-			margin-top: 0.15em;
536
-			margin-bottom: 1em;
537
-			font-size: 1em;
538
-			box-shadow: none;
539
-		}
540
-	}
541
-	section {
542
-		max-width: 600px;
543
-		padding-top: 0;
544
-		p {
545
-			font-size: 1.2em;
546
-			span {
547
-				display: block;
548
-			}
549
-		}
550
-		.twilio-container {
551
-			font-size: 0.8em;
552
-			img {
553
-				vertical-align: middle;
554
-			}
555
-		}
556
-	}
557
-	footer {
558
-		background: #222;
559
-	}
560
-	h2 {
561
-		text-transform: uppercase;
562
-		padding-top: 1.5em;
563
-		margin-top: 1.5em;
564
-		font-size: 1.2em;
565
-		border-top: 1px solid #333;
566
-	}
567
-	#also-call {
568
-		h2 {
569
-			padding: 0;
570
-			margin-top: 1.5em;
571
-			font-size: 1.5em;
572
-			border: none;
573
-		}
574
-		
575
-		.twilio-container a {
576
-			opacity: 0.6;
577
-			transition: all 0.2s ease-in-out;
578
-			img {
579
-				height: auto;
580
-				vertical-align: middle;
581
-				width: 171px;
582
-				&.twilio-privacy {
583
-					width: 114px;
584
-				}
585
-			}
586
-			&:hover {
587
-				opacity: 0.9;
588
-			}
589
-		}
590
-	}
591
-	a.cta-button {
592
-		display: inline-block;
593
-		width: auto;
594
-		border: none;
595
-		font-size: 0.9em;
596
-		padding: 0.8em 2em;
597
-		margin: 0;
598
-	}
599
-	i.i-logo {
600
-		margin-top: 1.5em;
601
-	}
602
-	#social {
603
-		padding-top: 2em;
604
-		margin-bottom: 1em;
605
-		text-align: center;
606
-		@include clearfix;
607
-		a {
608
-			@include column(4);
609
-		    display: inline-block;
610
-		    position: relative;
611
-		    margin: 0 auto;
612
-		    transition: 0.2s ease-in-out all;
613
-		    opacity: 0.8;
614
-		    &:hover {
615
-		    	opacity:0.95;
616
-		    }
617
-		}
618
-		.social-count:after {
619
-		    background: #FFF;
620
-		    text-transform: uppercase;
621
-		    font-style: italic;
622
-		    font-weight: bold;
623
-		    border-radius: 1px;
624
-		    top: -33px;
625
-		    color: #333;
626
-		    content: attr(count);
627
-		    display: block;
628
-		    left: 50%;
629
-		    margin-left: -32px;
630
-		    width: 54px;
631
-		    padding: 5px;
632
-		    line-height: 1em;
633
-		    text-align: center;
634
-		    position: absolute;
635
-		    white-space: nowrap;
636
-		}
637
-		.social-count:before {
638
-		    border: solid;
639
-		    border: 1px solid $yellow;
640
-		    border-color: #111 transparent;
641
-		    border-color:$yellow transparent;
642
-		    border-width: .2em .2em 0 .2em;
643
-		    top: -8px;
644
-		    content: "";
645
-		    display: block;
646
-		    left: 50%;
647
-		    margin-left: -.2em;
648
-		    position: absolute;
649
-		}
650
-		.sicon {
651
-		    width: 54px;
652
-		    height: 54px;
653
-		    margin: 0 auto;
654
-		    position: relative;
655
-		    background-color: black;
656
-		    background-image: url('../imgs/social-icons.png');
657
-		}
658
-		
659
-		#sfb {
660
-		    background-position: 66.6666% 0;
661
-		}
662
-		#stwit {
663
-		    background-position: 33.3333% 0;
664
-		}
665
-		#sgplus {
666
-		    background-position: 0% 0;
667
-		}	
668
-	}
669
-	
670
-}
671
-
672
-/* =====================================*/
673
-/* CSS Sprite */
674
-/* =====================================*/
675
-
676
-
677
-.i {
678
-    background-image: url('../imgs/image.png');
679
-    background-repeat: no-repeat;
680
-    display: block;
681
-    margin: 0 auto;
682
-}
683
-
684
-.i-email {
685
-    width: 172px;
686
-    height: 19px;
687
-    background-position: -1px -25px;
688
-    margin-top:13px;
689
-}
690
-
691
-.i-call {
692
-    width: 144px;
693
-    height: 22px;
694
-    background-position: -1px -1px;
695
-    margin-top:30px;
696
-}
697
-
698
-.i-logo {
699
-    width: 279px;
700
-    height: 30px;
701
-    background-position: -1px -46px;
702
-}
703
-
704
-/* =====================================*/
705
-/* Media Queries */
706
-/* =====================================*/
707
-
708
-@media screen and (max-width: 600px) {
709
-	body {
710
-		font-size: 0.9em;
711
-		padding: 0;
712
-	}
713
-	footer {
714
-		position: static;
715
-		text-align: center;
716
-		font-size: 0.9em;
717
-		margin-top: 2em;
718
-		div {
719
-			p {
720
-				float: none;
721
-				width: auto;
722
-				margin-bottom: 1em;
723
-				}
724
-			i {
725
-				float: none;
726
-				margin: 0 auto;
727
-			}
728
-		}
729
-	}
730
-	
731
-	
732
-	form {
733
-		padding-bottom: 2em;
734
-		}
735
-		aside {
736
-			display: none;
737
-		}
738
-		
739
-		div#content, div#content h2, .call aside {
740
-			width: auto;
741
-			float: none;
742
-			margin: 0;
743
-			display: block;
744
-		}
745
-		.call div#content img {
746
-			margin-bottom: 1em;
747
-		}
748
-		h2 {
749
-			clear: both;
750
-			display: block;
751
-		}
752
-		
753
-}
754
-@media screen and (max-width: 400px) {
755
-	form {
756
-		fieldset {
757
-			float: none;
758
-			width: auto;
759
-			margin: 0;
760
-			display: block;
761
-		}
762
-	}
763
-}
764
-
765
-@media screen and (-webkit-min-device-pixel-ratio:0) {
766
-    .thank-you input {
767
-    	padding-top: 1.2em;
768
-    }
769
-    .thank-you a.cta-button,.thank-you input#submit {
770
-        padding-top: 1em;
771
-    }
772
-    form input, div#content input.cta-button {
773
-    	padding-top: 0.8em;
774
-    }
775
-    .cta-button, input.cta-button {
776
-    	padding-top: 0.95em;
777
-    }
778
-}
779 0
\ No newline at end of file
Browse code

iAttempt at adding the rule-41 page

Sebastian Hahn authored on 19/06/2016 14:24:21
Showing 1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,778 @@
1
+$yellow: #F2C45A;
2
+
3
+/* normalise.css v3 */
4
+
5
+html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,progress,video{display:inline-block;vertical-align:baseline;}audio:not([controls]){display:none;height:0;}[hidden],template{display:none;}a{background:transparent;}a:active,a:hover{outline:0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}h1{font-size:2em;margin:0.67em 0;}mark{background:#ff0;color:#000;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:1em 40px;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}pre{overflow:auto;}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em;}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;}button{overflow:visible;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}input{line-height:normal;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}textarea{overflow:auto;}optgroup{font-weight:bold;}table{border-collapse:collapse;border-spacing:0;}td,th{padding:0;}
6
+
7
+@font-face {
8
+    font-family: 'brandon_grotesque';
9
+    src: url('../fonts/brandongrotesque-regular-webfont.eot');
10
+    src: url('../fonts/brandongrotesque-regular-webfont.eot?#iefix') format('embedded-opentype'),
11
+         url('../fonts/brandongrotesque-regular-webfont.woff') format('woff'),
12
+         url('../fonts/brandongrotesque-regular-webfont.ttf') format('truetype'),
13
+         url('../fonts/brandongrotesque-regular-webfont.svg#brandon_grotesque_regularRg') format('svg');
14
+    font-weight: normal;
15
+    font-style: normal;
16
+}
17
+@font-face {
18
+    font-family: 'brandon_grotesque';
19
+    src: url('../fonts/brandongrotesque-mediumitalic-webfont.eot');
20
+    src: url('../fonts/brandongrotesque-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
21
+         url('../fonts/brandongrotesque-mediumitalic-webfont.woff') format('woff'),
22
+         url('../fonts/brandongrotesque-mediumitalic-webfont.ttf') format('truetype'),
23
+         url('../fonts/brandongrotesque-mediumitalic-webfont.svg#brandon_grotesqueMdIt') format('svg');
24
+    font-weight: 500;
25
+    font-style: italic;
26
+}
27
+@font-face {
28
+    font-family: 'brandon_grotesque';
29
+    src: url('../fonts/brandongrotesque-blackitalic-webfont.eot');
30
+    src: url('../fonts/brandongrotesque-blackitalic-webfont.eot?#iefix') format('embedded-opentype'),
31
+         url('../fonts/brandongrotesque-blackitalic-webfont.woff') format('woff'),
32
+         url('../fonts/brandongrotesque-blackitalic-webfont.ttf') format('truetype'),
33
+         url('../fonts/brandongrotesque-blackitalic-webfont.svg#brandon_grotesqueblack_italic') format('svg');
34
+    font-weight: 700;
35
+    font-style: italic;
36
+}
37
+
38
+@font-face {
39
+    font-family: 'brandon_grotesque';
40
+    src: url('../fonts/brandongrotesque-black-webfont.eot');
41
+    src: url('../fonts/brandongrotesque-black-webfont.eot?#iefix') format('embedded-opentype'),
42
+         url('../fonts/brandongrotesque-black-webfont.woff') format('woff'),
43
+         url('../fonts/brandongrotesque-black-webfont.ttf') format('truetype'),
44
+         url('../fonts/brandongrotesque-black-webfont.svg#brandon_grotesqueblack') format('svg');
45
+    font-weight: 700;
46
+    font-style: normal;
47
+}
48
+
49
+
50
+
51
+/////////////////
52
+// Semantic.gs // for SCSS: http://sass-lang.com/
53
+/////////////////
54
+
55
+// Defaults which you can freely override
56
+$column-width: 60px;
57
+$gutter-width: 20px;
58
+$columns: 12;
59
+
60
+// Utility function — you should never need to modify this
61
+@function gridsystem-width($columns:$columns) {
62
+	@return ($column-width * $columns) + ($gutter-width * $columns);
63
+}
64
+
65
+// Set $total-width to 100% for a fluid layout
66
+$total-width: 100%;
67
+
68
+// Uncomment these two lines and the star-hack width/margin lines below to enable sub-pixel fix for IE6 & 7. See http://tylertate.com/blog/2012/01/05/subpixel-rounding.html
69
+// $min-width: 999999;
70
+// $correction: 0.5 / $min-width * 100;
71
+
72
+// The micro clearfix http://nicolasgallagher.com/micro-clearfix-hack/
73
+@mixin clearfix() {
74
+	*zoom:1;
75
+
76
+	&:before,
77
+	&:after {
78
+	    content:"";
79
+	    display:table;
80
+	}
81
+	&:after {
82
+	    clear:both;
83
+	}
84
+}
85
+
86
+
87
+//////////
88
+// GRID //
89
+//////////
90
+
91
+body {
92
+	width: 100%;
93
+	@include clearfix();
94
+	background: #FAFAFA;
95
+	line-height: 1.5em;
96
+	font-family: 'brandon_grotesque', Helvetica, Arial, sans-serif;
97
+	color: #666;
98
+	padding-bottom: 0;
99
+}
100
+
101
+a {
102
+	color: $yellow;
103
+	text-decoration: none;
104
+	&:hover {
105
+		text-decoration: underline;
106
+	}
107
+}
108
+
109
+@mixin row($columns:$columns) {
110
+	display: block;
111
+	width: $total-width*(($gutter-width + gridsystem-width($columns))/gridsystem-width($columns));
112
+	margin: 0 $total-width*((($gutter-width*.5)/gridsystem-width($columns))*-1);
113
+	// *width: $total-width*(($gutter-width + gridsystem-width($columns))/gridsystem-width($columns))-$correction;
114
+	// *margin: 0 $total-width*((($gutter-width*.5)/gridsystem-width($columns))*-1)-$correction;
115
+	@include clearfix();
116
+}
117
+@mixin column($x,$columns:$columns) {
118
+	display: inline;
119
+	float: left;
120
+	width: $total-width*(((($gutter-width+$column-width)*$x)-$gutter-width) / gridsystem-width($columns));
121
+	margin: 0 $total-width*(($gutter-width*.5)/gridsystem-width($columns));
122
+	// *width: $total-width*(((($gutter-width+$column-width)*$x)-$gutter-width) / gridsystem-width($columns))-$correction;
123
+	// *margin: 0 $total-width*(($gutter-width*.5)/gridsystem-width($columns))-$correction;
124