zurb-foundation 4.0.0.rc1 → 4.0.0
Sign up to get free protection for your applications and to get access to all the features.
- data/Gemfile.lock +1 -1
- data/docs/_sidebar-components.html.erb +11 -11
- data/docs/_sidebar.html.erb +3 -3
- data/docs/changelog.html.erb +9 -9
- data/docs/components/block-grid.html.erb +4 -2
- data/docs/components/breadcrumbs.html.erb +4 -2
- data/docs/components/button-groups.html.erb +5 -3
- data/docs/components/buttons.html.erb +4 -2
- data/docs/components/clearing.html.erb +2 -0
- data/docs/components/custom-forms.html.erb +2 -0
- data/docs/components/dropdown-buttons.html.erb +4 -2
- data/docs/components/dropdown.html.erb +2 -0
- data/docs/components/flex-video.html.erb +2 -0
- data/docs/components/forms.html.erb +2 -0
- data/docs/components/grid.html.erb +4 -2
- data/docs/components/inline-lists.html.erb +2 -0
- data/docs/components/joyride.html.erb +2 -0
- data/docs/components/keystrokes.html.erb +2 -0
- data/docs/components/labels.html.erb +2 -0
- data/docs/components/magellan.html.erb +2 -0
- data/docs/components/orbit.html.erb +2 -0
- data/docs/components/pagination.html.erb +4 -2
- data/docs/components/panels.html.erb +2 -0
- data/docs/components/pricing-tables.html.erb +2 -0
- data/docs/components/progress-bars.html.erb +2 -0
- data/docs/components/reveal.html.erb +2 -0
- data/docs/components/section.html.erb +2 -0
- data/docs/components/side-nav.html.erb +4 -2
- data/docs/components/split-buttons.html.erb +3 -1
- data/docs/components/sub-nav.html.erb +4 -2
- data/docs/components/switch.html.erb +2 -0
- data/docs/components/tables.html.erb +2 -0
- data/docs/components/thumbnails.html.erb +2 -0
- data/docs/components/tooltips.html.erb +2 -0
- data/docs/components/top-bar.html.erb +2 -0
- data/docs/components/type.html.erb +1 -0
- data/docs/faq.html.erb +1 -1
- data/docs/index.html.erb +2 -2
- data/docs/layout.html.erb +5 -5
- data/docs/support.html.erb +2 -2
- data/lib/foundation/version.rb +1 -1
- data/templates/project/scss/app.scss +1 -1
- metadata +9 -8
- data/test/stylesheets/styles.css +0 -955
@@ -1,3 +1,5 @@
|
|
1
|
+
<% @side_nav = "nav" %>
|
2
|
+
|
1
3
|
<div class="row">
|
2
4
|
<div class="large-9 push-3 columns">
|
3
5
|
|
@@ -46,12 +48,12 @@
|
|
46
48
|
|
47
49
|
|
48
50
|
|
49
|
-
<p>For these styles to come across, make sure you have the default Foundation CSS package or that you've selected side nav from a custom package. These should be linked up following our default <a href="
|
51
|
+
<p>For these styles to come across, make sure you have the default Foundation CSS package or that you've selected side nav from a custom package. These should be linked up following our default <a href="../index.html">HTML page structure</a>.</p>
|
50
52
|
|
51
53
|
<hr>
|
52
54
|
|
53
55
|
<h3>Build with our Mixins</h3>
|
54
|
-
<p>We've included SCSS mixins used to style side nav. To use the mixin, you'll need to have the <a href="
|
56
|
+
<p>We've included SCSS mixins used to style side nav. To use the mixin, you'll need to have the <a href="../sass.html">extension installed</a> or grab <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/_foundation-global.scss">_foundation-global.scss</a> and <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/components/_side-nav.scss">_side-nav.scss</a> from Github and throw them into a Foundation folder in your project directory. From there, you can import the files at the top of your own SCSS stylesheet, like so:</p>
|
55
57
|
|
56
58
|
<%= code_example '
|
57
59
|
@import "foundation/foundation-global", "foundation/side-nav";
|
@@ -1,3 +1,5 @@
|
|
1
|
+
<% @side_nav = "buttons" %>
|
2
|
+
|
1
3
|
<div class="row">
|
2
4
|
<div class="large-9 push-3 columns">
|
3
5
|
|
@@ -51,7 +53,7 @@
|
|
51
53
|
<hr>
|
52
54
|
|
53
55
|
<h3>Build with Mixins</h3>
|
54
|
-
<p>We've included SCSS mixins used to style buttons. To use these mixins, you'll need to have the <a href="#extention-install">extension installed</a> or grab <a href="
|
56
|
+
<p>We've included SCSS mixins used to style buttons. To use these mixins, you'll need to have the <a href="#extention-install">extension installed</a> or grab <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/_foundation-global.scss">_foundation-global.scss</a>, <a href="#https://github.com/zurb/foundation/blob/master/scss/foundation/components/_buttons.scss">_buttons.scss</a> and <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/components/_split-buttons.scss">_split-buttons.scss</a> from Github and throw them into a Foundation folder in your project directory. From there, you can import the files at the top of your own SCSS stylesheet, like so:</p>
|
55
57
|
|
56
58
|
<%= code_example '
|
57
59
|
@import "foundation/foundation-global", "foundation/buttons", "foundation/split-buttons";
|
@@ -1,3 +1,5 @@
|
|
1
|
+
<% @side_nav = "nav" %>
|
2
|
+
|
1
3
|
<div class="row">
|
2
4
|
<div class="large-9 push-3 columns">
|
3
5
|
|
@@ -40,12 +42,12 @@
|
|
40
42
|
<dd><a href="#">Suspended</a></dd>
|
41
43
|
</dl>', :html %>
|
42
44
|
|
43
|
-
<p>To use these styles, make sure you have the default Foundation CSS package or that you've selected sub-nav from a custom package. These should be linked up following our default <a href="
|
45
|
+
<p>To use these styles, make sure you have the default Foundation CSS package or that you've selected sub-nav from a custom package. These should be linked up following our default <a href="../index.html">HTML page structure</a>.</p>
|
44
46
|
|
45
47
|
<hr>
|
46
48
|
|
47
49
|
<h3>Build with our Mixins</h3>
|
48
|
-
<p>We've included SCSS mixins used to style sub-nav. To use the mixin, you'll need to have the <a href="
|
50
|
+
<p>We've included SCSS mixins used to style sub-nav. To use the mixin, you'll need to have the <a href="../sass.html">extension installed</a> or grab <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/_foundation-global.scss">_foundation-global.scss</a> and <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/components/_sub-nav.scss">_sub-nav.scss</a> from Github and throw them into a Foundation folder in your project directory. From there, you can import the files at the top of your own SCSS stylesheet, like so:</p>
|
49
51
|
|
50
52
|
<%= code_example '
|
51
53
|
@import "foundation/foundation-global", "foundation/sub-nav";
|
data/docs/faq.html.erb
CHANGED
@@ -22,7 +22,7 @@
|
|
22
22
|
<p>We try and be comprehensive in our testing, but there are thousands of devices so it's often just not feasible. We'd love to hear about Foundation's behaviour on other devices, but the list above is what we test each release on. If your browser or device is not listed your results may vary.</p>
|
23
23
|
|
24
24
|
<h4>Where can I find the Foundation 3 docs?</h4>
|
25
|
-
<p>For those of you still working on Foundation
|
25
|
+
<p>For those of you still working on Foundation 3 sites, or who need to continue supporting IE8 with Foundation, we keep the Foundation 3 docs available. <a href="old-docs/f3">View the Foundation 3 Docs →</a></p>
|
26
26
|
|
27
27
|
<hr>
|
28
28
|
|
data/docs/index.html.erb
CHANGED
@@ -116,7 +116,7 @@
|
|
116
116
|
<hr>
|
117
117
|
|
118
118
|
<h3>How is a project structured?</h3>
|
119
|
-
<h5 class="subheader">We follow common patterns for directory structure that are logical and easily maintained. Below is an explanation of each file you'll get when you create a project using our gem or download via our <a href="/
|
119
|
+
<h5 class="subheader">We follow common patterns for directory structure that are logical and easily maintained. Below is an explanation of each file you'll get when you create a project using our gem or download via our <a href="http://foundation.zurb.com/migration.php">customizer</a>.</h5>
|
120
120
|
|
121
121
|
<div class="row">
|
122
122
|
<div class="large-4 columns">
|
@@ -280,7 +280,7 @@
|
|
280
280
|
<h3>Get going!</h3>
|
281
281
|
<h5 class="subheader">Now that you understand the gist of what Foundation is and how it works, it's time to start a project! We've got two different ways for you to build projects with Foundation, a Compass Gem using Scss or a with plain CSS.</h5>
|
282
282
|
<a href="../sass.html" class="button">Using the Gem</a></li>
|
283
|
-
<a href="
|
283
|
+
<a href="http://foundation.zurb.com/migration.php" class="button secondary">Quickstart with CSS</a></li>
|
284
284
|
</div>
|
285
285
|
</div>
|
286
286
|
</div>
|
data/docs/layout.html.erb
CHANGED
@@ -53,7 +53,7 @@
|
|
53
53
|
<footer class="row full-width">
|
54
54
|
<div class="large-5 columns">
|
55
55
|
<h6><strong>Made by ZURB</strong></h6>
|
56
|
-
<p>Foundation is made by <a href="http://www.zurb.com/">ZURB</a>, a product design company in Campbell, California. We've put more than 14 years of experience building web products, services and websites into this framework. <a href="
|
56
|
+
<p>Foundation is made by <a href="http://www.zurb.com/">ZURB</a>, a product design company in Campbell, California. We've put more than 14 years of experience building web products, services and websites into this framework. <a href="http://foundation.zurb.com/about.php">Foundation Info and Goodies →</a></p>
|
57
57
|
</div>
|
58
58
|
|
59
59
|
<div class="large-3 columns">
|
@@ -63,7 +63,7 @@
|
|
63
63
|
|
64
64
|
<div class="large-4 columns">
|
65
65
|
<h6><strong>Need some help?</strong></h6>
|
66
|
-
<p>For answers or help visit the <a href="
|
66
|
+
<p>For answers or help visit the <a href="support.html">Support page</a>.</p>
|
67
67
|
</div>
|
68
68
|
</footer>
|
69
69
|
|
@@ -74,11 +74,11 @@
|
|
74
74
|
</div>
|
75
75
|
<div class="large-8 columns">
|
76
76
|
<ul class="inline-list right">
|
77
|
-
<li><a href="
|
78
|
-
<li><a href="
|
77
|
+
<li><a href="http://foundation.zurb.com">Home</a></li>
|
78
|
+
<li><a href="http://foundation.zurb.com/download.php">Download</a></li>
|
79
79
|
<li><a href="index.html">Docs</a></li>
|
80
80
|
<li><a href="changelog.html">Changelog</a></li>
|
81
|
-
<li><a href="
|
81
|
+
<li><a href="http://foundation.zurb.com/about.php">About</a></li>
|
82
82
|
<li><a href="http://feeds.feedburner.com/zurb/blog">Subscribe to the ZURBlog</a></li>
|
83
83
|
</ul>
|
84
84
|
</div>
|
data/docs/support.html.erb
CHANGED
@@ -112,14 +112,14 @@
|
|
112
112
|
<hr>
|
113
113
|
|
114
114
|
<h5>Upgrading from Foundation 3.x?</h5>
|
115
|
-
<p>We've written a comprehensive <a href="
|
115
|
+
<p>We've written a comprehensive <a href="http://foundation.zurb.com/migration.php">Migration Guide</a> to help you update your code for an existing or work in progress project.</p>
|
116
116
|
|
117
117
|
<hr />
|
118
118
|
|
119
119
|
<div class="panel">
|
120
120
|
<h4>Get Answers</h4>
|
121
121
|
<h5 class="subheader">We've outlined some of the most common frequently asked questions so that you can easily find the answer, as well as given you a way to contact us directly with questions, feedback or concerns.</h5>
|
122
|
-
<a class="button" href="faq.
|
122
|
+
<a class="button" href="faq.html">Read the FAQ or Ask a Question »</a> <a class="secondary button" href="changelog.html">See the Version Changelog »</a>
|
123
123
|
</div>
|
124
124
|
|
125
125
|
</div>
|
data/lib/foundation/version.rb
CHANGED
metadata
CHANGED
@@ -1,8 +1,8 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: zurb-foundation
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 4.0.0
|
5
|
-
prerelease:
|
4
|
+
version: 4.0.0
|
5
|
+
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
8
8
|
- ZURB
|
@@ -214,7 +214,6 @@ files:
|
|
214
214
|
- templates/project/scss/app.scss
|
215
215
|
- templates/project/scss/normalize.scss
|
216
216
|
- templates/upgrade/manifest.rb
|
217
|
-
- test/stylesheets/styles.css
|
218
217
|
homepage: http://foundation.zurb.com
|
219
218
|
licenses: []
|
220
219
|
post_install_message:
|
@@ -229,18 +228,20 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
229
228
|
version: '0'
|
230
229
|
segments:
|
231
230
|
- 0
|
232
|
-
hash:
|
231
|
+
hash: 2914621637057799271
|
233
232
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
234
233
|
none: false
|
235
234
|
requirements:
|
236
|
-
- - ! '
|
235
|
+
- - ! '>='
|
237
236
|
- !ruby/object:Gem::Version
|
238
|
-
version:
|
237
|
+
version: '0'
|
238
|
+
segments:
|
239
|
+
- 0
|
240
|
+
hash: 2914621637057799271
|
239
241
|
requirements: []
|
240
242
|
rubyforge_project:
|
241
243
|
rubygems_version: 1.8.23
|
242
244
|
signing_key:
|
243
245
|
specification_version: 3
|
244
246
|
summary: ZURB Foundation on Sass/Compass
|
245
|
-
test_files:
|
246
|
-
- test/stylesheets/styles.css
|
247
|
+
test_files: []
|
data/test/stylesheets/styles.css
DELETED
@@ -1,955 +0,0 @@
|
|
1
|
-
/* Requires: normalize.css */
|
2
|
-
/* Global Reset & Standards ---------------------- */
|
3
|
-
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
|
4
|
-
|
5
|
-
html { font-size: 100%; }
|
6
|
-
|
7
|
-
body { margin: 0; padding: 0; background: white; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.25em; line-height: 1; color: #222222; position: relative; -webkit-font-smoothing: antialiased; }
|
8
|
-
|
9
|
-
@media only screen and (min-width: 48em) { body { font-size: 1em; } }
|
10
|
-
/* Links ---------------------- */
|
11
|
-
a img { border: none; }
|
12
|
-
|
13
|
-
a { color: #2ba6cb; text-decoration: none; line-height: inherit; }
|
14
|
-
|
15
|
-
a:hover { color: #2795b6; }
|
16
|
-
|
17
|
-
a:focus { color: #2795b6; }
|
18
|
-
|
19
|
-
p a, p a:visited { line-height: inherit; }
|
20
|
-
|
21
|
-
/* Misc ---------------------- */
|
22
|
-
.left { float: left; }
|
23
|
-
|
24
|
-
.right { float: right; }
|
25
|
-
|
26
|
-
.text-left { text-align: left; }
|
27
|
-
|
28
|
-
.text-right { text-align: right; }
|
29
|
-
|
30
|
-
.text-center { text-align: center; }
|
31
|
-
|
32
|
-
.hide { display: none; }
|
33
|
-
|
34
|
-
.hide-override { display: none !important; }
|
35
|
-
|
36
|
-
.highlight { background: #ffff99; }
|
37
|
-
|
38
|
-
/* Reset for strange margins by default on <figure> elements */
|
39
|
-
figure { margin: 0; }
|
40
|
-
|
41
|
-
/* Base Type Styles Using Modular Scale ---------------------- */
|
42
|
-
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; font-size: 1em; direction: ltr; }
|
43
|
-
|
44
|
-
p { font-family: inherit; font-weight: normal; font-size: 1em; line-height: 1.6; margin-bottom: 1.05041em; }
|
45
|
-
p.lead { font-size: 1.25em; line-height: 1.6; margin-bottom: 1.05041em; }
|
46
|
-
|
47
|
-
aside p { font-size: 0em; line-height: 1.35; font-style: italic; }
|
48
|
-
|
49
|
-
h1, h2, h3, h4, h5, h6 { font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: bold; font-style: normal; color: #222222; text-rendering: optimizeLegibility; line-height: 1.1; margin-bottom: 1em; margin-top: 1em; }
|
50
|
-
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-size: 60%; color: #6f6f6f; line-height: 0; }
|
51
|
-
|
52
|
-
h1 { font-size: 2.75em; }
|
53
|
-
|
54
|
-
h2 { font-size: 2.61803em; }
|
55
|
-
|
56
|
-
h3 { font-size: 1.69959em; }
|
57
|
-
|
58
|
-
h4 { font-size: 1.61803em; }
|
59
|
-
|
60
|
-
h5 { font-size: 1.05041em; }
|
61
|
-
|
62
|
-
h6 { font-size: 1em; }
|
63
|
-
|
64
|
-
hr { border: solid #dddddd; border-width: 1px 0 0; clear: both; margin: 22px 0 21px; height: 0; }
|
65
|
-
|
66
|
-
.subheader { line-height: 1.3; color: #6f6f6f; font-weight: 300; margin-bottom: 1.05041em; }
|
67
|
-
|
68
|
-
em, i { font-style: italic; line-height: inherit; }
|
69
|
-
|
70
|
-
strong, b { font-weight: bold; line-height: inherit; }
|
71
|
-
|
72
|
-
small { font-size: 60%; line-height: inherit; }
|
73
|
-
|
74
|
-
code { font-weight: bold; background: #ffff99; }
|
75
|
-
|
76
|
-
/* Lists ---------------------- */
|
77
|
-
ul, ol, dl { font-size: 1em; line-height: 1.6; margin-bottom: 1.05041em; list-style-position: inside; }
|
78
|
-
|
79
|
-
ul li ul, ul li ol { margin-left: 20px; margin-bottom: 0; }
|
80
|
-
ul.square, ul.circle, ul.disc { margin-left: 1.05041em; }
|
81
|
-
ul.square { list-style-type: square; }
|
82
|
-
ul.square li ul { list-style: inherit; }
|
83
|
-
ul.circle { list-style-type: circle; }
|
84
|
-
ul.circle li ul { list-style: inherit; }
|
85
|
-
ul.disc { list-style-type: disc; }
|
86
|
-
ul.disc li ul { list-style: inherit; }
|
87
|
-
ul.no-bullet { list-style: none; }
|
88
|
-
ul.large li { line-height: 21px; }
|
89
|
-
|
90
|
-
ol { margin-left: 20px; }
|
91
|
-
ol li ul, ol li ol { margin-left: 20px; margin-bottom: 0; }
|
92
|
-
|
93
|
-
/* Blockquotes ---------------------- */
|
94
|
-
blockquote, blockquote p { line-height: 1.5; color: #6f6f6f; }
|
95
|
-
|
96
|
-
blockquote { margin: 0 0 1.05041em; padding: 9px 20px 0 19px; border-left: 1px solid #dddddd; }
|
97
|
-
blockquote cite { display: block; font-size: 0em; color: #555555; }
|
98
|
-
blockquote cite:before { content: "\2014 \0020"; }
|
99
|
-
blockquote cite a, blockquote cite a:visited { color: #555555; }
|
100
|
-
|
101
|
-
abbr, acronym { text-transform: uppercase; font-size: 90%; color: #222222; border-bottom: 1px solid #dddddd; cursor: help; }
|
102
|
-
|
103
|
-
abbr { text-transform: none; }
|
104
|
-
|
105
|
-
/* Print styles. Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/ Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com)
|
106
|
-
*/
|
107
|
-
.print-only { display: none !important; }
|
108
|
-
|
109
|
-
@media print { * { background: transparent !important; color: black !important; box-shadow: none !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; }
|
110
|
-
/* Black prints faster: h5bp.com/s */
|
111
|
-
a, a:visited { text-decoration: underline; }
|
112
|
-
a[href]:after { content: " (" attr(href) ")"; }
|
113
|
-
abbr[title]:after { content: " (" attr(title) ")"; }
|
114
|
-
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
|
115
|
-
/* Don't show links for images, or javascript/internal links */
|
116
|
-
pre, blockquote { border: 1px solid #999999; page-break-inside: avoid; }
|
117
|
-
thead { display: table-header-group; }
|
118
|
-
/* h5bp.com/t */
|
119
|
-
tr, img { page-break-inside: avoid; }
|
120
|
-
img { max-width: 100% !important; }
|
121
|
-
@page { margin: 0.5cm; }
|
122
|
-
p, h2, h3 { orphans: 3; widows: 3; }
|
123
|
-
h2, h3 { page-break-after: avoid; }
|
124
|
-
.hide-on-print { display: none !important; }
|
125
|
-
.print-only { display: block !important; }
|
126
|
-
.hide-for-print { display: none !important; }
|
127
|
-
.show-for-print { display: inherit !important; } }
|
128
|
-
/* Requires globals.css */
|
129
|
-
/* Standard Forms ---------------------- */
|
130
|
-
form { margin: 0 0 1.21353em; }
|
131
|
-
|
132
|
-
.row form .row { margin: 0 -0.375em; }
|
133
|
-
.row form .row .column, .row form .row .columns { padding: 0 0.375em; }
|
134
|
-
.row form .row.collapse { margin: 0; }
|
135
|
-
.row form .row.collapse .column, .row form .row.collapse .columns { padding: 0; }
|
136
|
-
|
137
|
-
label { font-size: 1em; color: #4d4d4d; cursor: pointer; display: block; font-weight: 500; margin-bottom: 3px; }
|
138
|
-
label.right { float: none; text-align: right; }
|
139
|
-
label.inline { line-height: 2.125em; margin: 0 0 0.75em 0; }
|
140
|
-
|
141
|
-
.prefix, .postfix { display: block; position: relative; z-index: 2; text-align: center; width: 100%; padding-top: 0; padding-bottom: 0; height: 2.125em; line-height: 1.125em; }
|
142
|
-
|
143
|
-
a.button.prefix, a.button.postfix { padding-left: 0; padding-right: 0; text-align: center; }
|
144
|
-
|
145
|
-
span.prefix, span.postfix { background: #f2f2f2; border: 1px solid #cccccc; }
|
146
|
-
|
147
|
-
.prefix { left: 2px; -moz-border-radius-topleft: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px; -moz-border-radius-bottomleft: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; overflow: hidden; }
|
148
|
-
|
149
|
-
.postfix { right: 2px; -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; border-top-right-radius: 2px; -moz-border-radius-bottomright: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; }
|
150
|
-
|
151
|
-
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea { background-color: white; font-family: inherit; border: 1px solid #cccccc; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.75); display: block; font-size: 14px; margin: 0 0 0.75em 0; padding: 0.375em; height: 2.125em; width: 100%; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; }
|
152
|
-
input[type="text"].oversize, input[type="password"].oversize, input[type="date"].oversize, input[type="datetime"].oversize, input[type="email"].oversize, input[type="number"].oversize, input[type="search"].oversize, input[type="tel"].oversize, input[type="time"].oversize, input[type="url"].oversize, textarea.oversize { font-size: 1.05041em; padding: -1.625em 0.375em; }
|
153
|
-
input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus { background: #fafafa; border-color: #b3b3b3; }
|
154
|
-
input[type="text"][disabled], input[type="password"][disabled], input[type="date"][disabled], input[type="datetime"][disabled], input[type="email"][disabled], input[type="number"][disabled], input[type="search"][disabled], input[type="tel"][disabled], input[type="time"][disabled], input[type="url"][disabled], textarea[disabled] { background-color: #ddd; }
|
155
|
-
|
156
|
-
textarea { height: auto; }
|
157
|
-
|
158
|
-
select { width: 100%; }
|
159
|
-
|
160
|
-
/* Fieldsets */
|
161
|
-
fieldset { border: solid 1px #dddddd; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; padding: 12px 12px 0; margin: 18px 0; }
|
162
|
-
fieldset legend { font-weight: bold; background: white; padding: 0 3px; margin: 0; margin-left: -3px; }
|
163
|
-
|
164
|
-
/* Errors */
|
165
|
-
.error input, input.error, .error textarea, textarea.error { border-color: #c60f13; background-color: rgba(198, 15, 19, 0.1); }
|
166
|
-
|
167
|
-
.error label, label.error { color: #c60f13; }
|
168
|
-
|
169
|
-
.error small, small.error { display: block; padding: 6px 4px; margin-top: -1.75em; margin-bottom: 0.75em; background: #c60f13; color: #fff; font-size: -1em; font-weight: bold; -moz-border-radius-bottomleft: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; -moz-border-radius-bottomright: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; }
|
170
|
-
|
171
|
-
.error textarea:focus, textarea.error:focus { background: #fafafa; border-color: #b3b3b3; }
|
172
|
-
|
173
|
-
/* Custom Forms ---------------------- */
|
174
|
-
form.custom { /* Custom input, disabled */ }
|
175
|
-
form.custom span.custom { display: inline-block; width: 16px; height: 16px; position: relative; top: 2px; border: solid 1px #cccccc; background: white; }
|
176
|
-
form.custom span.custom.radio { -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; border-radius: 100px; }
|
177
|
-
form.custom span.custom.checkbox:before { content: ""; display: block; line-height: 0.8; height: 14px; width: 14px; text-align: center; position: absolute; top: 0; left: 0; font-size: 14px; color: #fff; }
|
178
|
-
form.custom span.custom.radio.checked:before { content: ""; display: block; width: 8px; height: 8px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; border-radius: 100px; background: #222222; position: relative; top: 3px; left: 3px; }
|
179
|
-
form.custom span.custom.checkbox.checked:before { content: "\00d7"; color: #222222; }
|
180
|
-
form.custom div.custom.dropdown { display: block; position: relative; width: auto; height: 28px; margin-bottom: 9px; margin-top: 2px; }
|
181
|
-
form.custom div.custom.dropdown ul { overflow-y: auto; max-height: 200px; }
|
182
|
-
form.custom div.custom.dropdown a.current { display: block; width: auto; line-height: 26px; min-height: 28px; padding: 0; padding-left: 6px; padding-right: 38px; border: solid 1px #dddddd; color: #141414; background-color: white; white-space: nowrap; }
|
183
|
-
form.custom div.custom.dropdown a.selector { position: absolute; width: 27px; height: 28px; display: block; right: 0; top: 0; border: solid 1px #dddddd; }
|
184
|
-
form.custom div.custom.dropdown a.selector:after { content: ""; display: block; content: ""; display: block; width: 0; height: 0; border: solid 5px; border-color: #aaaaaa transparent transparent transparent; position: absolute; left: 50%; top: 50%; margin-top: -2px; margin-left: -5px; }
|
185
|
-
form.custom div.custom.dropdown:hover a.selector:after, form.custom div.custom.dropdown.open a.selector:after { content: ""; display: block; width: 0; height: 0; border: solid 5px; border-color: #222222 transparent transparent transparent; }
|
186
|
-
form.custom div.custom.dropdown.open ul { display: block; z-index: 10; }
|
187
|
-
form.custom div.custom.dropdown.small { width: 134px !important; }
|
188
|
-
form.custom div.custom.dropdown.medium { width: 254px !important; }
|
189
|
-
form.custom div.custom.dropdown.large { width: 434px !important; }
|
190
|
-
form.custom div.custom.dropdown.expand { width: 100% !important; }
|
191
|
-
form.custom div.custom.dropdown.open.small ul { width: 134px !important; }
|
192
|
-
form.custom div.custom.dropdown.open.medium ul { width: 254px !important; }
|
193
|
-
form.custom div.custom.dropdown.open.large ul { width: 434px !important; }
|
194
|
-
form.custom div.custom.dropdown.open.expand ul { width: 100% !important; }
|
195
|
-
form.custom div.custom.dropdown ul { position: absolute; width: auto; display: none; margin: 0; left: 0; top: 27px; margin: 0; padding: 0; background: white; background: rgba(255, 255, 255, 0.95); border: solid 1px #cccccc; }
|
196
|
-
form.custom div.custom.dropdown ul li { color: #555555; font-size: 0em; cursor: pointer; padding: 3px; padding-left: 6px; padding-right: 38px; min-height: 18px; line-height: 18px; margin: 0; white-space: nowrap; list-style: none; }
|
197
|
-
form.custom div.custom.dropdown ul li.selected { background: #cdebf5; color: black; }
|
198
|
-
form.custom div.custom.dropdown ul li.selected:after { content: "\2013"; position: absolute; right: 10px; }
|
199
|
-
form.custom div.custom.dropdown ul li:hover { background-color: #cdebf5; color: black; }
|
200
|
-
form.custom div.custom.dropdown ul li:hover:after { content: "\2013"; position: absolute; right: 10px; color: #a3dbec; }
|
201
|
-
form.custom div.custom.dropdown ul li.selected:hover { background: #cdebf5; cursor: default; color: black; }
|
202
|
-
form.custom div.custom.dropdown ul li.selected:hover:after { color: black; }
|
203
|
-
form.custom div.custom.dropdown ul.show { display: block; }
|
204
|
-
form.custom .custom.disabled { background-color: #dddddd; }
|
205
|
-
|
206
|
-
/* Correct FF custom dropdown height */
|
207
|
-
@-moz-document url-prefix() { form.custom div.custom.dropdown a.selector { height: 30px; } }
|
208
|
-
|
209
|
-
.lt-ie9 form.custom div.custom.dropdown a.selector { height: 30px; }
|
210
|
-
|
211
|
-
/* The Grid */
|
212
|
-
/* -------- */
|
213
|
-
/* Row styles: default, nested, collapse, centered */
|
214
|
-
.row { width: 100%; margin: 0 auto; max-width: 62.5em; *zoom: 1; }
|
215
|
-
.row [class*="large-"], .row [class*="small-"] { width: 100%; padding-left: 0.9375em; padding-right: 0.9375em; position: relative; }
|
216
|
-
.row .row { width: auto; max-width: none; min-width: 0; margin: 0 -0.9375em; }
|
217
|
-
.row .row.collapse { margin: 0; }
|
218
|
-
.row:before, .row:after { content: " "; display: table; }
|
219
|
-
.row:after { clear: both; }
|
220
|
-
|
221
|
-
/* Make sure images don't break the grid */
|
222
|
-
img, object, embed { max-width: 100%; height: auto; }
|
223
|
-
|
224
|
-
object, embed { height: 100%; }
|
225
|
-
|
226
|
-
img { -ms-interpolation-mode: bicubic; }
|
227
|
-
|
228
|
-
#map_canvas img, #map_canvas embed, #map_canvas object, .map_canvas img, .map_canvas embed, .map_canvas object { max-width: none !important; }
|
229
|
-
|
230
|
-
/* Mobile Grid for small devices that can handle media queries */
|
231
|
-
@media only screen and (min-width: 0.0625em) { /* Shared column styles */
|
232
|
-
.row { display: -webkit-flex; }
|
233
|
-
.row.stacked { -webkit-flex-direction: column; }
|
234
|
-
.row.stacked.flip { -webkit-flex-direction: column-reverse; }
|
235
|
-
.row.flip { -webkit-flex-direction: row-reverse; }
|
236
|
-
.row.collapse [class*="small-"] { padding: 0; }
|
237
|
-
/* Centered small rows */
|
238
|
-
.small-centered { -webkit-justify-content: center; }
|
239
|
-
/* Small column widths */
|
240
|
-
.row .small-1 { width: 8.33333%; }
|
241
|
-
.row .small-2 { width: 16.66667%; }
|
242
|
-
.row .small-3 { width: 25%; }
|
243
|
-
.row .small-4 { width: 33.33333%; }
|
244
|
-
.row .small-5 { width: 41.66667%; }
|
245
|
-
.row .small-6 { width: 50%; }
|
246
|
-
.row .small-7 { width: 58.33333%; }
|
247
|
-
.row .small-8 { width: 66.66667%; }
|
248
|
-
.row .small-9 { width: 75%; }
|
249
|
-
.row .small-10 { width: 83.33333%; }
|
250
|
-
.row .small-11 { width: 91.66667%; }
|
251
|
-
.row .small-12 { width: 100%; }
|
252
|
-
/* Offset columns */
|
253
|
-
.row .small-offset-1 { margin-left: 8.33333%; }
|
254
|
-
.row .small-offset-2 { margin-left: 16.66667%; }
|
255
|
-
.row .small-offset-3 { margin-left: 25%; }
|
256
|
-
.row .small-offset-4 { margin-left: 33.33333%; }
|
257
|
-
.row .small-offset-5 { margin-left: 41.66667%; }
|
258
|
-
.row .small-offset-6 { margin-left: 50%; }
|
259
|
-
.row .small-offset-7 { margin-left: 58.33333%; }
|
260
|
-
.row .small-offset-8 { margin-left: 66.66667%; }
|
261
|
-
.row .small-offset-9 { margin-left: 75%; }
|
262
|
-
.row .small-offset-10 { margin-left: 83.33333%; }
|
263
|
-
/* Push/Pull columns */
|
264
|
-
.small-push-2 { left: 16.66667%; }
|
265
|
-
.small-pull-2 { right: 16.66667%; }
|
266
|
-
.small-push-3 { left: 25%; }
|
267
|
-
.small-pull-3 { right: 25%; }
|
268
|
-
.small-push-4 { left: 33.33333%; }
|
269
|
-
.small-pull-4 { right: 33.33333%; }
|
270
|
-
.small-push-5 { left: 41.66667%; }
|
271
|
-
.small-pull-5 { right: 41.66667%; }
|
272
|
-
.small-push-6 { left: 50%; }
|
273
|
-
.small-pull-6 { right: 50%; }
|
274
|
-
.small-push-7 { left: 58.33333%; }
|
275
|
-
.small-pull-7 { right: 58.33333%; }
|
276
|
-
.small-push-8 { left: 66.66667%; }
|
277
|
-
.small-pull-8 { right: 66.66667%; }
|
278
|
-
.small-push-9 { left: 75%; }
|
279
|
-
.small-pull-9 { right: 75%; }
|
280
|
-
.small-push-10 { left: 83.33333%; }
|
281
|
-
.small-pull-10 { right: 83.33333%; } }
|
282
|
-
/* Normal Buttons ---------------------- */
|
283
|
-
a { border-width: 1px; border-style: solid; cursor: pointer; font-family: inherit; font-weight: bold; line-height: 1; margin: 0; position: relative; text-decoration: none; width: auto; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; -webkit-transition: background-color 0.15s ease-in-out; -moz-transition: background-color 0.15s ease-in-out; -o-transition: background-color 0.15s ease-in-out; transition: background-color 0.15s ease-in-out; }
|
284
|
-
a:active { -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset; -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset; }
|
285
|
-
|
286
|
-
a { background-color: #2ba6cb; font-size: 1em; padding-top: 10px 20px 11px; padding-right: 10px 20px 11px; padding-bottom: 10px 20px 11px; padding-left: 10px 20px 11px; text-align: center; }
|
287
|
-
|
288
|
-
.button { /* Hovers */ /* Sizes */ /* Colors */ /* Layout */ /* Disabled ---------- */ }
|
289
|
-
.button.disabled, .button[disabled] { opacity: 0.6; cursor: default; background: #2ba6cb; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
|
290
|
-
.button.disabled:hover, .button[disabled]:hover { background: #2ba6cb; }
|
291
|
-
.button.disabled.success, .button[disabled].success { background-color: #5da423; }
|
292
|
-
.button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus { background-color: #5da423; outline: none; }
|
293
|
-
.button.disabled.alert, .button[disabled].alert { background-color: #c60f13; }
|
294
|
-
.button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus { background-color: #c60f13; outline: none; }
|
295
|
-
.button.disabled.secondary, .button[disabled].secondary { background-color: #e9e9e9; }
|
296
|
-
.button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus { background-color: #e9e9e9; outline: none; }
|
297
|
-
|
298
|
-
/* Don't use native buttons on iOS */
|
299
|
-
input[type=submit].button, button.button { -webkit-appearance: none; }
|
300
|
-
|
301
|
-
/* Correct FF button padding */
|
302
|
-
@-moz-document url-prefix() { button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner { border: none; padding: 0; }
|
303
|
-
input[type="submit"].tiny.button { padding: 3px 10px 4px; }
|
304
|
-
input[type="submit"].small.button { padding: 5px 14px 6px; }
|
305
|
-
input[type="submit"].button, input[type=submit].medium.button { padding: 8px 20px 9px; }
|
306
|
-
input[type="submit"].large.button { padding: 13px 30px 14px; } }
|
307
|
-
|
308
|
-
/* Buttons with Dropdowns ---------------------- */
|
309
|
-
.button.dropdown { position: relative; padding-right: 44px; /* Sizes */ /* Triangles */ /* Flyout List */ /* Split Dropdown Buttons */ }
|
310
|
-
.button.dropdown.large { padding-right: 60px; }
|
311
|
-
.button.dropdown.small { padding-right: 28px; }
|
312
|
-
.button.dropdown.tiny { padding-right: 20px; }
|
313
|
-
.button.dropdown:after { content: ""; display: block; width: 0; height: 0; border: solid 6px; border-color: white transparent transparent transparent; position: absolute; top: 50%; right: 20px; margin-top: -2px; }
|
314
|
-
.button.dropdown.large:after { content: ""; display: block; width: 0; height: 0; border: solid 7px; border-color: white transparent transparent transparent; margin-top: -3px; right: 30px; }
|
315
|
-
.button.dropdown.small:after { content: ""; display: block; width: 0; height: 0; border: solid 5px; border-color: white transparent transparent transparent; margin-top: -2px; right: 14px; }
|
316
|
-
.button.dropdown.tiny:after { content: ""; display: block; width: 0; height: 0; border: solid 4px; border-color: white transparent transparent transparent; margin-top: -1px; right: 10px; }
|
317
|
-
.button.dropdown > ul { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; display: none; position: absolute; left: -1px; background: #fff; background: rgba(255, 255, 255, 0.95); list-style: none; margin: 0; padding: 0; border: 1px solid #cccccc; border-top: none; min-width: 100%; z-index: 40; }
|
318
|
-
.button.dropdown > ul li { width: 100%; cursor: pointer; padding: 0; min-height: 18px; line-height: 18px; margin: 0; white-space: nowrap; list-style: none; }
|
319
|
-
.button.dropdown > ul li a, .button.dropdown > ul li button { display: block; color: #555; font-size: 0em; font-weight: normal; padding: 6px 14px; text-align: left; }
|
320
|
-
.button.dropdown > ul li button { width: 100%; border: inherit; background: inherit; font-family: inherit; margin: inherit; -webkit-font-smoothing: antialiased; }
|
321
|
-
.button.dropdown > ul li:hover, .button.dropdown > ul li:focus { background-color: #e3f4f9; color: #222; }
|
322
|
-
.button.dropdown > ul li.divider { min-height: 0; padding: 0; height: 1px; margin: 4px 0; background: #ededed; }
|
323
|
-
.button.dropdown.up > ul { border-top: 1px solid #cccccc; border-bottom: none; }
|
324
|
-
.button.dropdown ul.no-hover.show-dropdown { display: block !important; }
|
325
|
-
.button.dropdown:hover > ul.no-hover { display: none; }
|
326
|
-
.button.dropdown.split { padding: 0; position: relative; /* Sizes */ /* Triangle Spans */ /* Colors */ }
|
327
|
-
.button.dropdown.split:after { display: none; }
|
328
|
-
.button.dropdown.split:hover, .button.dropdown.split:focus { background-color: #2ba6cb; }
|
329
|
-
.button.dropdown.split.alert:hover, .button.dropdown.split.alert:focus { background-color: #c60f13; }
|
330
|
-
.button.dropdown.split.success:hover, .button.dropdown.split.success:focus { background-color: #5da423; }
|
331
|
-
.button.dropdown.split.secondary:hover, .button.dropdown.split.secondary:focus { background-color: #e9e9e9; }
|
332
|
-
.button.dropdown.split > a { color: white; display: block; padding: 10px 50px 11px 20px; padding-left: 20px; padding-right: 50px; -webkit-transition: background-color 0.15s ease-in-out; -moz-transition: background-color 0.15s ease-in-out; -o-transition: background-color 0.15s ease-in-out; transition: background-color 0.15s ease-in-out; }
|
333
|
-
.button.dropdown.split > a:hover, .button.dropdown.split > a:focus { background-color: #2284a1; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; }
|
334
|
-
.button.dropdown.split.large > a { padding: 15px 75px 16px 30px; padding-left: 30px; padding-right: 75px; }
|
335
|
-
.button.dropdown.split.small > a { padding: 7px 35px 8px 14px; padding-left: 14px; padding-right: 35px; }
|
336
|
-
.button.dropdown.split.tiny > a { padding: 5px 25px 6px 10px; padding-left: 10px; padding-right: 25px; }
|
337
|
-
.button.dropdown.split > span { background-color: #2ba6cb; position: absolute; right: 0; top: 0; height: 100%; width: 30px; border-left: 1px solid #1e728c; -webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5) inset; -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5) inset; box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5) inset; -webkit-transition: background-color 0.15s ease-in-out; -moz-transition: background-color 0.15s ease-in-out; -o-transition: background-color 0.15s ease-in-out; transition: background-color 0.15s ease-in-out; }
|
338
|
-
.button.dropdown.split > span:hover, .button.dropdown.split > span:focus { background-color: #2284a1; }
|
339
|
-
.button.dropdown.split > span:after { content: ""; display: block; width: 0; height: 0; border: solid 6px; border-color: white transparent transparent transparent; position: absolute; top: 50%; left: 50%; margin-left: -6px; margin-top: -2px; }
|
340
|
-
.button.dropdown.split.secondary > span:after { content: ""; display: block; width: 0; height: 0; border: solid 6px; border-color: #1d1d1d transparent transparent transparent; }
|
341
|
-
.button.dropdown.split.large span { width: 45px; }
|
342
|
-
.button.dropdown.split.small span { width: 21px; }
|
343
|
-
.button.dropdown.split.tiny span { width: 15px; }
|
344
|
-
.button.dropdown.split.large span:after { content: ""; display: block; width: 0; height: 0; border: solid 7px; border-color: white transparent transparent transparent; margin-top: -3px; margin-left: -7px; }
|
345
|
-
.button.dropdown.split.small span:after { content: ""; display: block; width: 0; height: 0; border: solid 4px; border-color: white transparent transparent transparent; margin-top: -1px; margin-left: -4px; }
|
346
|
-
.button.dropdown.split.tiny span:after { content: ""; display: block; width: 0; height: 0; border: solid 3px; border-color: white transparent transparent transparent; margin-top: -1px; margin-left: -3px; }
|
347
|
-
.button.dropdown.split.alert > span { background-color: #c60f13; border-left-color: #7f0a0c; }
|
348
|
-
.button.dropdown.split.success > span { background-color: #5da423; border-left-color: #396516; }
|
349
|
-
.button.dropdown.split.secondary > span { background-color: #e9e9e9; border-left-color: #c3c3c3; }
|
350
|
-
.button.dropdown.split.secondary > a { color: #1d1d1d; }
|
351
|
-
.button.dropdown.split.alert > a:hover, .button.dropdown.split.alert > span:hover, .button.dropdown.split.alert > a:focus, .button.dropdown.split.alert > span:focus { background-color: #970b0e; }
|
352
|
-
.button.dropdown.split.success > a:hover, .button.dropdown.split.success > span:hover, .button.dropdown.split.success > a:focus, .button.dropdown.split.success > span:focus { background-color: #457a1a; }
|
353
|
-
.button.dropdown.split.secondary > a:hover, .button.dropdown.split.secondary > span:hover, .button.dropdown.split.secondary > a:focus, .button.dropdown.split.secondary > span:focus { background-color: #d0d0d0; }
|
354
|
-
|
355
|
-
/* Button Groups ---------------------- */
|
356
|
-
ul.button-group { list-style: none; padding: 0; margin: 0 0 12px; *zoom: 1; }
|
357
|
-
ul.button-group:before, ul.button-group:after { content: " "; display: table; }
|
358
|
-
ul.button-group:after { clear: both; }
|
359
|
-
ul.button-group li { padding: 0; margin: 0 0 0 -1px; float: left; }
|
360
|
-
ul.button-group li:first-child { margin-left: 0; }
|
361
|
-
ul.button-group.radius li .button, ul.button-group.radius li .button.radius, ul.button-group.radius li .button-rounded { -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; }
|
362
|
-
ul.button-group.radius li:first-child .button, ul.button-group.radius li:first-child .button.radius { -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; }
|
363
|
-
ul.button-group.radius li:first-child .button.rounded { -moz-border-radius-topleft: 1000px; -webkit-border-top-left-radius: 1000px; border-top-left-radius: 1000px; -moz-border-radius-bottomleft: 1000px; -webkit-border-bottom-left-radius: 1000px; border-bottom-left-radius: 1000px; }
|
364
|
-
ul.button-group.radius li:last-child .button, ul.button-group.radius li:last-child .button.radius { -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; }
|
365
|
-
ul.button-group.radius li:last-child .button.rounded { -moz-border-radius-topright: 1000px; -webkit-border-top-right-radius: 1000px; border-top-right-radius: 1000px; -moz-border-radius-bottomright: 1000px; -webkit-border-bottom-right-radius: 1000px; border-bottom-right-radius: 1000px; }
|
366
|
-
ul.button-group.even .button { width: 100%; }
|
367
|
-
ul.button-group.even.two-up li { width: 50%; }
|
368
|
-
ul.button-group.even.three-up li { width: 33.3%; }
|
369
|
-
ul.button-group.even.three-up li:first-child { width: 33.4%; }
|
370
|
-
ul.button-group.even.four-up li { width: 25%; }
|
371
|
-
ul.button-group.even.five-up li { width: 20%; }
|
372
|
-
|
373
|
-
div.button-bar { overflow: hidden; }
|
374
|
-
div.button-bar ul.button-group { float: left; margin-right: 8px; }
|
375
|
-
div.button-bar ul.button-group:last-child { margin-left: 0; }
|
376
|
-
|
377
|
-
.nav-bar { height: 40px; background: #4d4d4d; margin-left: 0; margin-top: 20px; padding: 0; }
|
378
|
-
.nav-bar > li { float: left; display: block; position: relative; padding: 0; margin: 0; border: 1px solid #333333; border-right: none; line-height: 38px; -webkit-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2) inset; -moz-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2) inset; box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2) inset; }
|
379
|
-
.nav-bar > li:first-child { -webkit-box-shadow: 0 0 0; -moz-box-shadow: 0 0 0; box-shadow: 0 0 0; }
|
380
|
-
.nav-bar > li:last-child { border-right: solid 1px #333333; -webkit-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2) inset, 1px 0 0 rgba(255, 255, 255, 0.2); -moz-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2) inset, 1px 0 0 rgba(255, 255, 255, 0.2); box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2) inset, 1px 0 0 rgba(255, 255, 255, 0.2); }
|
381
|
-
.nav-bar > li.active { background: #2ba6cb; border-color: #2284a1; }
|
382
|
-
.nav-bar > li.active > a { color: white; cursor: default; }
|
383
|
-
.nav-bar > li.active:hover { background: #2ba6cb; cursor: default; }
|
384
|
-
.nav-bar > li:hover { background: #333333; }
|
385
|
-
.nav-bar > li > a { color: #e6e6e6; }
|
386
|
-
.nav-bar > li ul { margin-bottom: 0; }
|
387
|
-
.nav-bar > li .flyout { display: none; }
|
388
|
-
.nav-bar > li.has-flyout > a:first-child { padding-right: 40px; position: relative; }
|
389
|
-
.nav-bar > li.has-flyout > a:first-child:after { content: ""; display: block; width: 0; height: 0; border: solid 4px; border-color: #e6e6e6 transparent transparent transparent; position: absolute; right: 20px; top: 17px; }
|
390
|
-
.nav-bar > li.has-flyout > a.flyout-toggle { border-left: 0 !important; position: absolute; right: 0; top: 0; padding: 20px; z-index: 2; display: block; }
|
391
|
-
.nav-bar > li.has-flyout.is-touch > a:first-child { padding-right: 55px; }
|
392
|
-
.nav-bar > li.has-flyout.is-touch > a.flyout-toggle { border-left: 1px dashed #666666; }
|
393
|
-
.nav-bar > li > a:first-child { position: relative; padding: 0 20px; display: block; text-decoration: none; font-size: 1em; }
|
394
|
-
.nav-bar > li > input { margin: 0 10px; }
|
395
|
-
.nav-bar.vertical { height: auto; margin-top: 0; }
|
396
|
-
.nav-bar.vertical > li { float: none; border-bottom: none; border-right: solid 1px #333333; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
|
397
|
-
.nav-bar.vertical > li.has-flyout > a:first-child:after { content: ""; display: block; width: 0; height: 0; border: solid 4px; border-color: transparent transparent transparent #e6e6e6; }
|
398
|
-
.nav-bar.vertical > li .flyout { left: 100%; top: -1px; }
|
399
|
-
.nav-bar.vertical > li .flyout.right { left: auto; right: 100%; }
|
400
|
-
.nav-bar.vertical > li.active { border-right: solid 1px #2284a1; }
|
401
|
-
.nav-bar.vertical > li:last-child { border-bottom: solid 1px #333333; }
|
402
|
-
|
403
|
-
.flyout { position: relative; width: 100% !important; top: auto; margin-right: -2px; border-width: 1px 1px 0 1px; background: #f2f2f2; padding: 20px; z-index: 40; -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); /* remove margin on any first-child element */ /* remove margin on last element */ }
|
404
|
-
.flyout.right { float: none; right: auto; left: -1px; }
|
405
|
-
.flyout.small, .flyout.large { width: 100% !important; }
|
406
|
-
.flyout p { line-height: 1.2; font-size: 0em; }
|
407
|
-
.flyout *:first-child { margin-top: 0; }
|
408
|
-
.flyout *:last-child { margin-bottom: 0; }
|
409
|
-
.flyout p:last-child { margin-bottom: 18px; }
|
410
|
-
.flyout.left { right: auto; left: -2px; }
|
411
|
-
.flyout.up { top: auto; bottom: 39px; }
|
412
|
-
|
413
|
-
ul.flyout, .nav-bar li ul { padding: 0; list-style: none; }
|
414
|
-
ul.flyout li, .nav-bar li ul li { border-left: solid 3px #cccccc; }
|
415
|
-
ul.flyout li a, .nav-bar li ul li a { background: #f2f2f2; border: 1px solid #e6e6e6; border-width: 1px 1px 0 0; color: #555; display: block; font-size: 1em; height: auto; line-height: 1; padding: 15px 20px; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; }
|
416
|
-
ul.flyout li a:hover, ul.flyout li a:focus, .nav-bar li ul li a:hover, .nav-bar li ul li a:focus { background: #ebebeb; color: #333; }
|
417
|
-
ul.flyout li.active, .nav-bar li ul li.active { margin-top: 0; border-top: 1px solid #4d4d4d; border-left: 4px solid #1a1a1a; }
|
418
|
-
ul.flyout li.active a, .nav-bar li ul li.active a { background: #4d4d4d; border: none; color: #fff; height: auto; margin: 0; position: static; top: 0; -webkit-box-shadow: 0 0 0; -moz-box-shadow: 0 0 0; box-shadow: 0 0 0; }
|
419
|
-
|
420
|
-
.nav-bar { height: auto; }
|
421
|
-
.nav-bar > li { float: none; display: block; border-right: none; }
|
422
|
-
.nav-bar > li > a.main { text-align: left; border-top: 1px solid #dddddd; border-right: none; }
|
423
|
-
.nav-bar > li:first-child > a.main { border-top: none; }
|
424
|
-
.nav-bar > li.has-flyout > a.flyout-toggle { position: absolute; right: 0; top: 0; padding: 22px; z-index: 2; display: block; }
|
425
|
-
.nav-bar > li.has-flyout.is-touch > a.flyout-toggle span { content: ""; width: 0; height: 0; display: block; }
|
426
|
-
.nav-bar > li.has-flyout > a.flyout-toggle:hover span { border-top-color: #141414; }
|
427
|
-
.nav-bar.vertical > li.has-flyout > .flyout { left: 0; }
|
428
|
-
|
429
|
-
/* Between Medium and Small */
|
430
|
-
@media only screen and (max-width: 1279px) and (min-width: 768px) { .touch .nav-bar li a { font-size: 0em; }
|
431
|
-
.touch .nav-bar li.has-flyout > a.flyout-toggle { padding: 20px !important; }
|
432
|
-
.touch .nav-bar li.has-flyout > a { padding-right: 36px !important; } }
|
433
|
-
/* 1280 tablet ------------ */
|
434
|
-
@media only screen and (max-device-width: 1280px) { .touch .nav-bar li.has-flyout > a { padding-right: 36px !important; } }
|
435
|
-
/* Foundation Top Bar
|
436
|
-
Requires: -jquery.foundation.topbar.js
|
437
|
-
Notes: - <nav class="top-bar"> can have .fixed added to make it stick to the top of viewport. Can add .contain-to-grid to top-bar to make it full width but content on grid. - <li class="name"> creates a branding area that can be linked to homepage - Can include text, image or both inside this <li>. - <li class="divider"> creates a divider between nav items, add margins for space - <li class="search"> Needs to hold a <form> which can use .row.collapse and pre/postfix buttons or default type="search"
|
438
|
-
*/
|
439
|
-
/* Element that controls breakpoint, no need to change this ever */
|
440
|
-
.top-bar-js-breakpoint { width: 940px !important; visibility: hidden; }
|
441
|
-
|
442
|
-
/* Wrapped around .top-bar to contain to grid width */
|
443
|
-
.contain-to-grid { width: 100%; background: #222222; }
|
444
|
-
|
445
|
-
/* Wrapped around .top-bar to make it fixed at the top */
|
446
|
-
.fixed { width: 100%; left: 0; position: fixed; top: 0; z-index: 99; }
|
447
|
-
|
448
|
-
/* <nav> */
|
449
|
-
.top-bar { background: #222222; height: 45px; line-height: 45px; margin: 0 0 30px; padding: 0; width: 100%; position: relative; /* Contain width to .row width */ /* First <ul> for branding, title, name, etc */ /* topbar global <ul> styles */ }
|
450
|
-
.contain-to-grid .top-bar { max-width: 62.5em; margin: 0 auto; }
|
451
|
-
.top-bar > ul .name h1 { line-height: 45px; margin: 0; }
|
452
|
-
.top-bar > ul .name h1 a { font-weight: bold; padding: 0 22.5px; font-size: 17px !important; }
|
453
|
-
.top-bar > ul .name img { margin-top: -5px; vertical-align: middle; }
|
454
|
-
.top-bar.expanded { height: inherit; }
|
455
|
-
.top-bar ul { margin-left: 0; display: inline; height: 45px; line-height: 45px; list-style: none; /* Main Navigation links style */ /* Left Side <ul> */ /* Right Side <ul> */ }
|
456
|
-
.top-bar ul > li { float: left; /* Dividers between navigation */ /* Put a button in an <li> but give is a class */ /* Put a search bar or text input in the bar */ /* Hide the triangle for breakpoint menu */ /* li.has-dropdown */ }
|
457
|
-
.top-bar ul > li a:not(.button) { color: white; display: block; font-size: 13px; font-weight: bold; height: 45px; line-height: 45px; padding: 0 15px; }
|
458
|
-
.top-bar ul > li:not(.name):hover, .top-bar ul > li:not(.name).active, .top-bar ul > li:not(.name):focus { background: black; }
|
459
|
-
.top-bar ul > li:not(.name):hover a, .top-bar ul > li:not(.name).active a, .top-bar ul > li:not(.name):focus a { color: #d9d9d9; }
|
460
|
-
.top-bar ul > li.divider { background: black; -webkit-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1); -moz-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1); box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1); height: 100%; margin-right: 1px; width: 1px; }
|
461
|
-
.top-bar ul > li.has-button a.button { margin: 0 11.25px; }
|
462
|
-
.top-bar ul > li.has-button:hover, .top-bar ul > li.has-button:focus { background: #222222; }
|
463
|
-
.top-bar ul > li.has-button:hover a, .top-bar ul > li.has-button:focus a { color: #fff; }
|
464
|
-
.top-bar ul > li.search { padding: 0 15px; }
|
465
|
-
.top-bar ul > li.search form { display: inline-block; margin-bottom: 0; vertical-align: middle; width: 200px; }
|
466
|
-
.top-bar ul > li.search form input[type=text] { -moz-border-radius-right0: 5px; -webkit-border-right-0-radius: 5px; border-right-0-radius: 5px; float: left; font-size: 0em; margin-top: -1px; height: 22.5px; }
|
467
|
-
.top-bar ul > li.search form input[type=text] + .button { border-left: none; -moz-border-radius-left0: 5px; -webkit-border-left-0-radius: 5px; border-left-0-radius: 5px; float: left; font-size: -1em; margin-top: -1px; padding: 5px 12px 4px; }
|
468
|
-
.top-bar ul > li.search form input[type=search] { font-size: 16px; margin-bottom: 0; }
|
469
|
-
.top-bar ul > li.search:hover, .top-bar ul > li.search:focus { background: #222222; }
|
470
|
-
.top-bar ul > li.toggle-topbar { display: none; }
|
471
|
-
.top-bar ul > li.has-dropdown { position: relative; /* Dropdown Level 2+ */ }
|
472
|
-
.top-bar ul > li.has-dropdown:hover > .dropdown, .top-bar ul > li.has-dropdown:focus > .dropdown { display: block; visibility: visible; }
|
473
|
-
.top-bar ul > li.has-dropdown a { padding-right: 33.75px; }
|
474
|
-
.top-bar ul > li.has-dropdown a:after { content: ""; display: block; width: 0; height: 0; border: solid 5px; border-color: white transparent transparent transparent; margin-right: 15px; margin-top: -2.5px; position: absolute; right: 0; top: 50%; }
|
475
|
-
.top-bar ul > li.has-dropdown .dropdown { background: #222222; left: 0; margin: 0; padding: 9px 0 0 0; position: absolute; visibility: hidden; z-index: 99; }
|
476
|
-
.top-bar ul > li.has-dropdown .dropdown li { background: #222222; line-height: 1; min-width: 100%; padding-bottom: 5px; }
|
477
|
-
.top-bar ul > li.has-dropdown .dropdown li a { color: white; font-weight: normal; height: 100%; line-height: 1; padding: 5px 17px 5px 15px; white-space: nowrap; }
|
478
|
-
.top-bar ul > li.has-dropdown .dropdown li a:after { border: none; }
|
479
|
-
.top-bar ul > li.has-dropdown .dropdown li a:hover, .top-bar ul > li.has-dropdown .dropdown li a:focus { background: #3c3c3c; }
|
480
|
-
.top-bar ul > li.has-dropdown .dropdown li label { color: #6f6f6f; font-size: -3em; font-weight: bold; margin: 0; padding-left: 15px; text-transform: uppercase; }
|
481
|
-
.top-bar ul > li.has-dropdown .dropdown li.divider { border-top: solid 1px black; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset; height: 10px; padding: 0; width: 100%; }
|
482
|
-
.top-bar ul > li.has-dropdown .dropdown li:last-child { padding-bottom: 10px; }
|
483
|
-
.top-bar ul > li.has-dropdown .dropdown li.active a { background: black; }
|
484
|
-
.top-bar ul > li.has-dropdown .dropdown li.has-dropdown > a { padding-right: 30px; }
|
485
|
-
.top-bar ul > li.has-dropdown .dropdown li.has-dropdown > a:after { border: none; content: "\00bb"; right: 5px; top: 6px; }
|
486
|
-
.top-bar ul > li.has-dropdown .dropdown li.has-dropdown .dropdown { position: absolute; left: 100%; top: 0; }
|
487
|
-
.top-bar ul > li.has-dropdown .dropdown li.has-dropdown:hover > .dropdown, .top-bar ul > li.has-dropdown .dropdown li.has-dropdown:focus > .dropdown { display: block; }
|
488
|
-
.top-bar ul.left { float: left; width: auto; margin-bottom: 0; }
|
489
|
-
.top-bar ul.right { float: right; width: auto; margin-bottom: 0; /* Dropdown Right Side Alignment */ }
|
490
|
-
.top-bar ul.right .has-dropdown .dropdown { left: auto; right: -1px; }
|
491
|
-
.top-bar ul.right .has-dropdown .dropdown li.has-dropdown > .dropdown { right: 100%; left: auto; width: 100%; }
|
492
|
-
.top-bar .js-generated { display: none; }
|
493
|
-
|
494
|
-
/* Firefox Fixes */
|
495
|
-
@-moz-document url-prefix() { .top-bar ul li .button.small { padding-bottom: 6px; }
|
496
|
-
.top-bar ul li.search form input[type=search] { font-size: 14px; height: 22px; padding: 3px; } }
|
497
|
-
|
498
|
-
/* IE8 Fixes */
|
499
|
-
.lt-ie9 .top-bar ul li a { color: white; display: block; font-weight: bold; font-size: 13px; height: 45px; line-height: 45px; padding: 0 15px; }
|
500
|
-
.lt-ie9 .top-bar ul li a.button { height: auto; line-height: 30px; margin-top: 7px; }
|
501
|
-
.lt-ie9 .top-bar ul li a:hover, .lt-ie9 .top-bar ul li a:focus { color: #cccccc; }
|
502
|
-
.lt-ie9 .top-bar ul li a img { margin-top: -5px; vertical-align: middle; }
|
503
|
-
.lt-ie9 .top-bar ul li a.active { background: #151515; color: #d9d9d9; }
|
504
|
-
|
505
|
-
.lt-ie9 .top-bar ul li.has-dropdown { padding-right: 33.75px; }
|
506
|
-
.lt-ie9 .top-bar ul li.has-dropdown > ul li { padding-right: 0; }
|
507
|
-
|
508
|
-
/* CSS for jQuery Orbit Plugin 1.4.0 Maintained for Foundation. foundation.zurb.com Free to use under the MIT license. http://www.opensource.org/licenses/mit-license.php
|
509
|
-
*/
|
510
|
-
/* Container ---------------------- */
|
511
|
-
.orbit-wrapper { width: 1px; height: 1px; position: relative; }
|
512
|
-
|
513
|
-
.orbit { width: 1px; height: 1px; position: relative; overflow: hidden; margin-bottom: 1.05041em; }
|
514
|
-
.orbit.with-bullets { margin-bottom: 40px; }
|
515
|
-
.orbit .orbit-slide { max-width: 100%; position: absolute; top: 0; left: 0; }
|
516
|
-
.orbit a.orbit-slide { border: none; line-height: 0; display: none; }
|
517
|
-
.orbit div.orbit-slide { width: 100%; height: 100%; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; }
|
518
|
-
|
519
|
-
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
|
520
|
-
/* Timer ---------------------- */
|
521
|
-
div.orbit-wrapper div.timer { width: 40px; height: 40px; overflow: hidden; position: absolute; top: 10px; right: 10px; opacity: .6; cursor: pointer; z-index: 31; }
|
522
|
-
div.orbit-wrapper span.rotator { display: block; width: 40px; height: 40px; position: absolute; top: 0; left: -20px; background: url('../../lib/assets/images/foundation/orbit/rotator-black.png?1358876660') no-repeat; z-index: 3; }
|
523
|
-
div.orbit-wrapper span.rotator.move { left: 0; }
|
524
|
-
div.orbit-wrapper span.mask { display: block; width: 20px; height: 40px; position: absolute; top: 0; right: 0; z-index: 2; overflow: hidden; }
|
525
|
-
div.orbit-wrapper span.mask.move { width: 40px; left: 0; background: url('../../lib/assets/images/foundation/orbit/timer-black.png?1358876660') repeat 0 0; }
|
526
|
-
div.orbit-wrapper span.pause { display: block; width: 40px; height: 40px; position: absolute; top: 0; left: 0; background: url('../../lib/assets/images/foundation/orbit/pause-black.png?1358876660') no-repeat; z-index: 4; opacity: 0; }
|
527
|
-
div.orbit-wrapper span.pause.active { background: url('../../lib/assets/images/foundation/orbit/pause-black.png?1358876660') no-repeat 0 -40px; }
|
528
|
-
div.orbit-wrapper div.timer:hover span.pause, div.orbit-wrapper div.timer:focus span.pause, div.orbit-wrapper span.pause.active { opacity: 1; }
|
529
|
-
|
530
|
-
/* Captions ---------------------- */
|
531
|
-
.orbit-caption { display: none; font-family: inherit; }
|
532
|
-
|
533
|
-
.orbit-wrapper .orbit-caption { background: black; background: rgba(0, 0, 0, 0.6); z-index: 30; color: white; text-align: center; padding: 7px 0; font-size: 0em; position: absolute; right: 0; bottom: 0; width: 100%; }
|
534
|
-
|
535
|
-
/* Directional Nav ---------------------- */
|
536
|
-
div.orbit-wrapper div.slider-nav { display: block; }
|
537
|
-
div.orbit-wrapper div.slider-nav span { width: 39px; height: 50px; text-indent: -9999px; position: absolute; z-index: 30; top: 50%; margin-top: -25px; cursor: pointer; }
|
538
|
-
div.orbit-wrapper div.slider-nav span.right { background: url('../../lib/assets/images/foundation/orbit/right-arrow.png?1358876660'); background-size: 100%; right: 0; }
|
539
|
-
div.orbit-wrapper div.slider-nav span.left { background: url('../../lib/assets/images/foundation/orbit/left-arrow.png?1358876660'); background-size: 100%; left: 0; }
|
540
|
-
|
541
|
-
.lt-ie9 div.orbit-wrapper div.slider-nav span.right { background: url('../../lib/assets/images/foundation/orbit/right-arrow-small.png?1358876660'); }
|
542
|
-
.lt-ie9 div.orbit-wrapper div.slider-nav span.left { background: url('../../lib/assets/images/foundation/orbit/left-arrow-small.png?1358876660'); }
|
543
|
-
|
544
|
-
/* Bullet Nav ---------------------- */
|
545
|
-
ul.orbit-bullets { position: absolute; z-index: 30; list-style: none; bottom: -40px; left: 50%; margin-left: -50px; padding: 0; }
|
546
|
-
ul.orbit-bullets li { float: left; margin-left: 5px; cursor: pointer; color: #999999; text-indent: -9999px; background: url('../../lib/assets/images/foundation/orbit/bullets.jpg?1358876660') no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden; }
|
547
|
-
ul.orbit-bullets li.active { color: #222222; background-position: -8px 0; }
|
548
|
-
ul.orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; }
|
549
|
-
ul.orbit-bullets li.active.has-thumb { background-position: 0 0; border-top: 2px solid black; }
|
550
|
-
|
551
|
-
/* Orbit Slide Counter */
|
552
|
-
.orbit-slide-counter { position: absolute; bottom: 0; z-index: 99; background: rgba(0, 0, 0, 0.7); color: white; padding: 5px; }
|
553
|
-
|
554
|
-
/* Fluid Layout ---------------------- */
|
555
|
-
div.orbit img.fluid-placeholder { visibility: hidden; position: static; display: block; width: 100%; }
|
556
|
-
|
557
|
-
div.orbit, div.orbit-wrapper { width: 100% !important; }
|
558
|
-
|
559
|
-
/* Correct timer in IE */
|
560
|
-
.lt-ie9 .timer { display: none !important; }
|
561
|
-
|
562
|
-
.lt-ie9 div.orbit-caption { background: black; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000); zoom: 1; }
|
563
|
-
|
564
|
-
@media only screen and (max-width: 767px) { div.orbit.orbit-stack-on-small img.fluid-placeholder { visibility: visible; }
|
565
|
-
div.orbit.orbit-stack-on-small .orbit-slide { position: static; margin-bottom: 10px; } }
|
566
|
-
/* CSS for jQuery Reveal Plugin Maintained for Foundation. foundation.zurb.com Free to use under the MIT license. http://www.opensource.org/licenses/mit-license.php */
|
567
|
-
/* Reveal Modals ---------------------- */
|
568
|
-
.reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(0, 0, 0, 0.45); z-index: 40; display: none; top: 0; left: 0; }
|
569
|
-
|
570
|
-
.reveal-modal { background: #fff; visibility: hidden; display: none; top: 100px; left: 50%; margin-left: -260px; width: 520px; position: absolute; z-index: 41; padding: 30px; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); }
|
571
|
-
.reveal-modal .close-reveal-modal { font-size: 22px; font-size: 2.2rem; line-height: .5; position: absolute; top: 8px; right: 11px; color: #aaa; text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.6); font-weight: bold; cursor: pointer; }
|
572
|
-
.reveal-modal.small { width: 30%; margin-left: -15%; }
|
573
|
-
.reveal-modal.medium { width: 40%; margin-left: -20%; }
|
574
|
-
.reveal-modal.large { width: 60%; margin-left: -30%; }
|
575
|
-
.reveal-modal.xlarge { width: 70%; margin-left: -35%; }
|
576
|
-
.reveal-modal.expand { width: 90%; margin-left: -45%; }
|
577
|
-
.reveal-modal .row { min-width: 0; margin-bottom: 10px; }
|
578
|
-
.reveal-modal > :first-child { margin-top: 0; }
|
579
|
-
.reveal-modal > :last-child { margin-bottom: 0; }
|
580
|
-
|
581
|
-
@media print { div:not(.reveal-modal) { display: none; }
|
582
|
-
.reveal-modal { border: solid 1px black; background: #fff; } }
|
583
|
-
#joyRideTipContent { display: none; }
|
584
|
-
|
585
|
-
/* Default styles for the container */
|
586
|
-
.joyride-tip-guide { display: none; position: absolute; background: black; background: rgba(0, 0, 0, 0.8); color: white; width: 300px; z-index: 101; top: 0; left: 0; font-family: inherit; font-weight: normal; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; }
|
587
|
-
|
588
|
-
.joyride-content-wrapper { padding: 18px 20px 24px; }
|
589
|
-
|
590
|
-
/* Add a little css triangle pip, older browser just miss out on the fanciness of it */
|
591
|
-
.joyride-tip-guide span.joyride-nub { display: block; position: absolute; left: 22px; width: 0; height: 0; border: solid 14px; }
|
592
|
-
.joyride-tip-guide span.joyride-nub.top { border-color: black; border-color: rgba(0, 0, 0, 0.8); border-top-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; top: -28px; bottom: none; }
|
593
|
-
.joyride-tip-guide span.joyride-nub.bottom { border-color: black; border-color: rgba(0, 0, 0, 0.8) !important; border-bottom-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; bottom: -28px; bottom: none; }
|
594
|
-
.joyride-tip-guide span.joyride-nub.right { border-color: black; border-color: rgba(0, 0, 0, 0.8) !important; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; top: 22px; bottom: none; left: auto; right: -28px; }
|
595
|
-
.joyride-tip-guide span.joyride-nub.left { border-color: black; border-color: rgba(0, 0, 0, 0.8) !important; border-top-color: transparent !important; border-left-color: transparent !important; border-bottom-color: transparent !important; top: 22px; left: -28px; right: auto; bottom: none; }
|
596
|
-
|
597
|
-
/* Typography */
|
598
|
-
.joyride-tip-guide h1, .joyride-tip-guide h2, .joyride-tip-guide h3, .joyride-tip-guide h4, .joyride-tip-guide h5, .joyride-tip-guide h6 { line-height: 1.25; margin: 0; font-weight: bold; color: white; }
|
599
|
-
|
600
|
-
.joyride-tip-guide p { margin: 0 0 18px 0; font-size: 14px; line-height: 1.3; }
|
601
|
-
|
602
|
-
.joyride-timer-indicator-wrap { width: 50px; height: 3px; border: solid 1px #555555; position: absolute; right: 17px; bottom: 16px; }
|
603
|
-
|
604
|
-
.joyride-timer-indicator { display: block; width: 0; height: inherit; background: #666666; }
|
605
|
-
|
606
|
-
.joyride-close-tip { position: absolute; right: 10px; top: 10px; color: #777777 !important; text-decoration: none; font-size: 20px; font-weight: normal; line-height: 0.5 !important; }
|
607
|
-
.joyride-close-tip:hover, .joyride-close-tip:focus { color: #eeeeee !important; }
|
608
|
-
|
609
|
-
.joyride-modal-bg { position: fixed; height: 100%; width: 100%; background: transparent; background: rgba(0, 0, 0, 0.5); z-index: 100; display: none; top: 0; left: 0; cursor: pointer; }
|
610
|
-
|
611
|
-
.clearing-blackout { background: black; background: rgba(0, 0, 0, 0.8); position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 999; }
|
612
|
-
.clearing-blackout .clearing-close { display: block; }
|
613
|
-
|
614
|
-
.clearing-container { position: relative; z-index: 999; height: 100%; overflow: hidden; }
|
615
|
-
|
616
|
-
.visible-img { height: 75%; position: relative; }
|
617
|
-
.visible-img img { position: absolute; left: 50%; top: 50%; margin-left: -50%; max-height: 100%; max-width: 100%; }
|
618
|
-
.visible-img .clearing-caption { color: white; margin-bottom: 0; text-align: center; position: absolute; bottom: 0; background: black; background: rgba(0, 0, 0, 0.7); width: 100%; padding: 10px 100px; }
|
619
|
-
|
620
|
-
.clearing-close { z-index: 999; position: absolute; top: 10px; right: 20px; font-size: 30px; line-height: 1; color: white; display: none; }
|
621
|
-
.clearing-close:hover, .clearing-close:focus { color: #ccc; }
|
622
|
-
|
623
|
-
.clearing-main-left, .clearing-main-right { position: absolute; top: 50%; margin-top: -16px; }
|
624
|
-
|
625
|
-
.clearing-main-left.disabled, .clearing-main-right.disabled { opacity: 0.5; }
|
626
|
-
|
627
|
-
.clearing-main-left:active, .clearing-main-right:active { margin-top: -15px; }
|
628
|
-
|
629
|
-
.clearing-main-left { left: 10px; content: ""; display: block; width: 0; height: 0; border: solid 16px; border-color: transparent white transparent transparent; }
|
630
|
-
|
631
|
-
.clearing-main-right { right: 10px; content: ""; display: block; width: 0; height: 0; border: solid 16px; border-color: transparent transparent transparent white; }
|
632
|
-
|
633
|
-
.block-grid.three-up > li:nth-child(3n+1) { clear: none; }
|
634
|
-
|
635
|
-
ul[data-clearing] li { cursor: pointer; display: block; }
|
636
|
-
ul[data-clearing] li.clearing-feature ~ li { display: none; }
|
637
|
-
|
638
|
-
.clearing-assembled .clearing-container .carousel { background: black; background: rgba(0, 0, 0, 0.75); height: 150px; margin-top: 5px; }
|
639
|
-
.clearing-assembled .clearing-container .visible-img { background: black; background: rgba(0, 0, 0, 0.75); overflow: hidden; }
|
640
|
-
.clearing-assembled .clearing-container ul[data-clearing] { z-index: 999; width: 200%; height: 100%; margin-left: 0; position: relative; left: 0; }
|
641
|
-
.clearing-assembled .clearing-container ul[data-clearing] li { display: block; width: 175px; height: inherit; padding: 0; float: left; overflow: hidden; background: #222; margin-right: 1px; position: relative; }
|
642
|
-
.clearing-assembled .clearing-container ul[data-clearing] li.fix-height img { min-height: 100%; height: 100%; max-width: none; }
|
643
|
-
.clearing-assembled .clearing-container ul[data-clearing] li img { cursor: pointer !important; min-width: 100% !important; }
|
644
|
-
.clearing-assembled .clearing-container ul[data-clearing] li.visible { border-top: 4px solid white; }
|
645
|
-
|
646
|
-
/* Overrides clear:both; when using block-grid with Clearing. Also overrided .th styling when Clearing is open */
|
647
|
-
/* Tabs ---------------------- */
|
648
|
-
.tabs { list-style: none; border-bottom: solid 1px #e6e6e6; display: block; height: 40px; padding: 0; margin-bottom: 20px; }
|
649
|
-
.tabs.contained { margin-bottom: 0; margin-left: 0; }
|
650
|
-
.tabs dt, .tabs li.section-title { color: #b3b3b3; cursor: default; display: block; float: left; font-size: 12px; height: 40px; line-height: 40px; padding: 0; padding-right: 9px; padding-left: 20px; font-weight: normal; width: auto; text-transform: uppercase; }
|
651
|
-
.tabs dt:first-child, .tabs li.section-title:first-child { padding: 0; padding-right: 9px; }
|
652
|
-
.tabs dd, .tabs li { display: block; float: left; padding: 0; margin: 0; }
|
653
|
-
.tabs dd a, .tabs li a { color: #6f6f6f; display: block; font-size: 1em; height: 40px; line-height: 40px; padding: 0px 1.47057em; }
|
654
|
-
.tabs dd a:focus, .tabs li a:focus { font-weight: bold; color: #2ba6cb; }
|
655
|
-
.tabs dd.active, .tabs li.active { border-top: 3px solid #2ba6cb; margin-top: -3px; }
|
656
|
-
.tabs dd.active a, .tabs li.active a { cursor: default; color: #3c3c3c; background: #fff; border-left: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; font-weight: bold; }
|
657
|
-
.tabs dd:first-child, .tabs li:first-child { margin-left: 0; }
|
658
|
-
.tabs.vertical { height: auto; border-bottom: 1px solid #e6e6e6; }
|
659
|
-
.tabs.vertical dt, .tabs.vertical dd, .tabs.vertical li { float: none; height: auto; }
|
660
|
-
.tabs.vertical dd, .tabs.vertical li { border-left: 3px solid #cccccc; }
|
661
|
-
.tabs.vertical dd a, .tabs.vertical li a { background: #f2f2f2; border: none; border: 1px solid #e6e6e6; border-width: 1px 1px 0 0; color: #555; display: block; font-size: 1em; height: auto; line-height: 1; padding: 15px 20px; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; }
|
662
|
-
.tabs.vertical dd.active, .tabs.vertical li.active { margin-top: 0; border-top: 1px solid #4d4d4d; border-left: 4px solid #1a1a1a; }
|
663
|
-
.tabs.vertical dd.active a, .tabs.vertical li.active a { background: #4d4d4d; border: none; color: #fff; height: auto; margin: 0; position: static; top: 0; -webkit-box-shadow: 0 0 0; -moz-box-shadow: 0 0 0; box-shadow: 0 0 0; }
|
664
|
-
.tabs.vertical dd:first-child a.active, .tabs.vertical li:first-child a.active { margin: 0; }
|
665
|
-
.tabs.pill { border-bottom: none; margin-bottom: 10px; }
|
666
|
-
.tabs.pill dd, .tabs.pill li { margin-right: 10px; }
|
667
|
-
.tabs.pill dd:last-child, .tabs.pill li:last-child { margin-right: 0; }
|
668
|
-
.tabs.pill dd a, .tabs.pill li a { -webkit-border-radius: 1000px; -moz-border-radius: 1000px; -ms-border-radius: 1000px; -o-border-radius: 1000px; border-radius: 1000px; background: #e6e6e6; height: 26px; line-height: 26px; color: #666; }
|
669
|
-
.tabs.pill dd.active, .tabs.pill li.active { border: none; margin-top: 0; }
|
670
|
-
.tabs.pill dd.active a, .tabs.pill li.active a { background-color: #2ba6cb; border: none; color: #fff; }
|
671
|
-
.tabs.pill.contained { border-bottom: solid 1px #eeeeee; margin-bottom: 0; }
|
672
|
-
.tabs.pill.two-up dd, .tabs.pill.two-up li, .tabs.pill.three-up dd, .tabs.pill.three-up li, .tabs.pill.four-up dd, .tabs.pill.four-up li, .tabs.pill.five-up dd, .tabs.pill.five-up li { margin-right: 0; }
|
673
|
-
.tabs.two-up dt a, .tabs.two-up dd a, .tabs.two-up li a, .tabs.three-up dt a, .tabs.three-up dd a, .tabs.three-up li a, .tabs.four-up dt a, .tabs.four-up dd a, .tabs.four-up li a, .tabs.five-up dt a, .tabs.five-up dd a, .tabs.five-up li a { padding: 0 1.05041em; text-align: center; overflow: hidden; }
|
674
|
-
.tabs.two-up dt, .tabs.two-up dd, .tabs.two-up li { width: 50%; }
|
675
|
-
.tabs.three-up dt, .tabs.three-up dd, .tabs.two-up li { width: 33.33%; }
|
676
|
-
.tabs.four-up dt, .tabs.four-up dd, .tabs.two-up li { width: 25%; }
|
677
|
-
.tabs.five-up dt, .tabs.five-up dd, .tabs.two-up li { width: 20%; }
|
678
|
-
|
679
|
-
ul.tabs-content { display: block; margin: 0 0 20px; padding: 0; }
|
680
|
-
ul.tabs-content > li { display: none; }
|
681
|
-
ul.tabs-content > li.active { display: block; }
|
682
|
-
ul.tabs-content.contained { padding: 0; }
|
683
|
-
ul.tabs-content.contained > li { border: solid 0 #e6e6e6; border-width: 0 1px 1px 1px; padding: 20px; }
|
684
|
-
ul.tabs-content.contained.vertical > li { border-width: 1px 1px 1px 1px; }
|
685
|
-
|
686
|
-
.no-js ul.tabs-content > li { display: block; }
|
687
|
-
|
688
|
-
/* Table of Contents
|
689
|
-
|
690
|
-
:: Visibility
|
691
|
-
:: Alerts
|
692
|
-
:: Labels
|
693
|
-
:: Tooltips
|
694
|
-
:: Panels
|
695
|
-
:: Accordion
|
696
|
-
:: Side Nav
|
697
|
-
:: Sub Nav
|
698
|
-
:: Pagination
|
699
|
-
:: Breadcrumbs
|
700
|
-
:: Lists
|
701
|
-
:: Inline/Link Lists
|
702
|
-
:: Keystroke Chars
|
703
|
-
:: Image Thumbnails
|
704
|
-
:: Video
|
705
|
-
:: Tables
|
706
|
-
:: Microformats
|
707
|
-
:: Progress Bars
|
708
|
-
:: Pricing Tables
|
709
|
-
|
710
|
-
*/
|
711
|
-
/* Alerts ---------------------- */
|
712
|
-
div.alert-box { display: block; padding: 6px 7px 7px; font-weight: bold; font-size: 1em; color: white; background-color: #2ba6cb; border: 1px solid rgba(0, 0, 0, 0.1); margin-bottom: 12px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; text-shadow: 0 -1px rgba(0, 0, 0, 0.3); position: relative; }
|
713
|
-
div.alert-box.success { background-color: #5da423; color: #fff; text-shadow: 0 -1px rgba(0, 0, 0, 0.3); }
|
714
|
-
div.alert-box.alert { background-color: #c60f13; color: #fff; text-shadow: 0 -1px rgba(0, 0, 0, 0.3); }
|
715
|
-
div.alert-box.secondary { background-color: #e9e9e9; color: #505050; text-shadow: 0 1px rgba(255, 255, 255, 0.3); }
|
716
|
-
div.alert-box a.close { color: #333; position: absolute; right: 4px; top: -1px; font-size: 1.05041em; opacity: 0.2; padding: 4px; }
|
717
|
-
div.alert-box a.close:hover, div.alert-box a.close:focus { opacity: 0.4; }
|
718
|
-
|
719
|
-
/* Labels ---------------------- */
|
720
|
-
.label { padding: 1px 4px 2px; font-size: -1em; font-weight: bold; text-align: center; text-decoration: none; line-height: 1; white-space: nowrap; display: inline; position: relative; bottom: 1px; color: #fff; background: #2ba6cb; }
|
721
|
-
.label.radius { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
|
722
|
-
.label.round { padding: 1px 7px 2px; -webkit-border-radius: 1000px; -moz-border-radius: 1000px; -ms-border-radius: 1000px; -o-border-radius: 1000px; border-radius: 1000px; }
|
723
|
-
.label.alert { background-color: #c60f13; }
|
724
|
-
.label.success { background-color: #5da423; }
|
725
|
-
.label.secondary { background-color: #e9e9e9; color: #505050; }
|
726
|
-
|
727
|
-
/* Tooltips ---------------------- */
|
728
|
-
.has-tip { border-bottom: dotted 1px #cccccc; cursor: help; font-weight: bold; color: #333333; }
|
729
|
-
.has-tip:hover, .has-tip:focus { border-bottom: dotted 1px #196177; color: #2ba6cb; }
|
730
|
-
.has-tip.tip-left, .has-tip.tip-right { float: none !important; }
|
731
|
-
|
732
|
-
.tooltip { display: none; background: black; background: rgba(0, 0, 0, 0.85); position: absolute; color: white; font-weight: bold; font-size: 12px; padding: 5px; z-index: 999; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; line-height: normal; }
|
733
|
-
.tooltip > .nub { display: block; width: 0; height: 0; border: solid 5px; border-color: transparent transparent black transparent; border-color: transparent transparent rgba(0, 0, 0, 0.85) transparent; position: absolute; top: -10px; left: 10px; }
|
734
|
-
.tooltip.tip-override > .nub { border-color: transparent transparent black transparent !important; border-color: transparent transparent rgba(0, 0, 0, 0.85) transparent !important; top: -10px !important; }
|
735
|
-
.tooltip.tip-top > .nub { border-color: black transparent transparent transparent; border-color: rgba(0, 0, 0, 0.85) transparent transparent transparent; top: auto; bottom: -10px; }
|
736
|
-
.tooltip.tip-left, .tooltip.tip-right { float: none !important; }
|
737
|
-
.tooltip.tip-left > .nub { border-color: transparent transparent transparent black; border-color: transparent transparent transparent rgba(0, 0, 0, 0.85); right: -10px; left: auto; }
|
738
|
-
.tooltip.tip-right > .nub { border-color: transparent black transparent transparent; border-color: transparent rgba(0, 0, 0, 0.85) transparent transparent; right: auto; left: -10px; }
|
739
|
-
.tooltip.noradius { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; }
|
740
|
-
.tooltip.opened { color: #2ba6cb !important; border-bottom: dotted 1px #196177 !important; }
|
741
|
-
|
742
|
-
.tap-to-close { display: block; font-size: 10px; font-size: 1rem; color: #888888; font-weight: normal; }
|
743
|
-
|
744
|
-
/* Panels ---------------------- */
|
745
|
-
.panel { background: #f2f2f2; border: solid 1px #e6e6e6; margin: 0 0 22px 0; padding: 20px; }
|
746
|
-
.panel > :first-child { margin-top: 0; }
|
747
|
-
.panel > :last-child { margin-bottom: 0; }
|
748
|
-
.panel > :first-child { margin-top: 0; }
|
749
|
-
.panel > :last-child { margin-bottom: 0; }
|
750
|
-
.panel.callout { background: #2ba6cb; color: #fff; border-color: #2284a1; -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5); box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5); }
|
751
|
-
.panel.callout a { color: #fff; }
|
752
|
-
.panel.callout .button { background: white; border: none; color: #2ba6cb; text-shadow: none; }
|
753
|
-
.panel.callout .button:hover, .panel.callout .button:focus { background: rgba(255, 255, 255, 0.8); }
|
754
|
-
.panel.radius { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
|
755
|
-
|
756
|
-
/* Accordion ---------------------- */
|
757
|
-
ul.accordion { margin: 0 0 22px 0; border-bottom: 1px solid #e9e9e9; }
|
758
|
-
ul.accordion > li { list-style: none; margin: 0; padding: 0; border-top: 1px solid #e9e9e9; }
|
759
|
-
ul.accordion > li > div.title { cursor: pointer; background: #f6f6f6; padding: 15px; margin: 0; position: relative; border-left: 1px solid #e9e9e9; border-right: 1px solid #e9e9e9; -webkit-transition: 0.15s background linear; -moz-transition: 0.15s background linear; -o-transition: 0.15s background linear; transition: 0.15s background linear; }
|
760
|
-
ul.accordion > li > div.title h1, ul.accordion > li > div.title h2, ul.accordion > li > div.title h3, ul.accordion > li > div.title h4, ul.accordion > li > div.title h5 { margin: 0; }
|
761
|
-
ul.accordion > li > div.title:after { content: ""; display: block; width: 0; height: 0; border: solid 6px; border-color: transparent #9d9d9d transparent transparent; position: absolute; right: 15px; top: 21px; }
|
762
|
-
ul.accordion > li .content { display: none; padding: 15px; }
|
763
|
-
ul.accordion > li.active { border-top: 3px solid #2ba6cb; }
|
764
|
-
ul.accordion > li.active .title { background: white; padding-top: 13px; }
|
765
|
-
ul.accordion > li.active .title:after { content: ""; display: block; width: 0; height: 0; border: solid 6px; border-color: #9d9d9d transparent transparent transparent; }
|
766
|
-
ul.accordion > li.active .content { background: white; display: block; border-left: 1px solid #e9e9e9; border-right: 1px solid #e9e9e9; }
|
767
|
-
|
768
|
-
/* Side Nav ---------------------- */
|
769
|
-
ul.side-nav { display: block; list-style: none; margin: 0; padding: 1.05041em 0; }
|
770
|
-
ul.side-nav li { display: block; list-style: none; margin: 0 0 0.5em 0; }
|
771
|
-
ul.side-nav li a { display: block; }
|
772
|
-
ul.side-nav li.active a { color: #4d4d4d; font-weight: bold; }
|
773
|
-
ul.side-nav li.divider { border-top: 1px solid #e6e6e6; height: 0; padding: 0; }
|
774
|
-
|
775
|
-
/* Sub Navs http://www.zurb.com/article/292/how-to-create-simple-and-effective-sub-na ---------------------- */
|
776
|
-
dl.sub-nav { display: block; width: auto; overflow: hidden; margin: -4px 0 18px; margin-right: 0; margin-left: -9px; padding-top: 4px; }
|
777
|
-
dl.sub-nav dt, dl.sub-nav dd { float: left; display: inline; margin-left: 9px; margin-bottom: 10px; }
|
778
|
-
dl.sub-nav dt { color: #999; font-weight: normal; }
|
779
|
-
dl.sub-nav dd a { text-decoration: none; -webkit-border-radius: 1000px; -moz-border-radius: 1000px; -ms-border-radius: 1000px; -o-border-radius: 1000px; border-radius: 1000px; }
|
780
|
-
dl.sub-nav dd.active a { font-weight: bold; background: #2ba6cb; color: #fff; padding: 3px 9px; cursor: default; }
|
781
|
-
|
782
|
-
/* Pagination ---------------------- */
|
783
|
-
ul.pagination { display: block; height: 24px; margin-left: -5px; }
|
784
|
-
ul.pagination li { float: left; display: block; height: 24px; color: #999; font-size: 1em; margin-left: 5px; }
|
785
|
-
ul.pagination li a { display: block; padding: 1px 7px 1px; color: #555; }
|
786
|
-
ul.pagination li:hover a, ul.pagination li a:focus { background: #e6e6e6; }
|
787
|
-
ul.pagination li.unavailable a { cursor: default; color: #999; }
|
788
|
-
ul.pagination li.unavailable:hover a, ul.pagination li.unavailable a:focus { background: transparent; }
|
789
|
-
ul.pagination li.current a { background: #2ba6cb; color: white; font-weight: bold; cursor: default; }
|
790
|
-
ul.pagination li.current a:hover, ul.pagination li.current a:focus { background: #2ba6cb; }
|
791
|
-
|
792
|
-
/* Breadcrums ---------------------- */
|
793
|
-
ul.breadcrumbs { display: block; background: #f6f6f6; padding: 6px 10px 7px; border: 1px solid #e9e9e9; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; overflow: hidden; margin-left: 0; }
|
794
|
-
ul.breadcrumbs li { margin: 0; padding: 0 12px 0 0; float: left; list-style: none; }
|
795
|
-
ul.breadcrumbs li a, ul.breadcrumbs li span { text-transform: uppercase; font-size: 11px; font-size: 1.1rem; padding-left: 12px; }
|
796
|
-
ul.breadcrumbs li:first-child a, ul.breadcrumbs li:first-child span { padding-left: 0; }
|
797
|
-
ul.breadcrumbs li:before { content: "/"; color: #aaa; }
|
798
|
-
ul.breadcrumbs li:first-child:before { content: " "; }
|
799
|
-
ul.breadcrumbs li.current a { cursor: default; color: #333; }
|
800
|
-
ul.breadcrumbs li:hover a, ul.breadcrumbs li a:focus { text-decoration: underline; }
|
801
|
-
ul.breadcrumbs li.current:hover a, ul.breadcrumbs li.current a:focus { text-decoration: none; }
|
802
|
-
ul.breadcrumbs li.unavailable a { color: #999; }
|
803
|
-
ul.breadcrumbs li.unavailable:hover a, ul.breadcrumbs li.unavailable a:focus { text-decoration: none; color: #999; cursor: default; }
|
804
|
-
|
805
|
-
/* Inline Link List */
|
806
|
-
ul.inline-list, ul.link-list { margin: 0 0 17px -22px; padding: 0; list-style: none; overflow: hidden; }
|
807
|
-
ul.inline-list > li, ul.link-list > li { list-style: none; float: left; margin-left: 22px; display: block; }
|
808
|
-
ul.inline-list > li > *, ul.link-list > li > * { display: block; }
|
809
|
-
|
810
|
-
/* Keytroke Characters ---------------------- */
|
811
|
-
.keystroke, kbd { font-family: "Consolas", "Menlo", "Courier", monospace; font-size: 0em; padding: 2px 4px 0px; margin: 0; background: #ededed; border: solid 1px #dbdbdb; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
|
812
|
-
|
813
|
-
/* Image Thumbnails ---------------------- */
|
814
|
-
.th { display: block; }
|
815
|
-
.th img { display: block; border: solid 4px white; -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-transition-property: box-shadow; -moz-transition-property: box-shadow; -o-transition-property: box-shadow; transition-property: box-shadow; -webkit-transition-duration: 300ms; -moz-transition-duration: 300ms; -o-transition-duration: 300ms; transition-duration: 300ms; }
|
816
|
-
.th:hover img, .th:focus img { -webkit-box-shadow: 0 0 6px 1px rgba(43, 166, 203, 0.5); -moz-box-shadow: 0 0 6px 1px rgba(43, 166, 203, 0.5); box-shadow: 0 0 6px 1px rgba(43, 166, 203, 0.5); }
|
817
|
-
|
818
|
-
/* Video - Mad props to http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/ ---------------------- */
|
819
|
-
.flex-video { position: relative; padding-top: 25px; padding-bottom: 67.5%; height: 0; margin-bottom: 16px; overflow: hidden; }
|
820
|
-
.flex-video.widescreen { padding-bottom: 57.25%; }
|
821
|
-
.flex-video.vimeo { padding-top: 0; }
|
822
|
-
.flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
|
823
|
-
|
824
|
-
/* Tables ---------------------- */
|
825
|
-
table { background: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; margin: 0 0 18px; border: 1px solid #dddddd; }
|
826
|
-
|
827
|
-
table thead, table tfoot { background: #f5f5f5; }
|
828
|
-
|
829
|
-
table thead tr th, table tfoot tr th, table tbody tr td, table tr td, table tfoot tr td { display: table-cell; font-size: 1em; line-height: 18px; text-align: left; }
|
830
|
-
|
831
|
-
table thead tr th, table tfoot tr td { padding: 8px 10px 9px; font-size: 1em; font-weight: bold; color: #222; }
|
832
|
-
|
833
|
-
table thead tr th:first-child, table tfoot tr td:first-child { border-left: none; }
|
834
|
-
|
835
|
-
table thead tr th:last-child, table tfoot tr td:last-child { border-right: none; }
|
836
|
-
|
837
|
-
table tbody tr.even, table tbody tr.alt { background: #f9f9f9; }
|
838
|
-
|
839
|
-
table tbody tr:nth-child(even) { background: #f9f9f9; }
|
840
|
-
|
841
|
-
table tbody tr td { color: #333; padding: 9px 10px; vertical-align: top; border: none; }
|
842
|
-
|
843
|
-
/* Microformats ---------------------- */
|
844
|
-
ul.vcard { display: inline-block; margin: 0 0 12px 0; border: 1px solid #dddddd; padding: 10px; }
|
845
|
-
ul.vcard li { margin: 0; display: block; }
|
846
|
-
ul.vcard li.fn { font-weight: bold; font-size: 2em; }
|
847
|
-
|
848
|
-
p.vevent span.summary { font-weight: bold; }
|
849
|
-
p.vevent abbr { cursor: default; text-decoration: none; font-weight: bold; border: none; padding: 0 1px; }
|
850
|
-
|
851
|
-
/* Progress Bar ---------------------- */
|
852
|
-
div.progress { padding: 2px; margin-bottom: 10px; border: 1px solid #cccccc; height: 25px; /* meter */ /* border radii */ }
|
853
|
-
div.progress .meter { background: #2ba6cb; height: 100%; display: block; width: 50%; }
|
854
|
-
div.progress.secondary .meter { background: #e9e9e9; }
|
855
|
-
div.progress.success .meter { background: #5da423; }
|
856
|
-
div.progress.alert .meter { background: #c60f13; }
|
857
|
-
div.progress.radius { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
|
858
|
-
div.progress.radius .meter { -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; }
|
859
|
-
div.progress.round { -webkit-border-radius: 1000px; -moz-border-radius: 1000px; -ms-border-radius: 1000px; -o-border-radius: 1000px; border-radius: 1000px; }
|
860
|
-
div.progress.round .meter { -webkit-border-radius: 1000px; -moz-border-radius: 1000px; -ms-border-radius: 1000px; -o-border-radius: 1000px; border-radius: 1000px; }
|
861
|
-
|
862
|
-
/* Pricing Tables ---------------------- */
|
863
|
-
.pricing-table { border: solid 1px #dddddd; margin-left: 0; margin-bottom: 20px; }
|
864
|
-
.pricing-table * { list-style: none; line-height: 1; }
|
865
|
-
.pricing-table .title { background-color: #dddddd; padding: 15px 20px; text-align: center; color: #333333; font-weight: bold; font-size: 16px; }
|
866
|
-
.pricing-table .price { background-color: #eeeeee; padding: 15px 20px; text-align: center; color: #333333; font-weight: normal; font-size: 20px; }
|
867
|
-
.pricing-table .description { background-color: white; padding: 15px; text-align: center; color: #777777; font-size: 12px; font-weight: normal; line-height: 1.4; border-bottom: dotted 1px #dddddd; }
|
868
|
-
.pricing-table .bullet-item { background-color: white; padding: 15px; text-align: center; color: #333333; font-size: 14px; font-weight: normal; border-bottom: dotted 1px #dddddd; }
|
869
|
-
.pricing-table .cta-button { background-color: whitesmoke; text-align: center; padding: 20px; }
|
870
|
-
|
871
|
-
/* Styles for screens that are atleast 768px; */
|
872
|
-
@media only screen and (min-width: 48em) { /* Shared column styles */
|
873
|
-
.row { display: -webkit-flex; }
|
874
|
-
.row.stacked { -webkit-flex-direction: column; }
|
875
|
-
.row.stacked.flip { -webkit-flex-direction: column-reverse; }
|
876
|
-
.row.flip { -webkit-flex-direction: row-reverse; }
|
877
|
-
.row.collapse [class*="large-"] { padding: 0; }
|
878
|
-
/* Centered large rows */
|
879
|
-
.large-centered { -webkit-justify-content: center; }
|
880
|
-
/* Small column widths */
|
881
|
-
.row .large-1 { width: 8.33333%; }
|
882
|
-
.row .large-2 { width: 16.66667%; }
|
883
|
-
.row .large-3 { width: 25%; }
|
884
|
-
.row .large-4 { width: 33.33333%; }
|
885
|
-
.row .large-5 { width: 41.66667%; }
|
886
|
-
.row .large-6 { width: 50%; }
|
887
|
-
.row .large-7 { width: 58.33333%; }
|
888
|
-
.row .large-8 { width: 66.66667%; }
|
889
|
-
.row .large-9 { width: 75%; }
|
890
|
-
.row .large-10 { width: 83.33333%; }
|
891
|
-
.row .large-11 { width: 91.66667%; }
|
892
|
-
.row .large-12 { width: 100%; }
|
893
|
-
/* Offset columns */
|
894
|
-
.row .large-offset-1 { margin-left: 8.33333%; }
|
895
|
-
.row .large-offset-2 { margin-left: 16.66667%; }
|
896
|
-
.row .large-offset-3 { margin-left: 25%; }
|
897
|
-
.row .large-offset-4 { margin-left: 33.33333%; }
|
898
|
-
.row .large-offset-5 { margin-left: 41.66667%; }
|
899
|
-
.row .large-offset-6 { margin-left: 50%; }
|
900
|
-
.row .large-offset-7 { margin-left: 58.33333%; }
|
901
|
-
.row .large-offset-8 { margin-left: 66.66667%; }
|
902
|
-
.row .large-offset-9 { margin-left: 75%; }
|
903
|
-
.row .large-offset-10 { margin-left: 83.33333%; }
|
904
|
-
/* Push/Pull columns */
|
905
|
-
.large-push-2 { left: 16.66667%; }
|
906
|
-
.large-pull-2 { right: 16.66667%; }
|
907
|
-
.large-push-3 { left: 25%; }
|
908
|
-
.large-pull-3 { right: 25%; }
|
909
|
-
.large-push-4 { left: 33.33333%; }
|
910
|
-
.large-pull-4 { right: 33.33333%; }
|
911
|
-
.large-push-5 { left: 41.66667%; }
|
912
|
-
.large-pull-5 { right: 41.66667%; }
|
913
|
-
.large-push-6 { left: 50%; }
|
914
|
-
.large-pull-6 { right: 50%; }
|
915
|
-
.large-push-7 { left: 58.33333%; }
|
916
|
-
.large-pull-7 { right: 58.33333%; }
|
917
|
-
.large-push-8 { left: 66.66667%; }
|
918
|
-
.large-pull-8 { right: 66.66667%; }
|
919
|
-
.large-push-9 { left: 75%; }
|
920
|
-
.large-pull-9 { right: 75%; }
|
921
|
-
.large-push-10 { left: 83.33333%; }
|
922
|
-
.large-pull-10 { right: 83.33333%; } }
|
923
|
-
/* Styles for screens that are atleast 768px; */
|
924
|
-
@media only screen and (min-width: 48em) { .nav-bar { height: 40px; }
|
925
|
-
.nav-bar > li { float: left; display: block; }
|
926
|
-
.nav-bar > li.has-flyout > a:first-child:after { right: 20px; top: 17px; }
|
927
|
-
.nav-bar.vertical > li { float: none; }
|
928
|
-
.nav-bar.vertical > li .flyout { left: 100%; top: -1px; }
|
929
|
-
.nav-bar.vertical > li .flyout.right { left: auto; right: 100%; }
|
930
|
-
.flyout { margin: 0; border: 1px solid #d9d9d9; position: absolute; top: 39px; left: -1px; width: 250px; }
|
931
|
-
.flyout.small { width: 166.66667px; }
|
932
|
-
.flyout.large { width: 437.5px; }
|
933
|
-
.flyout.right { left: auto; right: -2px; } }
|
934
|
-
/* Styles for screens that are atleast 768px; */
|
935
|
-
@media only screen and (min-width: 48em) { .joyride-tip-guide { width: 300px; }
|
936
|
-
/* Add a little css triangle pip, older browser just miss out on the fanciness of it */
|
937
|
-
.joyride-tip-guide span.joyride-nub { left: 22px; width: 0; }
|
938
|
-
.joyride-tip-guide span.joyride-nub.right { right: -28px; }
|
939
|
-
.joyride-tip-guide span.joyride-nub.left { left: -28px; }
|
940
|
-
.joyride-timer-indicator-wrap { width: 50px; right: 17px; }
|
941
|
-
.joyride-timer-indicator { display: block; width: 0; }
|
942
|
-
.joyride-close-tip { right: 10px; font-size: 20px; } }
|
943
|
-
/* Page Titles */
|
944
|
-
#title, #page { width: 100%; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; max-width: 62.5em; *zoom: 1; }
|
945
|
-
#title:before, #title:after, #page:before, #page:after { content: " "; display: table; }
|
946
|
-
#title:after, #page:after { clear: both; }
|
947
|
-
|
948
|
-
hgroup, #page > div, #page article { position: relative; padding-left: 0.9375em; padding-right: 0.9375em; float: none; width: 100%; }
|
949
|
-
|
950
|
-
#page nav { background: #f2f2f2; border: solid 1px #e6e6e6; margin: 0 0 22px 0; padding: 20px; }
|
951
|
-
#page nav > :first-child { margin-top: 0; }
|
952
|
-
#page nav > :last-child { margin-bottom: 0; }
|
953
|
-
|
954
|
-
@media only screen and (min-width: 48em) { #page > div { position: relative; padding-left: 0.9375em; padding-right: 0.9375em; width: 33.33333%; float: left; left: 66.66667%; right: auto; }
|
955
|
-
#page article { position: relative; padding-left: 0.9375em; padding-right: 0.9375em; width: 66.66667%; float: left; right: 33.33333%; left: auto; } }
|