|
|
(16 intermediate revisions not shown) |
Line 596: |
Line 596: |
| th.hide-for-medium-down { | | th.hide-for-medium-down { |
| display: table-cell !important; } } | | display: table-cell !important; } } |
- | /* X-Large Displays: 1400px and up */
| |
- | @media only screen and (min-width: 1440px) {
| |
- | .show-for-xlarge {
| |
- | display: inherit !important; }
| |
| | | |
- | .show-for-large,
| |
- | .show-for-large-down {
| |
- | display: none !important; }
| |
- |
| |
- | .hide-for-large,
| |
- | .hide-for-large-down {
| |
- | display: inherit !important; }
| |
- |
| |
- | .hide-for-xlarge {
| |
- | display: none !important; }
| |
- |
| |
- | /* Specific visilbity for tables */
| |
- | table.show-for-xlarge, table.hide-for-large, table.hide-for-large-down {
| |
- | display: table; }
| |
- |
| |
- | thead.show-for-xlarge, thead.hide-for-large, thead.hide-for-large-down {
| |
- | display: table-header-group !important; }
| |
- |
| |
- | tbody.show-for-xlarge, tbody.hide-for-large, tbody.hide-for-large-down {
| |
- | display: table-row-group !important; }
| |
- |
| |
- | tr.show-for-xlarge, tr.hide-for-large, tr.hide-for-large-down {
| |
- | display: table-row !important; }
| |
- |
| |
- | td.show-for-xlarge, td.hide-for-large, td.hide-for-large-down,
| |
- | th.show-for-xlarge,
| |
- | th.hide-for-large,
| |
- | th.hide-for-large-down {
| |
- | display: table-cell !important; } }
| |
- | /* Orientation targeting */
| |
- | .show-for-landscape,
| |
- | .hide-for-portrait {
| |
- | display: inherit !important; }
| |
- |
| |
- | .hide-for-landscape,
| |
- | .show-for-portrait {
| |
- | display: none !important; }
| |
- |
| |
- | /* Specific visilbity for tables */
| |
- | table.hide-for-landscape, table.show-for-portrait {
| |
- | display: table; }
| |
- |
| |
- | thead.hide-for-landscape, thead.show-for-portrait {
| |
- | display: table-header-group !important; }
| |
- |
| |
- | tbody.hide-for-landscape, tbody.show-for-portrait {
| |
- | display: table-row-group !important; }
| |
- |
| |
- | tr.hide-for-landscape, tr.show-for-portrait {
| |
- | display: table-row !important; }
| |
- |
| |
- | td.hide-for-landscape, td.show-for-portrait,
| |
- | th.hide-for-landscape,
| |
- | th.show-for-portrait {
| |
- | display: table-cell !important; }
| |
- |
| |
- | @media only screen and (orientation: landscape) {
| |
- | .show-for-landscape,
| |
- | .hide-for-portrait {
| |
- | display: inherit !important; }
| |
- |
| |
- | .hide-for-landscape,
| |
- | .show-for-portrait {
| |
- | display: none !important; }
| |
- |
| |
- | /* Specific visilbity for tables */
| |
- | table.show-for-landscape, table.hide-for-portrait {
| |
- | display: table; }
| |
- |
| |
- | thead.show-for-landscape, thead.hide-for-portrait {
| |
- | display: table-header-group !important; }
| |
- |
| |
- | tbody.show-for-landscape, tbody.hide-for-portrait {
| |
- | display: table-row-group !important; }
| |
- |
| |
- | tr.show-for-landscape, tr.hide-for-portrait {
| |
- | display: table-row !important; }
| |
- |
| |
- | td.show-for-landscape, td.hide-for-portrait,
| |
- | th.show-for-landscape,
| |
- | th.hide-for-portrait {
| |
- | display: table-cell !important; } }
| |
- | @media only screen and (orientation: portrait) {
| |
- | .show-for-portrait,
| |
- | .hide-for-landscape {
| |
- | display: inherit !important; }
| |
- |
| |
- | .hide-for-portrait,
| |
- | .show-for-landscape {
| |
- | display: none !important; }
| |
- |
| |
- | /* Specific visilbity for tables */
| |
- | table.show-for-portrait, table.hide-for-landscape {
| |
- | display: table; }
| |
- |
| |
- | thead.show-for-portrait, thead.hide-for-landscape {
| |
- | display: table-header-group !important; }
| |
- |
| |
- | tbody.show-for-portrait, tbody.hide-for-landscape {
| |
- | display: table-row-group !important; }
| |
- |
| |
- | tr.show-for-portrait, tr.hide-for-landscape {
| |
- | display: table-row !important; }
| |
- |
| |
- | td.show-for-portrait, td.hide-for-landscape,
| |
- | th.show-for-portrait,
| |
- | th.hide-for-landscape {
| |
- | display: table-cell !important; } }
| |
- | /* Touch-enabled device targeting */
| |
- | .show-for-touch {
| |
- | display: none !important; }
| |
- |
| |
- | .hide-for-touch {
| |
- | display: inherit !important; }
| |
- |
| |
- | .touch .show-for-touch {
| |
- | display: inherit !important; }
| |
- |
| |
- | .touch .hide-for-touch {
| |
- | display: none !important; }
| |
- |
| |
- | /* Specific visilbity for tables */
| |
- | table.hide-for-touch {
| |
- | display: table; }
| |
- |
| |
- | .touch table.show-for-touch {
| |
- | display: table; }
| |
- |
| |
- | thead.hide-for-touch {
| |
- | display: table-header-group !important; }
| |
- |
| |
- | .touch thead.show-for-touch {
| |
- | display: table-header-group !important; }
| |
- |
| |
- | tbody.hide-for-touch {
| |
- | display: table-row-group !important; }
| |
- |
| |
- | .touch tbody.show-for-touch {
| |
- | display: table-row-group !important; }
| |
- |
| |
- | tr.hide-for-touch {
| |
- | display: table-row !important; }
| |
- |
| |
- | .touch tr.show-for-touch {
| |
- | display: table-row !important; }
| |
- |
| |
- | td.hide-for-touch {
| |
- | display: table-cell !important; }
| |
- |
| |
- | .touch td.show-for-touch {
| |
- | display: table-cell !important; }
| |
- |
| |
- | th.hide-for-touch {
| |
- | display: table-cell !important; }
| |
- |
| |
- | .touch th.show-for-touch {
| |
- | display: table-cell !important; }
| |
- |
| |
- | /* Foundation Block Grids for below small breakpoint */
| |
- | @media only screen {
| |
- | [class*="block-grid-"] {
| |
- | display: block;
| |
- | padding: 0;
| |
- | margin: 0 -0.625em;
| |
- | *zoom: 1; }
| |
- | [class*="block-grid-"]:before, [class*="block-grid-"]:after {
| |
- | content: " ";
| |
- | display: table; }
| |
- | [class*="block-grid-"]:after {
| |
- | clear: both; }
| |
- | [class*="block-grid-"] > li {
| |
- | display: inline;
| |
- | height: auto;
| |
- | float: left;
| |
- | padding: 0 0.625em 1.25em; }
| |
- |
| |
- | .small-block-grid-1 > li {
| |
- | width: 100%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-1 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-1 > li:nth-of-type(1n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-2 > li {
| |
- | width: 50%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-2 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-2 > li:nth-of-type(2n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-3 > li {
| |
- | width: 33.33333%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-3 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-3 > li:nth-of-type(3n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-4 > li {
| |
- | width: 25%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-4 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-4 > li:nth-of-type(4n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-5 > li {
| |
- | width: 20%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-5 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-5 > li:nth-of-type(5n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-6 > li {
| |
- | width: 16.66667%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-6 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-6 > li:nth-of-type(6n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-7 > li {
| |
- | width: 14.28571%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-7 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-7 > li:nth-of-type(7n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-8 > li {
| |
- | width: 12.5%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-8 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-8 > li:nth-of-type(8n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-9 > li {
| |
- | width: 11.11111%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-9 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-9 > li:nth-of-type(9n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-10 > li {
| |
- | width: 10%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-10 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-10 > li:nth-of-type(10n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-11 > li {
| |
- | width: 9.09091%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-11 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-11 > li:nth-of-type(11n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .small-block-grid-12 > li {
| |
- | width: 8.33333%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .small-block-grid-12 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .small-block-grid-12 > li:nth-of-type(12n+1) {
| |
- | clear: both; } }
| |
- | /* Foundation Block Grids for above small breakpoint */
| |
- | @media only screen and (min-width: 768px) {
| |
- | /* Remove small grid clearing */
| |
- | .small-block-grid-1 > li:nth-of-type(1n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-2 > li:nth-of-type(2n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-3 > li:nth-of-type(3n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-4 > li:nth-of-type(4n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-5 > li:nth-of-type(5n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-6 > li:nth-of-type(6n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-7 > li:nth-of-type(7n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-8 > li:nth-of-type(8n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-9 > li:nth-of-type(9n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-10 > li:nth-of-type(10n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-11 > li:nth-of-type(11n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .small-block-grid-12 > li:nth-of-type(12n+1) {
| |
- | clear: none; }
| |
- |
| |
- | .large-block-grid-1 > li {
| |
- | width: 100%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-1 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-1 > li:nth-of-type(1n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-2 > li {
| |
- | width: 50%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-2 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-2 > li:nth-of-type(2n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-3 > li {
| |
- | width: 33.33333%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-3 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-3 > li:nth-of-type(3n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-4 > li {
| |
- | width: 25%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-4 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-4 > li:nth-of-type(4n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-5 > li {
| |
- | width: 20%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-5 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-5 > li:nth-of-type(5n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-6 > li {
| |
- | width: 16.66667%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-6 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-6 > li:nth-of-type(6n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-7 > li {
| |
- | width: 14.28571%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-7 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-7 > li:nth-of-type(7n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-8 > li {
| |
- | width: 12.5%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-8 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-8 > li:nth-of-type(8n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-9 > li {
| |
- | width: 11.11111%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-9 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-9 > li:nth-of-type(9n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-10 > li {
| |
- | width: 10%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-10 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-10 > li:nth-of-type(10n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-11 > li {
| |
- | width: 9.09091%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-11 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-11 > li:nth-of-type(11n+1) {
| |
- | clear: both; }
| |
- |
| |
- | .large-block-grid-12 > li {
| |
- | width: 8.33333%;
| |
- | padding: 0 0.625em 1.25em; }
| |
- | .large-block-grid-12 > li:nth-of-type(n) {
| |
- | clear: none; }
| |
- | .large-block-grid-12 > li:nth-of-type(12n+1) {
| |
- | clear: both; } }
| |
| p.lead { | | p.lead { |
| font-size: 1.21875em; | | font-size: 1.21875em; |
Line 1,199: |
Line 790: |
| color: #6f6f6f; } | | color: #6f6f6f; } |
| | | |
- | /* Microformats */
| |
- | .vcard {
| |
- | display: inline-block;
| |
- | margin: 0 0 1.25em 0;
| |
- | border: 1px solid #dddddd;
| |
- | padding: 0.625em 0.75em; }
| |
- | .vcard li {
| |
- | margin: 0;
| |
- | display: block; }
| |
- | .vcard .fn {
| |
- | font-weight: bold;
| |
- | font-size: 0.9375em; }
| |
- |
| |
- | .vevent .summary {
| |
- | font-weight: bold; }
| |
- | .vevent abbr {
| |
- | cursor: default;
| |
- | text-decoration: none;
| |
- | font-weight: bold;
| |
- | border: none;
| |
- | padding: 0 0.0625em; }
| |
| | | |
| @media only screen and (min-width: 768px) { | | @media only screen and (min-width: 768px) { |
Line 1,237: |
Line 807: |
| font-size: 1.4375em; } } | | font-size: 1.4375em; } } |
| | | |
- | /* Button Groups */ | + | /* Standard Forms */ |
- | .button-group {
| + | form { |
- | list-style: none;
| + | margin: 0 0 1em; } |
- | margin: 0; | + | |
- | *zoom: 1; }
| + | |
- | .button-group:before, .button-group:after {
| + | |
- | content: " ";
| + | |
- | display: table; }
| + | |
- | .button-group:after {
| + | |
- | clear: both; }
| + | |
- | .button-group > * {
| + | |
- | margin: 0 0 0 -1px;
| + | |
- | float: left; }
| + | |
- | .button-group > *:first-child {
| + | |
- | margin-left: 0; }
| + | |
- | .button-group.radius > *:first-child, .button-group.radius > *:first-child > a, .button-group.radius > *:first-child > button, .button-group.radius > *:first-child > .button {
| + | |
- | -moz-border-radius-bottomleft: 3px;
| + | |
- | -moz-border-radius-topleft: 3px;
| + | |
- | -webkit-border-bottom-left-radius: 3px;
| + | |
- | -webkit-border-top-left-radius: 3px;
| + | |
- | border-bottom-left-radius: 3px;
| + | |
- | border-top-left-radius: 3px; }
| + | |
- | .button-group.radius > *:last-child, .button-group.radius > *:last-child > a, .button-group.radius > *:last-child > button, .button-group.radius > *:last-child > .button {
| + | |
- | -moz-border-radius-topright: 3px;
| + | |
- | -moz-border-radius-bottomright: 3px;
| + | |
- | -webkit-border-top-right-radius: 3px;
| + | |
- | -webkit-border-bottom-right-radius: 3px;
| + | |
- | border-top-right-radius: 3px;
| + | |
- | border-bottom-right-radius: 3px; }
| + | |
- | .button-group.round > *:first-child, .button-group.round > *:first-child > a, .button-group.round > *:first-child > button, .button-group.round > *:first-child > .button {
| + | |
- | -moz-border-radius-bottomleft: 1000px;
| + | |
- | -moz-border-radius-topleft: 1000px;
| + | |
- | -webkit-border-bottom-left-radius: 1000px;
| + | |
- | -webkit-border-top-left-radius: 1000px;
| + | |
- | border-bottom-left-radius: 1000px;
| + | |
- | border-top-left-radius: 1000px; }
| + | |
- | .button-group.round > *:last-child, .button-group.round > *:last-child > a, .button-group.round > *:last-child > button, .button-group.round > *:last-child > .button {
| + | |
- | -moz-border-radius-topright: 1000px;
| + | |
- | -moz-border-radius-bottomright: 1000px;
| + | |
- | -webkit-border-top-right-radius: 1000px;
| + | |
- | -webkit-border-bottom-right-radius: 1000px;
| + | |
- | border-top-right-radius: 1000px;
| + | |
- | border-bottom-right-radius: 1000px; }
| + | |
- | .button-group.even-2 li {
| + | |
- | width: 50%; }
| + | |
- | .button-group.even-2 li button, .button-group.even-2 li .button {
| + | |
- | width: 100%; }
| + | |
- | .button-group.even-3 li {
| + | |
- | width: 33.33333%; }
| + | |
- | .button-group.even-3 li button, .button-group.even-3 li .button {
| + | |
- | width: 100%; }
| + | |
- | .button-group.even-4 li {
| + | |
- | width: 25%; }
| + | |
- | .button-group.even-4 li button, .button-group.even-4 li .button {
| + | |
- | width: 100%; }
| + | |
- | .button-group.even-5 li {
| + | |
- | width: 20%; }
| + | |
- | .button-group.even-5 li button, .button-group.even-5 li .button {
| + | |
- | width: 100%; }
| + | |
- | .button-group.even-6 li {
| + | |
- | width: 16.66667%; }
| + | |
- | .button-group.even-6 li button, .button-group.even-6 li .button {
| + | |
- | width: 100%; }
| + | |
- | .button-group.even-7 li {
| + | |
- | width: 14.28571%; }
| + | |
- | .button-group.even-7 li button, .button-group.even-7 li .button {
| + | |
- | width: 100%; }
| + | |
- | .button-group.even-8 li {
| + | |
- | width: 12.5%; }
| + | |
- | .button-group.even-8 li button, .button-group.even-8 li .button {
| + | |
- | width: 100%; }
| + | |
| | | |
- | .button-bar { | + | /* Using forms within rows, we need to set some defaults */ |
- | *zoom: 1; } | + | form .row .row { |
- | .button-bar:before, .button-bar:after { | + | margin: 0 -0.5em; } |
- | content: " "; | + | form .row .row .column, |
- | display: table; } | + | form .row .row .columns { |
- | .button-bar:after { | + | padding: 0 0.5em; } |
- | clear: both; } | + | form .row .row.collapse { |
- | .button-bar .button-group { | + | margin: 0; } |
- | float: left; | + | form .row .row.collapse .column, |
- | margin-right: 0.625em; } | + | form .row .row.collapse .columns { |
- | .button-bar .button-group div {
| + | padding: 0; } |
- | overflow: hidden; } | + | form .row input.column, |
| + | form .row input.columns, |
| + | form .row textarea.column, |
| + | form .row textarea.columns { |
| + | padding-left: 0.5em; } |
| + | |
| + | /* Attach elements to the beginning or end of an input */ |
| + | .prefix, |
| + | .postfix { |
| + | display: block; |
| + | position: relative; |
| + | z-index: 2; |
| + | text-align: center; |
| + | width: 100%; |
| + | padding-top: 0; |
| + | padding-bottom: 0; |
| + | border-style: solid; |
| + | border-width: 1px; |
| + | overflow: hidden; |
| + | font-size: 0.875em; |
| + | height: 2.3125em; |
| + | line-height: 2.3125em; } |
| | | |
| /* Dropdown Button */ | | /* Dropdown Button */ |
Line 1,368: |
Line 891: |
| border-color: #333333 transparent transparent transparent; } | | border-color: #333333 transparent transparent transparent; } |
| | | |
- | /* Split Buttons */ | + | /* Panels */ |
- | .split.button { | + | .panel { |
- | position: relative; | + | border-style: solid; |
- | padding-right: 4.8em; } | + | border-width: 1px; |
- | .split.button span {
| + | border-color: #d9d9d9; |
- | display: block; | + | margin-bottom: 1.25em; |
- | height: 100%; | + | padding: 1.25em; |
- | position: absolute; | + | background: #f2f2f2; } |
- | right: 0; | + | .panel > :first-child { |
- | top: 0;
| + | margin-top: 0; } |
- | border-left: solid 1px; } | + | .panel > :last-child { |
- | .split.button span:before { | + | margin-bottom: 0; } |
- | position: absolute; | + | .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p { |
- | content: "";
| + | color: #333333; } |
- | width: 0;
| + | .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 { |
- | height: 0;
| + | line-height: 1; |
- | display: block;
| + | margin-bottom: 0.625em; } |
- | border-style: inset;
| + | .panel h1.subheader, .panel h2.subheader, .panel h3.subheader, .panel h4.subheader, .panel h5.subheader, .panel h6.subheader { |
- | left: 50%; }
| + | line-height: 1.4; } |
- | .split.button span:active { | + | .panel.callout { |
- | background-color: rgba(0, 0, 0, 0.1); }
| + | border-style: solid; |
- | .split.button span { | + | border-width: 1px; |
- | border-left-color: #1e728c; } | + | border-color: #2284a1; |
- | .split.button span { | + | margin-bottom: 1.25em; |
- | width: 3em; }
| + | padding: 1.25em; |
- | .split.button span:before { | + | background: #2ba6cb; |
- | border-top-style: solid; | + | -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; |
- | border-width: 0.5625em;
| + | box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; } |
- | top: 1.125em;
| + | .panel.callout > :first-child { |
- | margin-left: -0.5625em; } | + | margin-top: 0; } |
- | .split.button span:before { | + | .panel.callout > :last-child { |
- | border-color: white transparent transparent transparent; }
| + | margin-bottom: 0; } |
- | .split.button.secondary span { | + | .panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6, .panel.callout p { |
- | border-left-color: #c3c3c3; } | + | color: white; } |
- | .split.button.secondary span:before { | + | .panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6 { |
- | border-color: white transparent transparent transparent; } | + | line-height: 1; |
- | .split.button.alert span {
| + | margin-bottom: 0.625em; } |
- | border-left-color: #7f0a0c; } | + | .panel.callout h1.subheader, .panel.callout h2.subheader, .panel.callout h3.subheader, .panel.callout h4.subheader, .panel.callout h5.subheader, .panel.callout h6.subheader { |
- | .split.button.success span {
| + | line-height: 1.4; } |
- | border-left-color: #396516; } | + | .panel.radius { |
- | .split.button.tiny {
| + | -webkit-border-radius: 3px; |
- | padding-right: 3.9375em; } | + | border-radius: 3px; } |
- | .split.button.tiny span {
| + | |
- | width: 2.84375em; } | + | |
- | .split.button.tiny span:before {
| + | |
- | border-top-style: solid; | + | |
- | border-width: 0.4375em; | + | |
- | top: 0.875em;
| + | |
- | margin-left: -0.3125em; } | + | |
- | .split.button.small { | + | |
- | padding-right: 3.9375em; } | + | |
- | .split.button.small span { | + | |
- | width: 2.8125em; } | + | |
- | .split.button.small span:before { | + | |
- | border-top-style: solid;
| + | |
- | border-width: 0.5625em;
| + | |
- | top: 0.84375em;
| + | |
- | margin-left: -0.5625em; }
| + | |
- | .split.button.large { | + | |
- | padding-right: 6em; } | + | |
- | .split.button.large span { | + | |
- | width: 3.75em; }
| + | |
- | .split.button.large span:before { | + | |
- | border-top-style: solid; | + | |
- | border-width: 0.625em;
| + | |
- | top: 1.3125em;
| + | |
- | margin-left: -0.5625em; } | + | |
- | .split.button.expand { | + | |
- | padding-left: 2em; }
| + | |
- | .split.button.secondary span:before { | + | |
- | border-color: #333333 transparent transparent transparent; } | + | |
- | .split.button.radius span { | + | |
- | -moz-border-radius-topright: 3px;
| + | |
- | -moz-border-radius-bottomright: 3px;
| + | |
- | -webkit-border-top-right-radius: 3px; | + | |
- | -webkit-border-bottom-right-radius: 3px; | + | |
- | border-top-right-radius: 3px;
| + | |
- | border-bottom-right-radius: 3px; }
| + | |
- | .split.button.round span {
| + | |
- | -moz-border-radius-topright: 1000px;
| + | |
- | -moz-border-radius-bottomright: 1000px;
| + | |
- | -webkit-border-top-right-radius: 1000px;
| + | |
- | -webkit-border-bottom-right-radius: 1000px;
| + | |
- | border-top-right-radius: 1000px;
| + | |
- | border-bottom-right-radius: 1000px; }
| + | |
| | | |
| | | |
Line 1,654: |
Line 1,134: |
| | | |
| .top-bar-js-breakpoint { | | .top-bar-js-breakpoint { |
- | width: 58.75em !important; | + | width: 300em !important; |
| visibility: hidden; } | | visibility: hidden; } |
| | | |
- | .js-generated {
| + | @media only screen and (min-width: 5em) { |
- | display: block; }
| + | |
- | | + | |
- | @media only screen and (min-width: 58.75em) { | + | |
| .top-bar { | | .top-bar { |
| background: #cee163; | | background: #cee163; |
Line 1,776: |
Line 1,253: |
| .no-js .top-bar-section .has-dropdown:hover > .dropdown { | | .no-js .top-bar-section .has-dropdown:hover > .dropdown { |
| visibility: visible; } } | | visibility: visible; } } |
| + | |
| + | |
| + | .js-generated { |
| + | display: block; } |
| + | |
| @-webkit-keyframes rotate { | | @-webkit-keyframes rotate { |
| from { | | from { |
Line 1,803: |
Line 1,285: |
| to { | | to { |
| -webkit-transform: rotate(360deg); } } | | -webkit-transform: rotate(360deg); } } |
| + | |
| /* Clearing Styles */ | | /* Clearing Styles */ |
| [data-clearing] { | | [data-clearing] { |
Line 1,960: |
Line 1,443: |
| right: 20px; | | right: 20px; |
| padding-left: 0; | | padding-left: 0; |
- | padding-top: 0; } | + | padding-top: 0; } } |
| + | |
| | | |
| /* Breadcrumbs */ | | /* Breadcrumbs */ |
Line 2,012: |
Line 1,496: |
| content: " "; | | content: " "; |
| margin: 0; } | | margin: 0; } |
- |
| |
- | /* Custom Checkbox and Radio Inputs */
| |
- | form.custom .hidden-field {
| |
- | margin-left: -99999px;
| |
- | position: absolute;
| |
- | visibility: hidden; }
| |
- | form.custom .custom {
| |
- | display: inline-block;
| |
- | width: 16px;
| |
- | height: 16px;
| |
- | position: relative;
| |
- | top: -1px;
| |
- | /* fix centering issue */
| |
- | vertical-align: middle;
| |
- | border: solid 1px #cccccc;
| |
- | background: white; }
| |
- | form.custom .custom.checkbox {
| |
- | -webkit-border-radius: 0px;
| |
- | border-radius: 0px;
| |
- | padding: -1px; }
| |
- | form.custom .custom.radio {
| |
- | -webkit-border-radius: 1000px;
| |
- | border-radius: 1000px;
| |
- | padding: 3px; }
| |
- | form.custom .custom.checkbox:before {
| |
- | content: "";
| |
- | display: block;
| |
- | font-size: 16px;
| |
- | color: white; }
| |
- | form.custom .custom.radio.checked:before {
| |
- | content: "";
| |
- | display: block;
| |
- | width: 8px;
| |
- | height: 8px;
| |
- | -webkit-border-radius: 1000px;
| |
- | border-radius: 1000px;
| |
- | background: #222222;
| |
- | position: relative; }
| |
- | form.custom .custom.checkbox.checked:before {
| |
- | content: "\00d7";
| |
- | color: #222222;
| |
- | position: absolute;
| |
- | top: -50%;
| |
- | left: 50%;
| |
- | margin-top: 4px;
| |
- | margin-left: -5px; }
| |
- |
| |
- | /* Custom Select Options and Dropdowns */
| |
- | form.custom {
| |
- | /* Custom input, disabled */ }
| |
- | form.custom .custom.dropdown {
| |
- | display: block;
| |
- | position: relative;
| |
- | top: 0;
| |
- | height: 2.3125em;
| |
- | margin-bottom: 1.25em;
| |
- | margin-top: 0px;
| |
- | padding: 0px;
| |
- | width: 100%;
| |
- | background: white;
| |
- | background: -moz-linear-gradient(top, white 0%, #f3f3f3 100%);
| |
- | background: -webkit-linear-gradient(top, white 0%, #f3f3f3 100%);
| |
- | -webkit-box-shadow: none;
| |
- | background: linear-gradient(to bottom, white 0%, #f3f3f3 100%);
| |
- | box-shadow: none;
| |
- | font-size: 0.875em;
| |
- | vertical-align: top; }
| |
- | form.custom .custom.dropdown ul {
| |
- | overflow-y: auto;
| |
- | max-height: 200px; }
| |
- | form.custom .custom.dropdown .current {
| |
- | cursor: default;
| |
- | white-space: nowrap;
| |
- | line-height: 2.25em;
| |
- | color: rgba(0, 0, 0, 0.75);
| |
- | text-decoration: none;
| |
- | overflow: hidden;
| |
- | display: block;
| |
- | margin-left: 0.5em;
| |
- | margin-right: 2.3125em; }
| |
- | form.custom .custom.dropdown .selector {
| |
- | cursor: default;
| |
- | position: absolute;
| |
- | width: 2.5em;
| |
- | height: 2.3125em;
| |
- | display: block;
| |
- | right: 0;
| |
- | top: 0; }
| |
- | form.custom .custom.dropdown .selector:after {
| |
- | content: "";
| |
- | display: block;
| |
- | content: "";
| |
- | display: block;
| |
- | width: 0;
| |
- | height: 0;
| |
- | border: inset 5px;
| |
- | border-color: #aaaaaa transparent transparent transparent;
| |
- | border-top-style: solid;
| |
- | position: absolute;
| |
- | left: 0.9375em;
| |
- | top: 50%;
| |
- | margin-top: -3px; }
| |
- | form.custom .custom.dropdown:hover a.selector:after, form.custom .custom.dropdown.open a.selector:after {
| |
- | content: "";
| |
- | display: block;
| |
- | width: 0;
| |
- | height: 0;
| |
- | border: inset 5px;
| |
- | border-color: #222222 transparent transparent transparent;
| |
- | border-top-style: solid; }
| |
- | form.custom .custom.dropdown .disabled {
| |
- | color: #888888; }
| |
- | form.custom .custom.dropdown .disabled:hover {
| |
- | background: transparent;
| |
- | color: #888888; }
| |
- | form.custom .custom.dropdown .disabled:hover:after {
| |
- | display: none; }
| |
- | form.custom .custom.dropdown.open ul {
| |
- | display: block;
| |
- | z-index: 10;
| |
- | min-width: 100%;
| |
- | -moz-box-sizing: content-box;
| |
- | -webkit-box-sizing: content-box;
| |
- | box-sizing: content-box; }
| |
- | form.custom .custom.dropdown.small {
| |
- | max-width: 134px; }
| |
- | form.custom .custom.dropdown.medium {
| |
- | max-width: 254px; }
| |
- | form.custom .custom.dropdown.large {
| |
- | max-width: 434px; }
| |
- | form.custom .custom.dropdown.expand {
| |
- | width: 100% !important; }
| |
- | form.custom .custom.dropdown.open.small ul {
| |
- | min-width: 134px;
| |
- | -moz-box-sizing: border-box;
| |
- | -webkit-box-sizing: border-box;
| |
- | box-sizing: border-box; }
| |
- | form.custom .custom.dropdown.open.medium ul {
| |
- | min-width: 254px;
| |
- | -moz-box-sizing: border-box;
| |
- | -webkit-box-sizing: border-box;
| |
- | box-sizing: border-box; }
| |
- | form.custom .custom.dropdown.open.large ul {
| |
- | min-width: 434px;
| |
- | -moz-box-sizing: border-box;
| |
- | -webkit-box-sizing: border-box;
| |
- | box-sizing: border-box; }
| |
- | form.custom .error .custom.dropdown {
| |
- | border-color: #c60f13;
| |
- | background-color: rgba(198, 15, 19, 0.1);
| |
- | background: rgba(198, 15, 19, 0.1);
| |
- | margin-bottom: 0; }
| |
- | form.custom .error .custom.dropdown:focus {
| |
- | background: #fafafa;
| |
- | border-color: #999999; }
| |
- | form.custom .error .custom.dropdown + small.error {
| |
- | margin-top: 0; }
| |
- | form.custom .custom.dropdown ul {
| |
- | position: absolute;
| |
- | width: auto;
| |
- | display: none;
| |
- | margin: 0;
| |
- | left: -1px;
| |
- | top: auto;
| |
- | -webkit-box-shadow: 0 2px 2px 0px rgba(0, 0, 0, 0.1);
| |
- | box-shadow: 0 2px 2px 0px rgba(0, 0, 0, 0.1);
| |
- | margin: 0;
| |
- | padding: 0;
| |
- | background: white;
| |
- | border: solid 1px #cccccc;
| |
- | font-size: 16; }
| |
- | form.custom .custom.dropdown ul li {
| |
- | color: #555555;
| |
- | font-size: 0.875em;
| |
- | cursor: default;
| |
- | padding-top: 0.25em;
| |
- | padding-bottom: 0.25em;
| |
- | padding-left: 0.375em;
| |
- | padding-right: 2.375em;
| |
- | min-height: 1.5em;
| |
- | line-height: 1.5em;
| |
- | margin: 0;
| |
- | white-space: nowrap;
| |
- | list-style: none; }
| |
- | form.custom .custom.dropdown ul li.selected {
| |
- | background: #eeeeee;
| |
- | color: black; }
| |
- | form.custom .custom.dropdown ul li:hover {
| |
- | background-color: #e4e4e4;
| |
- | color: black; }
| |
- | form.custom .custom.dropdown ul li.selected:hover {
| |
- | background: #eeeeee;
| |
- | cursor: default;
| |
- | color: black; }
| |
- | form.custom .custom.dropdown ul.show {
| |
- | display: block; }
| |
- | form.custom .custom.disabled {
| |
- | background: #dddddd; }
| |
- |
| |
- | /* Labels */
| |
- | .label {
| |
- | font-weight: bold;
| |
- | text-align: center;
| |
- | text-decoration: none;
| |
- | line-height: 1;
| |
- | white-space: nowrap;
| |
- | display: inline-block;
| |
- | position: relative;
| |
- | padding: 0.1875em 0.625em 0.25em;
| |
- | font-size: 0.875em;
| |
- | background-color: #2ba6cb;
| |
- | color: white; }
| |
- | .label.radius {
| |
- | -webkit-border-radius: 3px;
| |
- | border-radius: 3px; }
| |
- | .label.round {
| |
- | -webkit-border-radius: 1000px;
| |
- | border-radius: 1000px; }
| |
- | .label.alert {
| |
- | background-color: #c60f13;
| |
- | color: white; }
| |
- | .label.success {
| |
- | background-color: #5da423;
| |
- | color: white; }
| |
- | .label.secondary {
| |
- | background-color: #e9e9e9;
| |
- | color: #333333; }
| |
- |
| |
- | /* Inline Lists */
| |
- | .inline-list {
| |
- | margin: 0 auto 1.0625em auto;
| |
- | margin-left: -1.375em;
| |
- | margin-right: 0;
| |
- | padding: 0;
| |
- | list-style: none;
| |
- | overflow: hidden; }
| |
- | .inline-list > li {
| |
- | list-style: none;
| |
- | float: left;
| |
- | margin-left: 1.375em;
| |
- | display: block; }
| |
- | .inline-list > li > * {
| |
- | display: block; }
| |
- |
| |
- | /* Default Pagination */
| |
- | ul.pagination {
| |
- | display: block;
| |
- | height: 1.5em;
| |
- | margin-left: -0.3125em; }
| |
- | ul.pagination li {
| |
- | height: 1.5em;
| |
- | color: #222222;
| |
- | font-size: 0.875em;
| |
- | margin-left: 0.3125em; }
| |
- | ul.pagination li a {
| |
- | display: block;
| |
- | padding: 0.0625em 0.4375em 0.0625em;
| |
- | color: #999999; }
| |
- | ul.pagination li:hover a,
| |
- | ul.pagination li a:focus {
| |
- | background: #e6e6e6; }
| |
- | ul.pagination li.unavailable a {
| |
- | cursor: default;
| |
- | color: #999999; }
| |
- | ul.pagination li.unavailable:hover a, ul.pagination li.unavailable a:focus {
| |
- | background: transparent; }
| |
- | ul.pagination li.current a {
| |
- | background: #2ba6cb;
| |
- | color: white;
| |
- | font-weight: bold;
| |
- | cursor: default; }
| |
- | ul.pagination li.current a:hover, ul.pagination li.current a:focus {
| |
- | background: #2ba6cb; }
| |
- | ul.pagination li {
| |
- | float: left;
| |
- | display: block; }
| |
- |
| |
- | /* Pagination centred wrapper */
| |
- | .pagination-centered {
| |
- | text-align: center; }
| |
- | .pagination-centered ul.pagination li {
| |
- | float: none;
| |
- | display: inline-block; }
| |
- |
| |
- | /* Panels */
| |
- | .panel {
| |
- | border-style: solid;
| |
- | border-width: 1px;
| |
- | border-color: #d9d9d9;
| |
- | margin-bottom: 1.25em;
| |
- | padding: 1.25em;
| |
- | background: #f2f2f2; }
| |
- | .panel > :first-child {
| |
- | margin-top: 0; }
| |
- | .panel > :last-child {
| |
- | margin-bottom: 0; }
| |
- | .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p {
| |
- | color: #333333; }
| |
- | .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 {
| |
- | line-height: 1;
| |
- | margin-bottom: 0.625em; }
| |
- | .panel h1.subheader, .panel h2.subheader, .panel h3.subheader, .panel h4.subheader, .panel h5.subheader, .panel h6.subheader {
| |
- | line-height: 1.4; }
| |
- | .panel.callout {
| |
- | border-style: solid;
| |
- | border-width: 1px;
| |
- | border-color: #2284a1;
| |
- | margin-bottom: 1.25em;
| |
- | padding: 1.25em;
| |
- | background: #2ba6cb;
| |
- | -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
| |
- | box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; }
| |
- | .panel.callout > :first-child {
| |
- | margin-top: 0; }
| |
- | .panel.callout > :last-child {
| |
- | margin-bottom: 0; }
| |
- | .panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6, .panel.callout p {
| |
- | color: white; }
| |
- | .panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6 {
| |
- | line-height: 1;
| |
- | margin-bottom: 0.625em; }
| |
- | .panel.callout h1.subheader, .panel.callout h2.subheader, .panel.callout h3.subheader, .panel.callout h4.subheader, .panel.callout h5.subheader, .panel.callout h6.subheader {
| |
- | line-height: 1.4; }
| |
- | .panel.radius {
| |
- | -webkit-border-radius: 3px;
| |
- | border-radius: 3px; }
| |
| | | |
| /* Side Nav */ | | /* Side Nav */ |
Line 2,614: |
Line 1,772: |
| display: inline-block; } | | display: inline-block; } |
| | | |
- | /* Tooltips */
| |
- | .has-tip {
| |
- | border-bottom: dotted 1px #cccccc;
| |
- | cursor: help;
| |
- | font-weight: bold;
| |
- | color: #333333; }
| |
- | .has-tip:hover, .has-tip:focus {
| |
- | border-bottom: dotted 1px #196177;
| |
- | color: #2ba6cb; }
| |
- | .has-tip.tip-left, .has-tip.tip-right {
| |
- | float: none !important; }
| |
- |
| |
- | .tooltip {
| |
- | display: none;
| |
- | position: absolute;
| |
- | z-index: 999;
| |
- | font-weight: bold;
| |
- | font-size: 0.9375em;
| |
- | line-height: 1.3;
| |
- | padding: 0.5em;
| |
- | max-width: 85%;
| |
- | left: 50%;
| |
- | width: 100%;
| |
- | color: white;
| |
- | background: black;
| |
- | -webkit-border-radius: 3px;
| |
- | border-radius: 3px; }
| |
- | .tooltip > .nub {
| |
- | display: block;
| |
- | left: 5px;
| |
- | position: absolute;
| |
- | width: 0;
| |
- | height: 0;
| |
- | border: solid 5px;
| |
- | border-color: transparent transparent black transparent;
| |
- | top: -10px; }
| |
- | .tooltip.opened {
| |
- | color: #2ba6cb !important;
| |
- | border-bottom: dotted 1px #196177 !important; }
| |
- |
| |
- | .tap-to-close {
| |
- | display: block;
| |
- | font-size: 0.625em;
| |
- | color: #888888;
| |
- | font-weight: normal; }
| |
- |
| |
- | @media only screen and (min-width: 768px) {
| |
- | .tooltip > .nub {
| |
- | border-color: transparent transparent black transparent;
| |
- | top: -10px; }
| |
- | .tooltip.tip-top > .nub {
| |
- | border-color: black transparent transparent transparent;
| |
- | top: auto;
| |
- | bottom: -10px; }
| |
- | .tooltip.tip-left, .tooltip.tip-right {
| |
- | float: none !important; }
| |
- | .tooltip.tip-left > .nub {
| |
- | border-color: transparent transparent transparent black;
| |
- | right: -10px;
| |
- | left: auto;
| |
- | top: 50%;
| |
- | margin-top: -5px; }
| |
- | .tooltip.tip-right > .nub {
| |
- | border-color: transparent black transparent transparent;
| |
- | right: auto;
| |
- | left: -10px;
| |
- | top: 50%;
| |
- | margin-top: -5px; } }
| |
| @media only screen and (max-width: 767px) { | | @media only screen and (max-width: 767px) { |
| .f-dropdown { | | .f-dropdown { |
Line 2,865: |
Line 1,955: |
| h3 { | | h3 { |
| font-size: 1.9em; | | font-size: 1.9em; |
| + | border-bottom: 1px solid #ccc; |
| } | | } |
| | | |
Line 2,915: |
Line 2,006: |
| margin-bottom: 20px; | | margin-bottom: 20px; |
| } | | } |
- |
| |
- |
| |
| </style> | | </style> |