Last active
August 29, 2015 14:15
-
-
Save tatemz/bde16d9fa5f75ff6091c to your computer and use it in GitHub Desktop.
An example how css-condense can optimize Foundation Apps (line breaks are turned on for better visual).
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* AUTOCOMPLETE */ | |
.autocomplete{ | |
width: 100%; | |
position: relative; | |
} | |
.autocomplete input{ | |
font-size: 1.2em; | |
width: 100%; | |
padding:0.4em; | |
} | |
.autocomplete ul{ | |
position: absolute; | |
left: 0; | |
width: 100%; | |
border-left: 1px solid #888; | |
border-right: 1px solid #888; | |
border-bottom: 1px solid #888; | |
z-index: 1; | |
} | |
.autocomplete li{ | |
text-align: left; | |
list-style:none; | |
width: 100%; | |
padding:0.4em; | |
background-color: #fff; | |
} | |
.autocomplete li.active{ | |
width: 100%; | |
background-color: #4bf; | |
} | |
.autocomplete .highlight { | |
background-color: #E2E2E2; | |
} | |
.autocomplete li.active .highlight { | |
background: #666; | |
color: #fff; | |
} | |
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */ | |
@-webkit-keyframes shake { | |
0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { | |
-webkit-transform: translateX(7%); | |
transform: translateX(7%) | |
} | |
5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { | |
-webkit-transform: translateX(-7%); | |
transform: translateX(-7%) | |
} | |
100% { | |
-webkit-transform: translateX(0); | |
transform: translateX(0) | |
} | |
} | |
@keyframes shake { | |
0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { | |
-webkit-transform: translateX(7%); | |
transform: translateX(7%) | |
} | |
5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { | |
-webkit-transform: translateX(-7%); | |
transform: translateX(-7%) | |
} | |
100% { | |
-webkit-transform: translateX(0); | |
transform: translateX(0) | |
} | |
} | |
@-webkit-keyframes spin-cw { | |
0% { | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg) | |
} | |
100% { | |
-webkit-transform: rotate(360deg); | |
transform: rotate(360deg) | |
} | |
} | |
@keyframes spin-cw { | |
0% { | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg) | |
} | |
100% { | |
-webkit-transform: rotate(360deg); | |
transform: rotate(360deg) | |
} | |
} | |
@-webkit-keyframes spin-ccw { | |
0% { | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg) | |
} | |
100% { | |
-webkit-transform: rotate(-360deg); | |
transform: rotate(-360deg) | |
} | |
} | |
@keyframes spin-ccw { | |
0% { | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg) | |
} | |
100% { | |
-webkit-transform: rotate(-360deg); | |
transform: rotate(-360deg) | |
} | |
} | |
@-webkit-keyframes wiggle { | |
40%, 50%, 60% { | |
-webkit-transform: rotate(7deg); | |
transform: rotate(7deg) | |
} | |
35%, 45%, 55%, 65% { | |
-webkit-transform: rotate(-7deg); | |
transform: rotate(-7deg) | |
} | |
0%, 30%, 70%, 100% { | |
-webkit-transform: rotate(0); | |
transform: rotate(0) | |
} | |
} | |
@keyframes wiggle { | |
40%, 50%, 60% { | |
-webkit-transform: rotate(7deg); | |
transform: rotate(7deg) | |
} | |
35%, 45%, 55%, 65% { | |
-webkit-transform: rotate(-7deg); | |
transform: rotate(-7deg) | |
} | |
0%, 30%, 70%, 100% { | |
-webkit-transform: rotate(0); | |
transform: rotate(0) | |
} | |
} | |
@font-face { | |
font-family: zurb-logo; | |
font-style: normal; | |
font-weight: normal; | |
src: url(../fonts/zurb-webfont.eot); | |
src: url(../fonts/zurb-webfont.eot?#iefix) format("embedded-opentype"), url(../fonts/zurb-webfont.woff) format("woff"), url(../fonts/zurb-webfont.ttf) format("truetype"), url(../fonts/zurb-webfont.svg) format("svg") | |
} | |
audio, | |
canvas, | |
progress, | |
video { | |
display: inline-block; | |
vertical-align: baseline | |
} | |
audio:not([controls]) { | |
display: none; | |
height: 0 | |
} | |
abbr[title] { | |
border-bottom: 1px dotted | |
} | |
dfn { | |
font-style: italic | |
} | |
mark { | |
background: #ff0; | |
color: #000 | |
} | |
sub, | |
sup { | |
font-size: 75%; | |
line-height: 0; | |
position: relative; | |
vertical-align: baseline | |
} | |
sup { | |
top: -0.5em | |
} | |
sub { | |
bottom: -0.25em | |
} | |
svg:not(:root) { | |
overflow: hidden | |
} | |
figure { | |
margin: 1em 40px | |
} | |
code, | |
kbd, | |
pre, | |
samp { | |
font-family: monospace,monospace; | |
font-size: 1em | |
} | |
button, | |
input, | |
optgroup, | |
select, | |
textarea { | |
color: inherit; | |
font: inherit; | |
margin: 0 | |
} | |
button, | |
html input[type="button"], | |
input[type="reset"], | |
input[type="submit"] { | |
-webkit-appearance: button; | |
cursor: pointer | |
} | |
input { | |
line-height: normal | |
} | |
input[type="search"] { | |
-webkit-appearance: textfield; | |
box-sizing: content-box | |
} | |
input[type="search"]::-webkit-search-cancel-button, | |
input[type="search"]::-webkit-search-decoration { | |
-webkit-appearance: none | |
} | |
fieldset { | |
border: 1px solid #c0c0c0; | |
margin: 0 2px; | |
padding: .35em .625em .75em | |
} | |
button::-moz-focus-inner, | |
input::-moz-focus-inner, | |
legend { | |
border: 0; | |
padding: 0 | |
} | |
pre, | |
textarea { | |
overflow: auto | |
} | |
table { | |
border-collapse: collapse; | |
border-spacing: 0 | |
} | |
meta.foundation-version { | |
font-family: 1.0.2 | |
} | |
meta.foundation-mq { | |
font-family: "small=0&medium=40rem&large=75rem&xlarge=90rem&xxlarge=120rem" | |
} | |
body, | |
html { | |
font-size: 100%; | |
height: 100% | |
} | |
html { | |
box-sizing: border-box; | |
font-family: sans-serif; | |
-ms-text-size-adjust: 100%; | |
-webkit-text-size-adjust: 100% | |
} | |
*, | |
*:after, | |
*:before { | |
box-sizing: inherit | |
} | |
body { | |
background: #fff; | |
color: #222; | |
font-family: Helvetica Neue,Helvetica,Helvetica,Arial,sans-serif; | |
-webkit-font-smoothing: antialiased; | |
font-style: normal; | |
font-weight: normal; | |
line-height: 1; | |
margin: 0; | |
-moz-osx-font-smoothing: grayscale; | |
padding: 0; | |
position: relative | |
} | |
img { | |
display: inline-block; | |
height: auto; | |
-ms-interpolation-mode: bicubic; | |
max-width: 100%; | |
vertical-align: middle | |
} | |
#map_canvas embed, | |
#map_canvas img, | |
#map_canvas object, | |
.map_canvas embed, | |
.map_canvas img, | |
.map_canvas object { | |
max-width: none!important | |
} | |
.iconic { | |
height: 1rem; | |
vertical-align: middle; | |
width: 1rem | |
} | |
a>.iconic { | |
margin-right: 0.25rem; | |
margin-top: -2px | |
} | |
.action-sheet-container { | |
display: inline-block; | |
position: relative | |
} | |
.action-sheet-container .button { | |
margin-left: 0; | |
margin-right: 0 | |
} | |
.action-sheet { | |
background: white; | |
bottom: 0; | |
box-shadow: 0 -3px 10px rgba(0,0,0,0.25); | |
left: 0; | |
padding: 1rem; | |
position: fixed; | |
text-align: center; | |
-webkit-transform: translateY(100%); | |
transform: translateY(100%); | |
transition-duration: 0.25s; | |
transition-property: -webkit-transform opacity; | |
transition-property: transform opacity; | |
transition-timing-function: ease-out; | |
width: 100%; | |
z-index: 1000 | |
} | |
.action-sheet.is-active { | |
-webkit-transform: translateY(0%); | |
transform: translateY(0%) | |
} | |
.action-sheet ul a { | |
border-top: 1px solid #ccc; | |
color: #000; | |
display: block; | |
line-height: 1; | |
padding: 0.8rem | |
} | |
.action-sheet ul a:hover { | |
background: #f2f2f2; | |
color: #000 | |
} | |
.action-sheet.primary { | |
background: #00558b; | |
border: 0; | |
color: #fff | |
} | |
.action-sheet.primary.top::after, | |
.action-sheet.primary.top::before { | |
border-bottom-color: #00558b | |
} | |
.action-sheet.primary ul a { | |
border-top: 1px solid #006cb0; | |
color: #fff; | |
display: block; | |
line-height: 1; | |
padding: 0.8rem | |
} | |
.action-sheet.primary ul a:hover { | |
background: #00609e; | |
color: #fff | |
} | |
.action-sheet.dark { | |
background: #232323; | |
border: 0; | |
color: #fff | |
} | |
.action-sheet.dark.top::after, | |
.action-sheet.dark.top::before { | |
border-bottom-color: #232323 | |
} | |
.action-sheet ul, | |
.action-sheet.dark ul, | |
.action-sheet.primary ul { | |
list-style-type: none; | |
margin: -1rem; | |
margin-top: 0; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
user-select: none | |
} | |
.action-sheet ul:first-child, | |
.action-sheet.dark ul:first-child, | |
.action-sheet.primary ul:first-child { | |
margin-top: -1rem | |
} | |
.action-sheet ul:first-child li:first-child, | |
.action-sheet.dark ul:first-child li:first-child, | |
.action-sheet.primary ul:first-child li:first-child { | |
border-top: 0 | |
} | |
.action-sheet.dark ul a { | |
border-top: 1px solid #393939; | |
color: #fff; | |
display: block; | |
line-height: 1; | |
padding: 0.8rem | |
} | |
.action-sheet.dark ul a:hover { | |
background: #2e2e2e; | |
color: #fff | |
} | |
.action-sheet ul .disabled>a, | |
.action-sheet.dark ul .disabled>a, | |
.action-sheet.primary ul .disabled>a { | |
color: #999; | |
pointer-events: none | |
} | |
.block-list { | |
font-size: 1rem; | |
line-height: 1; | |
margin-bottom: 1rem; | |
margin-left: -1rem; | |
margin-right: -1rem; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
user-select: none | |
} | |
.block-list [type="text"], | |
.block-list input[type="color"], | |
.block-list input[type="date"], | |
.block-list input[type="datetime"], | |
.block-list input[type="datetime-local"], | |
.block-list input[type="email"], | |
.block-list input[type="month"], | |
.block-list input[type="number"], | |
.block-list input[type="password"], | |
.block-list input[type="search"], | |
.block-list input[type="tel"], | |
.block-list input[type="time"], | |
.block-list input[type="url"], | |
.block-list input[type="week"], | |
.block-list textarea { | |
border: 0; | |
color: inherit; | |
height: auto; | |
line-height: 1; | |
margin: 0; | |
padding: 0.8rem 1rem | |
} | |
.block-list li>input[type="checkbox"]+label, | |
.block-list li>input[type="radio"]+label { | |
font-size: 1rem; | |
margin: 0 | |
} | |
.block-list li>input[type="checkbox"]:checked+label::before, | |
.block-list li>input[type="radio"]:checked+label::before { | |
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="32" viewBox="0 0 32 32"><path fill="#000" d="M16 0c-8.837 0-16 7.163-16 16s7.163 16 16 16 16-7.163 16-16-7.163-16-16-16zm6.906 8.875l2.219 2.031-12.063 13.281-6.188-6.188 2.125-2.125 3.938 3.938 9.969-10.938z"/></svg>'); | |
background-size: 100% 100%; | |
color: #00558b; | |
content: ''; | |
float: right; | |
height: 1.5em; | |
margin-top: -0.25em; | |
pointer-events: none; | |
width: 1.5em | |
} | |
@media screen and (min-width: 0\0) { | |
.block-list li>input[type="checkbox"]:checked+label::before, | |
.block-list li>input[type="radio"]:checked+label::before { | |
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAdlJREFUeNrMl0FugzAQRY3TRZeoFyhVL0BOkGTXJezaHZwguUnECaCrdFd6gqQnCN11Uyk5QekNOlONJWMVGMCgfGlkEIY3HnsG2xFM3d96PjQB2AJsWdPtAPYOln+dTwXnuw4DHEGzBvNFN6EDCTiS9XIAwB40acNoucKoxODIie0AwAOCu8KOSnIiNx/MakK+A7sW9oTferxx3fP3T1nURoBG/irGVahHwjHm/Ggx7E3TMVdrQmoP0gngghhpZQ3QvG/EdPLUelARWI8Aycjq9Md0qMIdbcNhjmOKLoY7quk3l1Rebeqg4AwFkmq7LWGOh1pmNY0etZAWSq0OX8HoS4JvWuCopbSY26EGR/CW86K0BF+pwkLwlPuyHJhOCl5oe4ZtF++vOqST+GdOYwO+71pN2VNAjmQGPCe42weuHDg0PI8olUwnYrXTGQJH9gxq8l1LKvrQx4O6/YY32Kp/ugb3ey7gZ4xAzuhYiYTxB/UHZFAuaREVXZ2g6yFlvEC2yoKEmbsRZYNgVLk2JeaOaG+xLHN+WCszDWMqLGOrJFa1DlApjSdwoHJGqGzLIb0+cas0wh5Bh780ngswx8GJD7h8sHg2wLA/mfDLPZpdxOF0quP5rwADAAFIzSRvu1m5AAAAAElFTkSuQmCC) | |
} | |
} | |
.block-list .with-dropdown select { | |
-webkit-appearance: none; | |
-moz-appearance: none; | |
background: 0; | |
background-color: transparent; | |
border: 0; | |
color: inherit; | |
font-size: 1em; | |
height: auto; | |
line-height: 1; | |
margin: 0; | |
outline: 0; | |
padding: 0.8rem 1rem | |
} | |
.block-list .switch { | |
position: absolute; | |
right: 1rem; | |
top: 50%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%) | |
} | |
.block-list.with-icons li>a, | |
.block-list.with-icons li>label, | |
.block-list.with-icons li>span { | |
padding-left: 2.8rem | |
} | |
.block-list.with-icons li .iconic, | |
.block-list.with-icons li img { | |
border-radius: 8px; | |
height: 2.08rem; | |
left: 0.26rem; | |
pointer-events: none; | |
position: absolute; | |
top: 0.26rem; | |
width: 2.08rem | |
} | |
.block-list header { | |
color: #666; | |
cursor: default; | |
font-size: .8em; | |
font-weight: bold; | |
margin-bottom: .5em; | |
margin-left: 1rem; | |
margin-top: 1em; | |
text-transform: uppercase | |
} | |
.block-list li { | |
border-bottom: 1px solid #d0d0d0; | |
position: relative | |
} | |
.block-list li:first-child { | |
border-top: 1px solid #d0d0d0 | |
} | |
.block-list li>a, | |
.block-list li>label, | |
.block-list li>span { | |
color: #000; | |
display: block; | |
line-height: 1; | |
padding: 0.8rem 1rem; | |
padding-left: 1rem | |
} | |
.block-list li select:hover, | |
.block-list li>a:hover, | |
.block-list li>label:hover { | |
background: #f4f4f4 | |
} | |
.action-sheet ul .alert>a, | |
.action-sheet.dark ul .alert>a, | |
.action-sheet.primary ul .alert>a, | |
.block-list li.caution>a, | |
.block-list li.caution>a:hover { | |
color: #f04124 | |
} | |
.block-list li.disabled>a, | |
.block-list li>span, | |
button[disabled], | |
html input[disabled] { | |
cursor: default | |
} | |
.block-list li.disabled>a, | |
.block-list li.disabled>a:hover { | |
color: #999 | |
} | |
.block-list li.disabled>a:hover, | |
a { | |
background: transparent | |
} | |
.block-list li.with-chevron::after { | |
color: #666; | |
content: '\203A'; | |
display: block; | |
font-size: 2em; | |
font-weight: bold; | |
position: absolute; | |
right: 1rem; | |
top: 50%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%) | |
} | |
.block-list li.with-chevron .block-list-label { | |
padding-right: 1.5rem | |
} | |
.block-list li .block-list-label { | |
color: #999; | |
display: inline-block; | |
float: right; | |
padding: 0; | |
pointer-events: none | |
} | |
.block-list li .block-list-label.left { | |
float: none; | |
margin-left: 0.8rem | |
} | |
.button, | |
.button-group>li>a, | |
.button-group>li>label { | |
-webkit-appearance: none; | |
border: 0; | |
border-radius: 0; | |
cursor: pointer; | |
display: inline-block; | |
font-size: 0.9rem; | |
-webkit-font-smoothing: antialiased; | |
line-height: 1; | |
margin: 0 1rem 1rem 0; | |
padding: .85em 1em; | |
text-align: center; | |
transition: background 0.25s ease-out; | |
vertical-align: middle | |
} | |
.button { | |
background: #00558b; | |
color: #fff; | |
display: inline-block; | |
font-size: 0.9rem; | |
margin: 0 1rem 1rem 0 | |
} | |
.button.info { | |
background: #a0d3e8; | |
color: #000 | |
} | |
.button.info:focus, | |
.button.info:hover { | |
background: #71bddd; | |
color: #000 | |
} | |
.button.dark:focus, | |
.button.dark:hover { | |
background: #1e1e1e; | |
color: #fff | |
} | |
.button.hollow { | |
background: transparent; | |
border: 1px solid #00558b; | |
color: #00558b | |
} | |
.button.hollow:focus, | |
.button.hollow:hover { | |
background: transparent; | |
border-color: #008ee8; | |
color: #008ee8 | |
} | |
.action-sheet.primary::after, | |
.action-sheet.primary::before, | |
.button.hollow[data-popup-toggle]::after { | |
border-top-color: #00558b | |
} | |
.button.hollow:hover .iconic *, | |
.button.hollow:hover .iconic *.iconic-property-accent { | |
fill: #008ee8; | |
stroke: #008ee8 | |
} | |
.button.hollow.secondary { | |
background: transparent; | |
border: 1px solid #f1f1f1; | |
color: #f1f1f1 | |
} | |
.button.hollow.secondary:focus, | |
.button.hollow.secondary:hover { | |
background: transparent; | |
border-color: #f4f4f4; | |
color: #f4f4f4 | |
} | |
.button.hollow.secondary[data-popup-toggle]::after { | |
border-top-color: #f1f1f1 | |
} | |
.button.hollow.secondary:hover .iconic *, | |
.button.hollow.secondary:hover .iconic *.iconic-property-accent { | |
fill: #f4f4f4; | |
stroke: #f4f4f4 | |
} | |
.button.hollow.success { | |
background: transparent; | |
border: 1px solid #43ac6a; | |
color: #43ac6a | |
} | |
.button.hollow.success:focus, | |
.button.hollow.success:hover { | |
background: transparent; | |
border-color: #6dc68e; | |
color: #6dc68e | |
} | |
.button.hollow.success[data-popup-toggle]::after { | |
border-top-color: #43ac6a | |
} | |
.button.hollow.success:hover .iconic *, | |
.button.hollow.success:hover .iconic *.iconic-property-accent { | |
fill: #6dc68e; | |
stroke: #6dc68e | |
} | |
.button.hollow.warning { | |
background: transparent; | |
border: 1px solid #f08a24; | |
color: #f08a24 | |
} | |
.button.hollow.warning:focus, | |
.button.hollow.warning:hover { | |
background: transparent; | |
border-color: #f4a75b; | |
color: #f4a75b | |
} | |
.button.hollow.warning[data-popup-toggle]::after { | |
border-top-color: #f08a24 | |
} | |
.button.hollow.warning:hover .iconic *, | |
.button.hollow.warning:hover .iconic *.iconic-property-accent { | |
fill: #f4a75b; | |
stroke: #f4a75b | |
} | |
.button.hollow.alert { | |
background: transparent; | |
border: 1px solid #f04124; | |
color: #f04124 | |
} | |
.button.hollow.alert:focus, | |
.button.hollow.alert:hover { | |
background: transparent; | |
border-color: #f4715b; | |
color: #f4715b | |
} | |
.button.hollow.alert[data-popup-toggle]::after { | |
border-top-color: #f04124 | |
} | |
.button.hollow.alert:hover .iconic *, | |
.button.hollow.alert:hover .iconic *.iconic-property-accent { | |
fill: #f4715b; | |
stroke: #f4715b | |
} | |
.button.hollow.info { | |
background: transparent; | |
border: 1px solid #a0d3e8; | |
color: #a0d3e8 | |
} | |
.button.hollow.info:focus, | |
.button.hollow.info:hover { | |
background: transparent; | |
border-color: #b8deee; | |
color: #b8deee | |
} | |
.button.hollow.info[data-popup-toggle]::after { | |
border-top-color: #a0d3e8 | |
} | |
.button.hollow.info .iconic *, | |
.button.hollow.info .iconic *.iconic-property-accent { | |
fill: #a0d3e8; | |
stroke: #a0d3e8 | |
} | |
.button.hollow.info:hover .iconic *, | |
.button.hollow.info:hover .iconic *.iconic-property-accent { | |
fill: #b8deee; | |
stroke: #b8deee | |
} | |
.button.hollow.dark { | |
background: transparent; | |
border: 1px solid #232323; | |
color: #232323 | |
} | |
.button.hollow.dark:focus, | |
.button.hollow.dark:hover { | |
background: transparent; | |
border-color: #5a5a5a; | |
color: #5a5a5a | |
} | |
.action-sheet.dark::after, | |
.action-sheet.dark::before, | |
.button.hollow.dark[data-popup-toggle]::after { | |
border-top-color: #232323 | |
} | |
.button.hollow.dark .iconic *, | |
.button.hollow.dark .iconic *.iconic-property-accent, | |
.iconic-color-dark *, | |
.iconic-color-dark *.iconic-property-accent { | |
fill: #232323; | |
stroke: #232323 | |
} | |
.button.hollow.dark:hover .iconic *, | |
.button.hollow.dark:hover .iconic *.iconic-property-accent { | |
fill: #5a5a5a; | |
stroke: #5a5a5a | |
} | |
.button.disabled, | |
.button.disabled.alert, | |
.button.disabled.dark, | |
.button.disabled.info, | |
.button.disabled.secondary, | |
.button.disabled.success, | |
.button.disabled.warning { | |
opacity: 0.5; | |
pointer-events: none | |
} | |
.button-group>li:not(:last-child)>a, | |
.button-group>li:not(:last-child)>label { | |
border-right: 1px solid #004068 | |
} | |
.button .iconic, | |
.button-group .iconic, | |
.button.large .iconic, | |
.button.small .iconic, | |
.button.tiny .iconic { | |
height: 1em; | |
margin-right: .25em; | |
margin-top: -2px; | |
vertical-align: middle; | |
width: 1em | |
} | |
.button-group.segmented, | |
.button-group.segmented.alert, | |
.button-group.segmented.secondary, | |
.button-group.segmented.success, | |
.button-group.segmented.warning { | |
border: 1px solid #00558b; | |
transition-property: background color | |
} | |
.block-list li>input[type="checkbox"], | |
.block-list li>input[type="radio"], | |
.button-group.segmented>li>input[type="radio"] { | |
left: -9999px; | |
position: absolute | |
} | |
.button-group.segmented.alert>li>a, | |
.button-group.segmented.alert>li>label, | |
.button-group.segmented.secondary>li>a, | |
.button-group.segmented.secondary>li>label, | |
.button-group.segmented.success>li>a, | |
.button-group.segmented.success>li>label, | |
.button-group.segmented.warning>li>a, | |
.button-group.segmented.warning>li>label, | |
.button-group.segmented>li>a, | |
.button-group.segmented>li>label { | |
background: transparent; | |
margin-right: 0 | |
} | |
.button-group { | |
border-radius: 0; | |
border-radius: 0; | |
display: -webkit-inline-flex; | |
display: -ms-inline-flexbox; | |
display: inline-flex; | |
display: -webkit-inline-flex; | |
display: -ms-inline-flexbox; | |
display: inline-flex; | |
list-style-type: none; | |
margin: 0; | |
margin-bottom: 1rem; | |
overflow: hidden | |
} | |
.button-group>li>a, | |
.button-group>li>label { | |
background: #00558b; | |
border-color: #004876; | |
border-radius: 0; | |
color: #fff; | |
display: block; | |
margin: 0 | |
} | |
.button-group>li>a:focus, | |
.button-group>li>a:hover, | |
.button-group>li>label:focus, | |
.button-group>li>label:hover, | |
.button:focus, | |
.button:hover { | |
background: #004876; | |
color: #fff | |
} | |
.button-group>li.is-active>a, | |
.button-group>li.is-active>label { | |
background: #004876 | |
} | |
.button-group.secondary>li>a, | |
.button-group.secondary>li>label { | |
background: #f1f1f1; | |
border-color: #cdcdcd; | |
color: #fff | |
} | |
.button-group.secondary>li>a:focus, | |
.button-group.secondary>li>a:hover, | |
.button-group.secondary>li>label:focus, | |
.button-group.secondary>li>label:hover { | |
background: #cdcdcd; | |
color: #fff | |
} | |
.button-group.secondary>li.is-active>a, | |
.button-group.secondary>li.is-active>label { | |
background: #cdcdcd | |
} | |
.button-group.success>li>a, | |
.button-group.success>li>label { | |
background: #43ac6a; | |
border-color: #39925a; | |
color: #fff | |
} | |
.button-group.success>li.is-active>a, | |
.button-group.success>li.is-active>label { | |
background: #39925a | |
} | |
.button-group.warning>li>a, | |
.button-group.warning>li>label { | |
background: #f08a24; | |
border-color: #dc750f; | |
color: #fff | |
} | |
.button-group.warning>li.is-active>a, | |
.button-group.warning>li.is-active>label { | |
background: #dc750f | |
} | |
.button-group.alert>li>a, | |
.button-group.alert>li>label { | |
background: #f04124; | |
border-color: #dc2c0f; | |
color: #fff | |
} | |
.button-group.alert>li.is-active>a, | |
.button-group.alert>li.is-active>label { | |
background: #dc2c0f | |
} | |
.button-group>li.secondary>a { | |
background: #f1f1f1; | |
border-color: #f1f1f1; | |
color: #000 | |
} | |
.button-group>li.secondary>a:focus, | |
.button-group>li.secondary>a:hover, | |
.button.secondary:focus, | |
.button.secondary:hover { | |
background: #cdcdcd; | |
color: #000 | |
} | |
.button-group>li.secondary>a[data-popup-toggle]::after, | |
.button.info[data-popup-toggle]::after, | |
.button.secondary[data-popup-toggle]::after { | |
border-top-color: #000 | |
} | |
.button-group>li.secondary>a:focus, | |
.button-group>li.secondary>a:hover { | |
border-color: #b5b5b5 | |
} | |
.button-group>li.success>a { | |
background: #43ac6a; | |
border-color: #43ac6a; | |
color: #fff | |
} | |
.button-group.success>li>a:focus, | |
.button-group.success>li>a:hover, | |
.button-group.success>li>label:focus, | |
.button-group.success>li>label:hover, | |
.button-group>li.success>a:focus, | |
.button-group>li.success>a:hover, | |
.button.success:focus, | |
.button.success:hover { | |
background: #39925a; | |
color: #fff | |
} | |
.button-group>li.success>a:focus, | |
.button-group>li.success>a:hover { | |
border-color: #32814f | |
} | |
.button-group>li.warning>a { | |
background: #f08a24; | |
border-color: #f08a24; | |
color: #fff | |
} | |
.button-group.warning>li>a:focus, | |
.button-group.warning>li>a:hover, | |
.button-group.warning>li>label:focus, | |
.button-group.warning>li>label:hover, | |
.button-group>li.warning>a:focus, | |
.button-group>li.warning>a:hover, | |
.button.warning:focus, | |
.button.warning:hover { | |
background: #dc750f; | |
color: #fff | |
} | |
.button-group>li.warning>a:focus, | |
.button-group>li.warning>a:hover { | |
border-color: #c2670d | |
} | |
.button-group>li.alert>a { | |
background: #f04124; | |
border-color: #f04124; | |
color: #fff | |
} | |
.button-group.alert>li>a:focus, | |
.button-group.alert>li>a:hover, | |
.button-group.alert>li>label:focus, | |
.button-group.alert>li>label:hover, | |
.button-group>li.alert>a:focus, | |
.button-group>li.alert>a:hover, | |
.button.alert:focus, | |
.button.alert:hover { | |
background: #dc2c0f; | |
color: #fff | |
} | |
.button-group.alert>li>a[data-popup-toggle]::after, | |
.button-group.alert>li>label[data-popup-toggle]::after, | |
.button-group.secondary>li>a[data-popup-toggle]::after, | |
.button-group.secondary>li>label[data-popup-toggle]::after, | |
.button-group.success>li>a[data-popup-toggle]::after, | |
.button-group.success>li>label[data-popup-toggle]::after, | |
.button-group.warning>li>a[data-popup-toggle]::after, | |
.button-group.warning>li>label[data-popup-toggle]::after, | |
.button-group>li.alert>a[data-popup-toggle]::after, | |
.button-group>li.success>a[data-popup-toggle]::after, | |
.button-group>li.warning>a[data-popup-toggle]::after, | |
.button-group>li>a[data-popup-toggle]::after, | |
.button-group>li>label[data-popup-toggle]::after, | |
.button.alert[data-popup-toggle]::after, | |
.button.dark[data-popup-toggle]::after, | |
.button.success[data-popup-toggle]::after, | |
.button.warning[data-popup-toggle]::after, | |
.button[data-popup-toggle]::after { | |
border-top-color: #fff | |
} | |
.button-group>li.alert>a:focus, | |
.button-group>li.alert>a:hover { | |
border-color: #c2270d | |
} | |
.button-group.segmented>li>a, | |
.button-group.segmented>li>label { | |
border-color: #00558b; | |
color: #00558b | |
} | |
.button-group.segmented>li>a:hover, | |
.button-group.segmented>li>label:hover { | |
background: rgba(0,85,139,0.25); | |
color: #00558b | |
} | |
.button-group.segmented>li>a .iconic *, | |
.button-group.segmented>li>a .iconic *.iconic-property-accent, | |
.button-group.segmented>li>label .iconic *, | |
.button-group.segmented>li>label .iconic *.iconic-property-accent, | |
.button.hollow .iconic *, | |
.button.hollow .iconic *.iconic-property-accent, | |
.iconic *, | |
.iconic *.iconic-property-accent, | |
.iconic-color-primary *, | |
.iconic-color-primary *.iconic-property-accent, | |
a>.iconic *, | |
a>.iconic *.iconic-property-accent { | |
fill: #00558b; | |
stroke: #00558b | |
} | |
.button-group.segmented.secondary { | |
border-color: #f1f1f1 | |
} | |
.button-group.segmented.secondary>li>a, | |
.button-group.segmented.secondary>li>label { | |
border-color: #f1f1f1; | |
color: #f1f1f1 | |
} | |
.button-group.segmented.secondary>li>a:hover, | |
.button-group.segmented.secondary>li>label:hover { | |
background: rgba(241,241,241,0.25); | |
color: #f1f1f1 | |
} | |
.button-group.segmented.secondary>li>a .iconic *, | |
.button-group.segmented.secondary>li>a .iconic *.iconic-property-accent, | |
.button-group.segmented.secondary>li>label .iconic *, | |
.button-group.segmented.secondary>li>label .iconic *.iconic-property-accent, | |
.button.hollow.secondary .iconic *, | |
.button.hollow.secondary .iconic *.iconic-property-accent { | |
fill: #f1f1f1; | |
stroke: #f1f1f1 | |
} | |
.button-group.segmented.secondary>li.is-active>a, | |
.button-group.segmented.secondary>li.is-active>a:hover, | |
.button-group.segmented.secondary>li>input:checked+label, | |
.button-group.segmented.secondary>li>input:checked+label:hover, | |
.button.secondary { | |
background: #f1f1f1; | |
color: #000 | |
} | |
.button-group.segmented.success { | |
border-color: #43ac6a | |
} | |
.button-group.segmented.success>li>a, | |
.button-group.segmented.success>li>label { | |
border-color: #43ac6a; | |
color: #43ac6a | |
} | |
.button-group.segmented.success>li>a:hover, | |
.button-group.segmented.success>li>label:hover { | |
background: rgba(67,172,106,0.25); | |
color: #43ac6a | |
} | |
.button-group.segmented.success>li>a .iconic *, | |
.button-group.segmented.success>li>a .iconic *.iconic-property-accent, | |
.button-group.segmented.success>li>label .iconic *, | |
.button-group.segmented.success>li>label .iconic *.iconic-property-accent, | |
.button.hollow.success .iconic *, | |
.button.hollow.success .iconic *.iconic-property-accent, | |
.iconic-color-success *, | |
.iconic-color-success *.iconic-property-accent { | |
fill: #43ac6a; | |
stroke: #43ac6a | |
} | |
.button-group.segmented.success>li.is-active>a, | |
.button-group.segmented.success>li.is-active>a:hover, | |
.button-group.segmented.success>li>input:checked+label, | |
.button-group.segmented.success>li>input:checked+label:hover, | |
.button.success { | |
background: #43ac6a; | |
color: #fff | |
} | |
.button-group.segmented.warning { | |
border-color: #f08a24 | |
} | |
.button-group.segmented.warning>li>a, | |
.button-group.segmented.warning>li>label { | |
border-color: #f08a24; | |
color: #f08a24 | |
} | |
.button-group.segmented.warning>li>a:hover, | |
.button-group.segmented.warning>li>label:hover { | |
background: rgba(240,138,36,0.25); | |
color: #f08a24 | |
} | |
.button-group.segmented.warning>li>a .iconic *, | |
.button-group.segmented.warning>li>a .iconic *.iconic-property-accent, | |
.button-group.segmented.warning>li>label .iconic *, | |
.button-group.segmented.warning>li>label .iconic *.iconic-property-accent, | |
.button.hollow.warning .iconic *, | |
.button.hollow.warning .iconic *.iconic-property-accent, | |
.iconic-color-warning *, | |
.iconic-color-warning *.iconic-property-accent { | |
fill: #f08a24; | |
stroke: #f08a24 | |
} | |
.button-group.segmented.warning>li.is-active>a, | |
.button-group.segmented.warning>li.is-active>a:hover, | |
.button-group.segmented.warning>li>input:checked+label, | |
.button-group.segmented.warning>li>input:checked+label:hover, | |
.button.warning { | |
background: #f08a24; | |
color: #fff | |
} | |
.button-group.segmented.alert { | |
border-color: #f04124 | |
} | |
.button-group.segmented.alert>li>a, | |
.button-group.segmented.alert>li>label { | |
border-color: #f04124; | |
color: #f04124 | |
} | |
.button-group.segmented.alert>li>a:hover, | |
.button-group.segmented.alert>li>label:hover { | |
background: rgba(240,65,36,0.25); | |
color: #f04124 | |
} | |
.button-group.segmented.alert>li>a .iconic *, | |
.button-group.segmented.alert>li>a .iconic *.iconic-property-accent, | |
.button-group.segmented.alert>li>label .iconic *, | |
.button-group.segmented.alert>li>label .iconic *.iconic-property-accent, | |
.button.hollow.alert .iconic *, | |
.button.hollow.alert .iconic *.iconic-property-accent, | |
.iconic-color-alert *, | |
.iconic-color-alert *.iconic-property-accent { | |
fill: #f04124; | |
stroke: #f04124 | |
} | |
.button-group.segmented.alert>li.is-active>a, | |
.button-group.segmented.alert>li.is-active>a:hover, | |
.button-group.segmented.alert>li>input:checked+label, | |
.button-group.segmented.alert>li>input:checked+label:hover, | |
.button.alert { | |
background: #f04124; | |
color: #fff | |
} | |
.button-group.tiny, | |
.button.tiny { | |
font-size: 0.63rem | |
} | |
.button-group.small, | |
.button.small { | |
font-size: 0.72rem | |
} | |
.button-group.large, | |
.button.large { | |
font-size: 1.17rem | |
} | |
.button-group.expand>li>a, | |
.button-group.expand>li>label, | |
.button.expand { | |
display: block; | |
margin-left: 0; | |
margin-right: 0 | |
} | |
.card { | |
background: #fff; | |
border: 1px solid #ededed; | |
border-radius: 4px; | |
box-shadow: 0 1px 2px rgba(0,0,0,0.2); | |
color: #000; | |
margin-bottom: 0.5rem; | |
overflow: hidden | |
} | |
.card.primary { | |
background: #00558b; | |
border: 0; | |
border-radius: 4px; | |
box-shadow: 0 1px 2px rgba(0,0,0,0.2); | |
color: #fff; | |
margin-bottom: 0.5rem; | |
overflow: hidden | |
} | |
.card.primary .card-divider { | |
background: #0065a5; | |
padding: 1rem | |
} | |
.card.success { | |
background: #43ac6a; | |
border: 0; | |
border-radius: 4px; | |
box-shadow: 0 1px 2px rgba(0,0,0,0.2); | |
color: #fff; | |
margin-bottom: 0.5rem; | |
overflow: hidden | |
} | |
.card.success .card-divider { | |
background: #4ab873; | |
padding: 1rem | |
} | |
.card.warning { | |
background: #f08a24; | |
border: 0; | |
border-radius: 4px; | |
box-shadow: 0 1px 2px rgba(0,0,0,0.2); | |
color: #fff; | |
margin-bottom: 0.5rem; | |
overflow: hidden | |
} | |
.card.warning .card-divider { | |
background: #f19233; | |
padding: 1rem | |
} | |
.card.alert { | |
background: #f04124; | |
border: 0; | |
border-radius: 4px; | |
box-shadow: 0 1px 2px rgba(0,0,0,0.2); | |
color: #fff; | |
margin-bottom: 0.5rem; | |
overflow: hidden | |
} | |
.card.alert .card-divider { | |
background: #f14e33; | |
padding: 1rem | |
} | |
.card.dark { | |
background: #232323; | |
border: 0; | |
border-radius: 4px; | |
box-shadow: 0 1px 2px rgba(0,0,0,0.2); | |
color: #fff; | |
margin-bottom: 0.5rem; | |
overflow: hidden | |
} | |
.block-list .with-dropdown, | |
.card h1, | |
.card h2, | |
.card h3, | |
.card h4, | |
.card h5, | |
.card h6, | |
.card.alert h1, | |
.card.alert h2, | |
.card.alert h3, | |
.card.alert h4, | |
.card.alert h5, | |
.card.alert h6, | |
.card.dark h1, | |
.card.dark h2, | |
.card.dark h3, | |
.card.dark h4, | |
.card.dark h5, | |
.card.dark h6, | |
.card.primary h1, | |
.card.primary h2, | |
.card.primary h3, | |
.card.primary h4, | |
.card.primary h5, | |
.card.primary h6, | |
.card.success h1, | |
.card.success h2, | |
.card.success h3, | |
.card.success h4, | |
.card.success h5, | |
.card.success h6, | |
.card.warning h1, | |
.card.warning h2, | |
.card.warning h3, | |
.card.warning h4, | |
.card.warning h5, | |
.card.warning h6 { | |
color: inherit | |
} | |
.card.dark .card-divider { | |
background: #323232; | |
padding: 1rem | |
} | |
.card-divider { | |
background: #ededed; | |
padding: 1rem | |
} | |
.close-button { | |
color: #999; | |
cursor: pointer; | |
font-size: 2em; | |
line-height: 0.5; | |
position: absolute; | |
right: 1rem; | |
top: 1rem | |
} | |
.close-button:hover { | |
color: #333 | |
} | |
.thumbnail, | |
ul.thumbnails>li img { | |
box-shadow: 0 3px 15px rgba(0,0,0,0.25); | |
padding: 0.5rem | |
} | |
[type="text"], | |
input[type="color"], | |
input[type="date"], | |
input[type="datetime"], | |
input[type="datetime-local"], | |
input[type="email"], | |
input[type="month"], | |
input[type="number"], | |
input[type="password"], | |
input[type="search"], | |
input[type="tel"], | |
input[type="time"], | |
input[type="url"], | |
input[type="week"], | |
textarea { | |
-webkit-appearance: none; | |
-moz-appearance: none; | |
background: #fff; | |
border: 1px solid #ccc; | |
border-radius: 0; | |
color: #000; | |
display: block; | |
font-size: 1rem; | |
-webkit-font-smoothing: antialiased; | |
line-height: 1; | |
margin: 0 0 1rem 0; | |
padding: 0.5rem; | |
width: 100% | |
} | |
[type="text"]:hover, | |
input[type="color"]:hover, | |
input[type="date"]:hover, | |
input[type="datetime"]:hover, | |
input[type="datetime-local"]:hover, | |
input[type="email"]:hover, | |
input[type="month"]:hover, | |
input[type="number"]:hover, | |
input[type="password"]:hover, | |
input[type="search"]:hover, | |
input[type="tel"]:hover, | |
input[type="time"]:hover, | |
input[type="url"]:hover, | |
input[type="week"]:hover, | |
textarea:hover { | |
background: #fff; | |
border: 1px solid #bbb; | |
color: #000 | |
} | |
[type="text"]:focus, | |
input[type="color"]:focus, | |
input[type="date"]:focus, | |
input[type="datetime"]:focus, | |
input[type="datetime-local"]:focus, | |
input[type="email"]:focus, | |
input[type="month"]:focus, | |
input[type="number"]:focus, | |
input[type="password"]:focus, | |
input[type="search"]:focus, | |
input[type="tel"]:focus, | |
input[type="time"]:focus, | |
input[type="url"]:focus, | |
input[type="week"]:focus, | |
textarea:focus { | |
background: #fff; | |
border: 1px solid #999; | |
color: #000; | |
outline: 0 | |
} | |
label { | |
color: #333; | |
display: block; | |
font-size: 0.9rem; | |
margin-bottom: 0.5rem | |
} | |
input[type="checkbox"], | |
input[type="radio"] { | |
box-sizing: border-box; | |
height: 1rem; | |
padding: 0; | |
width: 1rem | |
} | |
label>input[type="checkbox"], | |
label>input[type="radio"] { | |
margin-right: 0.25rem | |
} | |
input[type="checkbox"]+label, | |
input[type="radio"]+label { | |
display: inline-block; | |
margin-bottom: 0; | |
margin-left: 0.5rem; | |
margin-right: 1rem; | |
vertical-align: baseline | |
} | |
.inline-label { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap; | |
margin-bottom: 1rem | |
} | |
label>.inline-label, | |
label>[type="text"], | |
label>input, | |
label>input[type="color"], | |
label>input[type="date"], | |
label>input[type="datetime"], | |
label>input[type="datetime-local"], | |
label>input[type="email"], | |
label>input[type="month"], | |
label>input[type="number"], | |
label>input[type="password"], | |
label>input[type="search"], | |
label>input[type="tel"], | |
label>input[type="time"], | |
label>input[type="url"], | |
label>input[type="week"], | |
label>textarea { | |
margin-top: 0.5rem | |
} | |
.inline-label>.form-label { | |
-webkit-align-items: center; | |
align-items: center; | |
background: #eee; | |
border: 1px solid #ccc; | |
color: #333; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto; | |
-ms-flex-align: center; | |
padding: 0 0.5rem | |
} | |
.inline-label>.form-label:first-child { | |
border-right: 0 | |
} | |
.inline-label>.form-label:last-child { | |
border-left: 0 | |
} | |
.inline-label>a { | |
-webkit-align-items: center; | |
align-items: center; | |
border-radius: 0; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-ms-flex-align: center; | |
margin: 0; | |
padding-bottom: 0; | |
padding-top: 0 | |
} | |
textarea { | |
height: auto; | |
min-height: 50px; | |
width: 100% | |
} | |
select { | |
-webkit-appearance: none; | |
-moz-appearance: none; | |
background: #fafafa url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: #000"></polygon></svg>') right 10px center no-repeat; | |
background-size: 8px 8px; | |
border-radius: 0; | |
color: #000; | |
display: block; | |
font-size: 1rem; | |
margin: 0 0 1rem 0; | |
padding: 0.5rem; | |
padding-right: 1.625rem; | |
width: 100% | |
} | |
select:hover { | |
background-color: #f0f0f0 | |
} | |
input[type="range"] { | |
-webkit-appearance: none; | |
-moz-appearance: none; | |
background: #ddd; | |
cursor: pointer; | |
display: block; | |
height: 1rem; | |
margin-bottom: 0.25rem; | |
margin-top: 0.25rem; | |
overflow: visible; | |
width: 100% | |
} | |
a:active, | |
a:hover, | |
input[type="range"]:focus, | |
select:focus { | |
outline: 0 | |
} | |
input[type="range"]::-webkit-slider-thumb { | |
-webkit-appearance: none; | |
background: #00558b; | |
height: 1.5rem; | |
width: 1.5rem | |
} | |
input[type="range"]::-moz-range-track { | |
-moz-appearance: none; | |
background: #ccc; | |
cursor: pointer; | |
height: 4px; | |
max-width: 300px | |
} | |
input[type="range"]::-moz-range-thumb { | |
-moz-appearance: none; | |
background: #00558b; | |
height: 1.5rem; | |
width: 1.5rem | |
} | |
input[type="range"]::-ms-track { | |
background: #ccc; | |
cursor: pointer; | |
height: 4px; | |
max-width: 300px | |
} | |
input[type="range"]::-ms-thumb { | |
background: #00558b; | |
height: 1.5rem; | |
width: 1.5rem | |
} | |
output { | |
line-height: 1.5rem; | |
margin-left: .5em; | |
vertical-align: middle | |
} | |
input[type="number"]::-webkit-outer-spin-button { | |
-webkit-appearance: none; | |
background: #00558b | |
} | |
meter, | |
progress { | |
-webkit-appearance: none; | |
-moz-appearance: none; | |
background: #ccc; | |
border: 0; | |
display: block; | |
height: 1.5rem; | |
margin-bottom: 1rem; | |
width: 100% | |
} | |
meter:-moz-meter-optimum::-moz-meter-bar, | |
meter::-webkit-meter-optimum-value, | |
progress.high::-moz-progress-bar, | |
progress.high::-webkit-progress-value { | |
background: #43ac6a | |
} | |
meter:-moz-meter-sub-optimum::-moz-meter-bar, | |
meter::-webkit-meter-suboptimum-value, | |
progress.medium::-moz-progress-bar, | |
progress.medium::-webkit-progress-value { | |
background: #e7cf00 | |
} | |
meter:-moz-meter-sub-sub-optimum::-moz-meter-bar, | |
meter::-webkit-meter-even-less-good-value, | |
progress.low::-moz-progress-bar, | |
progress.low::-webkit-progress-value { | |
background: #f04124 | |
} | |
.panel { | |
background: #fff; | |
display: block; | |
display: none; | |
overflow-y: auto; | |
padding: 0; | |
position: absolute; | |
z-index: 100 | |
} | |
.panel-top { | |
height: 300px; | |
left: 0; | |
top: 0; | |
width: 100% | |
} | |
.panel-top.is-active { | |
box-shadow: 0 3px 10px rgba(0,0,0,0.25) | |
} | |
.panel-right { | |
height: 100%; | |
right: 0; | |
top: 0; | |
width: 100% | |
} | |
.panel-right.is-active { | |
box-shadow: -3px 0 10px rgba(0,0,0,0.25) | |
} | |
.panel-bottom { | |
bottom: 0; | |
height: 300px; | |
left: 0; | |
width: 100% | |
} | |
.panel-bottom.is-active { | |
box-shadow: 2px -3px 10px rgba(0,0,0,0.25) | |
} | |
.panel-left { | |
height: 100%; | |
left: 0; | |
top: 0; | |
width: 100% | |
} | |
@media only screen and (min-width: 18.75em) { | |
.panel-left, | |
.panel-right { | |
width: 300px | |
} | |
} | |
.panel-left.is-active { | |
box-shadow: 3px 0 10px rgba(0,0,0,0.25) | |
} | |
.panel-fixed { | |
position: fixed | |
} | |
.grid-block, | |
.grid-frame, | |
.large-grid-block, | |
.medium-grid-block, | |
.small-grid-block { | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden | |
} | |
.small-vertical.grid-block, | |
.small-vertical.grid-frame, | |
.small-vertical.large-grid-block, | |
.small-vertical.medium-grid-block, | |
.small-vertical.small-grid-block, | |
.vertical.grid-block, | |
.vertical.grid-frame, | |
.vertical.large-grid-block, | |
.vertical.medium-grid-block, | |
.vertical.small-grid-block { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap | |
} | |
.small-horizontal.grid-block, | |
.small-horizontal.grid-frame, | |
.small-horizontal.large-grid-block, | |
.small-horizontal.medium-grid-block, | |
.small-horizontal.small-grid-block { | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap | |
} | |
.wrap.grid-block, | |
.wrap.grid-frame, | |
.wrap.large-grid-block, | |
.wrap.medium-grid-block, | |
.wrap.small-grid-block { | |
-webkit-align-items: flex-start; | |
align-items: flex-start; | |
-ms-flex-align: start; | |
-webkit-flex-wrap: wrap; | |
-ms-flex-wrap: wrap; | |
flex-wrap: wrap | |
} | |
.grid-frame { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex: 1 1; | |
-ms-flex: 1 1; | |
flex: 1 1; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap; | |
-ms-flex-order: 0; | |
-ms-flex-pack: start; | |
-webkit-flex-wrap: nowrap; | |
-ms-flex-wrap: nowrap; | |
flex-wrap: nowrap; | |
height: 100vh; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start; | |
-webkit-order: 0; | |
order: 0; | |
overflow: hidden; | |
position: relative | |
} | |
.grid-content.collapse, | |
td, | |
th { | |
padding: 0 | |
} | |
.grid-container { | |
margin: 0 auto; | |
max-width: 56.25rem | |
} | |
.grid-container.contain-left { | |
margin: 0 auto 0 0; | |
max-width: 56.25rem | |
} | |
.grid-container.contain-right { | |
margin: 0 0 0 auto; | |
max-width: 56.25rem | |
} | |
.grid-block, | |
.small-grid-block { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex: 1 1; | |
-ms-flex: 1 1; | |
flex: 1 1; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap; | |
-ms-flex-order: 0; | |
-ms-flex-pack: start; | |
-webkit-flex-wrap: nowrap; | |
-ms-flex-wrap: nowrap; | |
flex-wrap: nowrap; | |
height: 100vh; | |
height: auto; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start; | |
-webkit-order: 0; | |
order: 0; | |
overflow: hidden; | |
-webkit-overflow-scrolling: touch; | |
-ms-overflow-style: -ms-autohiding-scrollbar; | |
overflow-y: auto; | |
position: relative | |
} | |
.grid-content, | |
.small-grid-content { | |
display: block; | |
-webkit-flex: 1 1; | |
-ms-flex: 1 1; | |
flex: 1 1; | |
-webkit-overflow-scrolling: touch; | |
-ms-overflow-style: -ms-autohiding-scrollbar; | |
overflow-y: auto; | |
padding: 0 1rem | |
} | |
.small-grid-block.panel, | |
.small-grid-content.panel { | |
background: transparent; | |
bottom: auto; | |
box-shadow: none; | |
height: auto; | |
left: auto; | |
position: relative; | |
right: auto; | |
top: auto; | |
-webkit-transform: none; | |
transform: none; | |
width: auto; | |
z-index: auto | |
} | |
.small-1 { | |
-webkit-flex: 0 0 8.33333%; | |
-ms-flex: 0 0 8.33333%; | |
flex: 0 0 8.33333%; | |
max-width: 8.33333% | |
} | |
.order-1, | |
.small-order-1 { | |
-ms-flex-order: 1; | |
-webkit-order: 1; | |
order: 1 | |
} | |
.small-offset-1 { | |
margin-left: 8.33333% | |
} | |
.small-up-1>div, | |
.small-up-1>li, | |
.small-up-1>section { | |
-webkit-flex: 0 0 100%; | |
-ms-flex: 0 0 100%; | |
flex: 0 0 100%; | |
padding: 0 1rem 1rem | |
} | |
.small-2 { | |
-webkit-flex: 0 0 16.66667%; | |
-ms-flex: 0 0 16.66667%; | |
flex: 0 0 16.66667%; | |
max-width: 16.66667% | |
} | |
.order-2, | |
.small-order-2 { | |
-ms-flex-order: 2; | |
-webkit-order: 2; | |
order: 2 | |
} | |
.small-offset-2 { | |
margin-left: 16.66667% | |
} | |
.small-up-2>div, | |
.small-up-2>li, | |
.small-up-2>section { | |
-webkit-flex: 0 0 50%; | |
-ms-flex: 0 0 50%; | |
flex: 0 0 50%; | |
padding: 0 1rem 1rem | |
} | |
.small-3 { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
max-width: 25% | |
} | |
.order-3, | |
.small-order-3 { | |
-ms-flex-order: 3; | |
-webkit-order: 3; | |
order: 3 | |
} | |
.small-up-3>div, | |
.small-up-3>li, | |
.small-up-3>section { | |
-webkit-flex: 0 0 33.33333%; | |
-ms-flex: 0 0 33.33333%; | |
flex: 0 0 33.33333%; | |
padding: 0 1rem 1rem | |
} | |
.small-4 { | |
-webkit-flex: 0 0 33.33333%; | |
-ms-flex: 0 0 33.33333%; | |
flex: 0 0 33.33333%; | |
max-width: 33.33333% | |
} | |
.order-4, | |
.small-order-4 { | |
-ms-flex-order: 4; | |
-webkit-order: 4; | |
order: 4 | |
} | |
.small-offset-4 { | |
margin-left: 33.33333% | |
} | |
.small-up-4>div, | |
.small-up-4>li, | |
.small-up-4>section { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
padding: 0 1rem 1rem | |
} | |
.small-5 { | |
-webkit-flex: 0 0 41.66667%; | |
-ms-flex: 0 0 41.66667%; | |
flex: 0 0 41.66667%; | |
max-width: 41.66667% | |
} | |
.order-5, | |
.small-order-5 { | |
-ms-flex-order: 5; | |
-webkit-order: 5; | |
order: 5 | |
} | |
.small-offset-5 { | |
margin-left: 41.66667% | |
} | |
.small-up-5>div, | |
.small-up-5>li, | |
.small-up-5>section { | |
-webkit-flex: 0 0 20%; | |
-ms-flex: 0 0 20%; | |
flex: 0 0 20%; | |
padding: 0 1rem 1rem | |
} | |
.small-6 { | |
-webkit-flex: 0 0 50%; | |
-ms-flex: 0 0 50%; | |
flex: 0 0 50%; | |
max-width: 50% | |
} | |
.order-6, | |
.small-order-6 { | |
-ms-flex-order: 6; | |
-webkit-order: 6; | |
order: 6 | |
} | |
.small-offset-6 { | |
margin-left: 50% | |
} | |
.small-up-6>div, | |
.small-up-6>li, | |
.small-up-6>section { | |
-webkit-flex: 0 0 16.66667%; | |
-ms-flex: 0 0 16.66667%; | |
flex: 0 0 16.66667%; | |
padding: 0 1rem 1rem | |
} | |
.small-7 { | |
-webkit-flex: 0 0 58.33333%; | |
-ms-flex: 0 0 58.33333%; | |
flex: 0 0 58.33333%; | |
max-width: 58.33333% | |
} | |
.order-7, | |
.small-order-7 { | |
-ms-flex-order: 7; | |
-webkit-order: 7; | |
order: 7 | |
} | |
.small-offset-7 { | |
margin-left: 58.33333% | |
} | |
.small-up-7>div, | |
.small-up-7>li, | |
.small-up-7>section { | |
-webkit-flex: 0 0 14.28571%; | |
-ms-flex: 0 0 14.28571%; | |
flex: 0 0 14.28571%; | |
padding: 0 1rem 1rem | |
} | |
.small-8 { | |
-webkit-flex: 0 0 66.66667%; | |
-ms-flex: 0 0 66.66667%; | |
flex: 0 0 66.66667%; | |
max-width: 66.66667% | |
} | |
.order-8, | |
.small-order-8 { | |
-ms-flex-order: 8; | |
-webkit-order: 8; | |
order: 8 | |
} | |
.small-offset-8 { | |
margin-left: 66.66667% | |
} | |
.small-up-8>div, | |
.small-up-8>li, | |
.small-up-8>section { | |
-webkit-flex: 0 0 12.5%; | |
-ms-flex: 0 0 12.5%; | |
flex: 0 0 12.5%; | |
padding: 0 1rem 1rem | |
} | |
.small-9 { | |
-webkit-flex: 0 0 75%; | |
-ms-flex: 0 0 75%; | |
flex: 0 0 75%; | |
max-width: 75% | |
} | |
.order-9, | |
.small-order-9 { | |
-ms-flex-order: 9; | |
-webkit-order: 9; | |
order: 9 | |
} | |
.small-offset-9 { | |
margin-left: 75% | |
} | |
.small-up-9>div, | |
.small-up-9>li, | |
.small-up-9>section { | |
-webkit-flex: 0 0 11.11111%; | |
-ms-flex: 0 0 11.11111%; | |
flex: 0 0 11.11111%; | |
padding: 0 1rem 1rem | |
} | |
.small-10 { | |
-webkit-flex: 0 0 83.33333%; | |
-ms-flex: 0 0 83.33333%; | |
flex: 0 0 83.33333%; | |
max-width: 83.33333% | |
} | |
.order-10, | |
.small-order-10 { | |
-ms-flex-order: 10; | |
-webkit-order: 10; | |
order: 10 | |
} | |
.small-offset-10 { | |
margin-left: 83.33333% | |
} | |
.small-up-10>div, | |
.small-up-10>li, | |
.small-up-10>section { | |
-webkit-flex: 0 0 10%; | |
-ms-flex: 0 0 10%; | |
flex: 0 0 10%; | |
padding: 0 1rem 1rem | |
} | |
.small-11 { | |
-webkit-flex: 0 0 91.66667%; | |
-ms-flex: 0 0 91.66667%; | |
flex: 0 0 91.66667%; | |
max-width: 91.66667% | |
} | |
.order-11, | |
.small-order-11 { | |
-ms-flex-order: 11; | |
-webkit-order: 11; | |
order: 11 | |
} | |
.small-offset-11 { | |
margin-left: 91.66667% | |
} | |
.small-up-11>div, | |
.small-up-11>li, | |
.small-up-11>section { | |
-webkit-flex: 0 0 9.09091%; | |
-ms-flex: 0 0 9.09091%; | |
flex: 0 0 9.09091%; | |
padding: 0 1rem 1rem | |
} | |
.small-12 { | |
-webkit-flex: 0 0 100%; | |
-ms-flex: 0 0 100%; | |
flex: 0 0 100%; | |
max-width: 100% | |
} | |
.order-12, | |
.small-order-12 { | |
-ms-flex-order: 12; | |
-webkit-order: 12; | |
order: 12 | |
} | |
.small-offset-12 { | |
margin-left: 100% | |
} | |
.small-up-1, | |
.small-up-10, | |
.small-up-11, | |
.small-up-12, | |
.small-up-2, | |
.small-up-3, | |
.small-up-4, | |
.small-up-5, | |
.small-up-6, | |
.small-up-7, | |
.small-up-8, | |
.small-up-9 { | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap; | |
list-style-type: none; | |
overflow: visible | |
} | |
.small-up-12>div, | |
.small-up-12>li, | |
.small-up-12>section { | |
-webkit-flex: 0 0 8.33333%; | |
-ms-flex: 0 0 8.33333%; | |
flex: 0 0 8.33333%; | |
padding: 0 1rem 1rem | |
} | |
.grid-content .grid-block { | |
-webkit-flex-wrap: wrap; | |
-ms-flex-wrap: wrap; | |
flex-wrap: wrap; | |
margin-left: -1rem; | |
margin-right: -1rem; | |
overflow: visible | |
} | |
.grid-content .grid-block .grid-content, | |
button { | |
overflow: visible | |
} | |
.grid-content .modal .grid-block { | |
-webkit-flex-wrap: nowrap; | |
-ms-flex-wrap: nowrap; | |
flex-wrap: nowrap | |
} | |
.title-bar .title, | |
b, | |
optgroup, | |
strong { | |
font-weight: bold | |
} | |
.title-bar .center, | |
.title-bar .left, | |
.title-bar .right { | |
display: block; | |
overflow: visible; | |
white-space: nowrap | |
} | |
.inline-label>input, | |
.inline-label>select, | |
.title-bar .center:first-child:last-child, | |
.title-bar .left:first-child:last-child, | |
.title-bar .right:first-child:last-child { | |
-webkit-flex: 1; | |
-ms-flex: 1; | |
flex: 1; | |
margin: 0 | |
} | |
.title-bar .left { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
-ms-flex-order: 1; | |
-webkit-order: 1; | |
order: 1 | |
} | |
.title-bar .center { | |
-webkit-flex: 0 0 50%; | |
-ms-flex: 0 0 50%; | |
flex: 0 0 50%; | |
-ms-flex-order: 2; | |
-webkit-order: 2; | |
order: 2; | |
text-align: center | |
} | |
.title-bar .right { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
-ms-flex-order: 3; | |
-webkit-order: 3; | |
order: 3; | |
text-align: right | |
} | |
.title-bar .left:first-child, | |
.title-bar .left:first-child+.right:last-child { | |
-webkit-flex: 1 1 auto; | |
-ms-flex: 1 1 auto; | |
flex: 1 1 auto | |
} | |
.small-offset-3, | |
.title-bar .center:first-child:not(:last-child) { | |
margin-left: 25% | |
} | |
.title-bar .center+.left { | |
margin-right: -25% | |
} | |
.title-bar { | |
-webkit-align-items: center; | |
align-items: center; | |
background: #eee; | |
border-bottom: 1px solid #ccc; | |
color: #000; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto; | |
-ms-flex-align: center; | |
-ms-flex-pack: start; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start; | |
overflow: visible; | |
padding: 1rem | |
} | |
.title-bar.primary { | |
background: #00558b; | |
border-bottom: 1px solid #ccc; | |
color: #fff; | |
padding: 1rem | |
} | |
.title-bar.dark { | |
background: #232323; | |
border-bottom: 1px solid #ccc; | |
color: #fff; | |
padding: 1rem | |
} | |
.title-bar-bottom { | |
border-bottom: 0; | |
border-top: 1px solid #ccc | |
} | |
.label { | |
background: #00558b; | |
border-radius: 0; | |
color: #fff; | |
cursor: default; | |
display: inline-block; | |
font-size: 0.8rem; | |
line-height: 1; | |
padding: 0.33333rem 0.5rem; | |
white-space: nowrap | |
} | |
.label.primary { | |
background: #00558b; | |
border-radius: 0; | |
color: #fff | |
} | |
.label.success { | |
background: #43ac6a; | |
border-radius: 0; | |
color: #fff | |
} | |
.label.warning { | |
background: #f08a24; | |
border-radius: 0; | |
color: #fff | |
} | |
.label.alert { | |
background: #f04124; | |
border-radius: 0; | |
color: #fff | |
} | |
.label.dark { | |
background: #232323; | |
border-radius: 0; | |
color: #fff | |
} | |
.badge { | |
-webkit-align-items: center; | |
align-items: center; | |
background: #00558b; | |
border-radius: 1000px; | |
color: #fff; | |
display: -webkit-inline-flex; | |
display: -ms-inline-flexbox; | |
display: inline-flex; | |
-ms-flex-align: center; | |
font-size: 1em; | |
min-width: 1.75em; | |
padding: .1em .61em; | |
position: absolute | |
} | |
.badge.primary { | |
background: #00558b; | |
border-radius: 1000px; | |
color: #fff | |
} | |
.badge.success { | |
background: #43ac6a; | |
border-radius: 1000px; | |
color: #fff | |
} | |
.badge.warning { | |
background: #f08a24; | |
border-radius: 1000px; | |
color: #fff | |
} | |
.badge.alert { | |
background: #f04124; | |
border-radius: 1000px; | |
color: #fff | |
} | |
.badge.dark { | |
background: #232323; | |
border-radius: 1000px; | |
color: #fff | |
} | |
.inline-list dd, | |
.inline-list dt, | |
.inline-list li { | |
display: inline-block; | |
margin-left: -2px; | |
margin-right: -2px | |
} | |
.inline-list li { | |
margin-left: 0; | |
margin-right: 1rem | |
} | |
.menu-bar>li { | |
-webkit-align-items: center; | |
align-items: center; | |
-webkit-flex: 1 0 auto; | |
-ms-flex: 1 0 auto; | |
flex: 1 0 auto; | |
-ms-flex-align: center | |
} | |
.menu-bar>li>a { | |
-webkit-align-items: center; | |
align-items: center; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-ms-flex-align: center; | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap; | |
font-size: 1rem; | |
line-height: 1; | |
padding: 1rem | |
} | |
.menu-bar { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
background: #fff; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-ms-flex-align: stretch; | |
list-style-type: none; | |
margin: 0; | |
margin-bottom: 1rem | |
} | |
.block-list li>a:hover, | |
.block-list li>label:hover, | |
.menu-bar>li>a { | |
color: #000 | |
} | |
.menu-bar .is-active>a, | |
.menu-bar>li>a:hover { | |
background: #ededed; | |
color: #000 | |
} | |
.button-group.segmented.secondary>li.is-active>a .iconic *, | |
.button-group.segmented.secondary>li.is-active>a .iconic *.iconic-property-accent, | |
.button-group.segmented.secondary>li>input:checked+label .iconic *, | |
.button-group.segmented.secondary>li>input:checked+label .iconic *.iconic-property-accent, | |
.button-group>li.secondary>a .iconic *, | |
.button-group>li.secondary>a .iconic *.iconic-property-accent, | |
.button.info .iconic *, | |
.button.info .iconic *.iconic-property-accent, | |
.button.secondary .iconic *, | |
.button.secondary .iconic *.iconic-property-accent, | |
.menu-bar .iconic *, | |
.menu-bar .iconic *.iconic-property-accent { | |
fill: #000; | |
stroke: #000 | |
} | |
.menu-bar.small-expand li { | |
-webkit-flex: 1 0 auto; | |
-ms-flex: 1 0 auto; | |
flex: 1 0 auto | |
} | |
.menu-bar.small-align-left { | |
-ms-flex-pack: start; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start | |
} | |
.align-right.grid-block, | |
.align-right.grid-frame, | |
.align-right.large-grid-block, | |
.align-right.medium-grid-block, | |
.align-right.small-grid-block, | |
.menu-bar.align-right, | |
.menu-bar.small-align-right { | |
-ms-flex-pack: end; | |
-webkit-justify-content: flex-end; | |
justify-content: flex-end | |
} | |
.align-center.grid-block, | |
.align-center.grid-frame, | |
.align-center.large-grid-block, | |
.align-center.medium-grid-block, | |
.align-center.small-grid-block, | |
.menu-bar.align-center, | |
.menu-bar.small-align-center { | |
-ms-flex-pack: center; | |
-webkit-justify-content: center; | |
justify-content: center | |
} | |
.align-justify.grid-block, | |
.align-justify.grid-frame, | |
.align-justify.large-grid-block, | |
.align-justify.medium-grid-block, | |
.align-justify.small-grid-block, | |
.menu-bar.align-justify, | |
.menu-bar.small-align-justify { | |
-ms-flex-pack: justify; | |
-webkit-justify-content: space-between; | |
justify-content: space-between | |
} | |
.align-spaced.grid-block, | |
.align-spaced.grid-frame, | |
.align-spaced.large-grid-block, | |
.align-spaced.medium-grid-block, | |
.align-spaced.small-grid-block, | |
.menu-bar.align-spaced, | |
.menu-bar.small-align-spaced { | |
-ms-flex-pack: distribute; | |
-webkit-justify-content: space-around; | |
justify-content: space-around | |
} | |
.menu-bar, | |
.menu-bar.horizontal, | |
.menu-bar.small-horizontal { | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap; | |
overflow-x: hidden | |
} | |
.menu-bar.small-vertical>li>a, | |
.menu-bar.vertical>li>a { | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap | |
} | |
.menu-bar.icon-top>li>a>.iconic, | |
.menu-bar.icon-top>li>a>img, | |
.menu-bar.small-icon-top>li>a>.iconic, | |
.menu-bar.small-icon-top>li>a>img, | |
.menu-bar>li>a>.iconic, | |
.menu-bar>li>a>img { | |
margin: 0 0 1rem 0 | |
} | |
.menu-bar.icon-right>li>a, | |
.menu-bar.small-icon-right>li>a { | |
-webkit-flex-flow: row-reverse nowrap; | |
-ms-flex-flow: row-reverse nowrap; | |
flex-flow: row-reverse nowrap | |
} | |
.menu-bar.icon-right>li>a>.iconic, | |
.menu-bar.icon-right>li>a>img, | |
.menu-bar.small-icon-right>li>a>.iconic, | |
.menu-bar.small-icon-right>li>a>img { | |
margin: 0 0 0 1rem | |
} | |
.menu-bar.icon-bottom>li>a, | |
.menu-bar.small-icon-bottom>li>a { | |
-webkit-flex-flow: column-reverse nowrap; | |
-ms-flex-flow: column-reverse nowrap; | |
flex-flow: column-reverse nowrap | |
} | |
.menu-bar.icon-bottom>li>a>.iconic, | |
.menu-bar.icon-bottom>li>a>img, | |
.menu-bar.small-icon-bottom>li>a>.iconic, | |
.menu-bar.small-icon-bottom>li>a>img { | |
margin: 1rem 0 0 0 | |
} | |
.menu-bar.icon-bottom>li>.iconic, | |
.menu-bar.icon-bottom>li>img, | |
.menu-bar.icon-left>li>.iconic, | |
.menu-bar.icon-left>li>img, | |
.menu-bar.icon-right>li>.iconic, | |
.menu-bar.icon-right>li>img, | |
.menu-bar.icon-top>li>.iconic, | |
.menu-bar.icon-top>li>img, | |
.menu-bar.small-icon-bottom>li>.iconic, | |
.menu-bar.small-icon-bottom>li>img, | |
.menu-bar.small-icon-left>li>.iconic, | |
.menu-bar.small-icon-left>li>img, | |
.menu-bar.small-icon-right>li>.iconic, | |
.menu-bar.small-icon-right>li>img, | |
.menu-bar.small-icon-top>li>.iconic, | |
.menu-bar.small-icon-top>li>img, | |
.menu-bar>li>.iconic, | |
.menu-bar>li>img { | |
height: 25px; | |
margin: 0; | |
width: 25px | |
} | |
.menu-bar.icon-left>li>a, | |
.menu-bar.small-icon-left>li>a { | |
-webkit-align-items: center; | |
align-items: center; | |
-ms-flex-align: center; | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap | |
} | |
.menu-bar.icon-left>li>a>.iconic, | |
.menu-bar.icon-left>li>a>img, | |
.menu-bar.small-icon-left>li>a>.iconic, | |
.menu-bar.small-icon-left>li>a>img { | |
margin: 0 1rem 0 0 | |
} | |
.menu-bar.label-side .menu-bar-label { | |
background: red; | |
border-radius: 1000px; | |
color: #fff; | |
display: block; | |
font-size: 0.9rem; | |
height: 1.2rem; | |
line-height: 1.2rem; | |
pointer-events: none; | |
position: absolute; | |
right: 1rem; | |
text-align: center; | |
top: 50%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%); | |
width: 1.2rem | |
} | |
.menu-bar.label-corner>li, | |
.menu-bar.label-side>li { | |
position: relative | |
} | |
.menu-bar.label-corner>li>a, | |
.menu-bar.label-side>li>a { | |
padding-right: 3.2rem | |
} | |
.menu-bar.label-corner .menu-bar-label { | |
background: red; | |
border-radius: 1000px; | |
color: #fff; | |
display: block; | |
font-size: 0.9rem; | |
height: 1.2rem; | |
line-height: 1.2rem; | |
pointer-events: none; | |
position: absolute; | |
right: 1rem; | |
text-align: center; | |
top: 1rem; | |
width: 1.2rem | |
} | |
.menu-bar>li.title { | |
cursor: default; | |
font-weight: bold; | |
padding: 1rem | |
} | |
.menu-group { | |
-webkit-align-items: center; | |
align-items: center; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-ms-flex-align: center; | |
-ms-flex-pack: justify; | |
-webkit-flex-wrap: wrap; | |
-ms-flex-wrap: wrap; | |
flex-wrap: wrap; | |
-webkit-justify-content: space-between; | |
justify-content: space-between | |
} | |
.menu-group>.menu-group-left, | |
.menu-group>.menu-group-right { | |
-webkit-flex: 1 1 100%; | |
-ms-flex: 1 1 100%; | |
flex: 1 1 100% | |
} | |
.menu-group .menu-bar { | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap; | |
margin: 0; | |
overflow-x: hidden | |
} | |
.menu-bar.horizontal>li>a, | |
.menu-bar.icon-top>li>a, | |
.menu-bar.small-horizontal>li>a, | |
.menu-bar.small-icon-top>li>a, | |
.menu-bar.small-vertical, | |
.menu-bar.vertical, | |
.menu-bar>li>a, | |
.menu-group .menu-bar>li>a { | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap | |
} | |
.button-group>li, | |
.menu-bar.condense>li, | |
.menu-bar.small-condense li, | |
.menu-group .menu-bar>li, | |
.shrink.grid-block, | |
.shrink.grid-content, | |
.shrink.large-grid-block, | |
.shrink.large-grid-content, | |
.shrink.medium-grid-block, | |
.shrink.medium-grid-content, | |
.shrink.small-grid-block, | |
.shrink.small-grid-content { | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto | |
} | |
.menu-group.primary { | |
background-color: #00558b | |
} | |
.menu-bar.primary, | |
.menu-group.primary .menu-bar, | |
meter::-moz-meter-bar, | |
progress::-moz-progress-bar, | |
progress::-webkit-progress-value { | |
background: #00558b | |
} | |
.menu-bar.primary .is-active>a, | |
.menu-bar.primary>li>a:hover, | |
.menu-group.primary .menu-bar .is-active>a, | |
.menu-group.primary .menu-bar>li>a:hover { | |
background: #0065a5; | |
color: #fff | |
} | |
.menu-group.dark { | |
background-color: #232323 | |
} | |
.menu-bar.dark, | |
.menu-group.dark .menu-bar { | |
background: #232323 | |
} | |
.menu-bar.dark .is-active>a, | |
.menu-bar.dark>li>a:hover, | |
.menu-group.dark .menu-bar .is-active>a, | |
.menu-group.dark .menu-bar>li>a:hover { | |
background: #323232; | |
color: #fff | |
} | |
.button .iconic *, | |
.button .iconic *.iconic-property-accent, | |
.button-group.alert>li>a .iconic *, | |
.button-group.alert>li>a .iconic *.iconic-property-accent, | |
.button-group.alert>li>label .iconic *, | |
.button-group.alert>li>label .iconic *.iconic-property-accent, | |
.button-group.secondary>li>a .iconic *, | |
.button-group.secondary>li>a .iconic *.iconic-property-accent, | |
.button-group.secondary>li>label .iconic *, | |
.button-group.secondary>li>label .iconic *.iconic-property-accent, | |
.button-group.segmented.alert>li.is-active>a .iconic *, | |
.button-group.segmented.alert>li.is-active>a .iconic *.iconic-property-accent, | |
.button-group.segmented.alert>li>input:checked+label .iconic *, | |
.button-group.segmented.alert>li>input:checked+label .iconic *.iconic-property-accent, | |
.button-group.segmented.success>li.is-active>a .iconic *, | |
.button-group.segmented.success>li.is-active>a .iconic *.iconic-property-accent, | |
.button-group.segmented.success>li>input:checked+label .iconic *, | |
.button-group.segmented.success>li>input:checked+label .iconic *.iconic-property-accent, | |
.button-group.segmented.warning>li.is-active>a .iconic *, | |
.button-group.segmented.warning>li.is-active>a .iconic *.iconic-property-accent, | |
.button-group.segmented.warning>li>input:checked+label .iconic *, | |
.button-group.segmented.warning>li>input:checked+label .iconic *.iconic-property-accent, | |
.button-group.segmented>li.is-active>a .iconic *, | |
.button-group.segmented>li.is-active>a .iconic *.iconic-property-accent, | |
.button-group.segmented>li>input:checked+label .iconic *, | |
.button-group.segmented>li>input:checked+label .iconic *.iconic-property-accent, | |
.button-group.success>li>a .iconic *, | |
.button-group.success>li>a .iconic *.iconic-property-accent, | |
.button-group.success>li>label .iconic *, | |
.button-group.success>li>label .iconic *.iconic-property-accent, | |
.button-group.warning>li>a .iconic *, | |
.button-group.warning>li>a .iconic *.iconic-property-accent, | |
.button-group.warning>li>label .iconic *, | |
.button-group.warning>li>label .iconic *.iconic-property-accent, | |
.button-group>li.alert>a .iconic *, | |
.button-group>li.alert>a .iconic *.iconic-property-accent, | |
.button-group>li.success>a .iconic *, | |
.button-group>li.success>a .iconic *.iconic-property-accent, | |
.button-group>li.warning>a .iconic *, | |
.button-group>li.warning>a .iconic *.iconic-property-accent, | |
.button-group>li>a .iconic *, | |
.button-group>li>a .iconic *.iconic-property-accent, | |
.button-group>li>label .iconic *, | |
.button-group>li>label .iconic *.iconic-property-accent, | |
.button.alert .iconic *, | |
.button.alert .iconic *.iconic-property-accent, | |
.button.dark .iconic *, | |
.button.dark .iconic *.iconic-property-accent, | |
.button.success .iconic *, | |
.button.success .iconic *.iconic-property-accent, | |
.button.warning .iconic *, | |
.button.warning .iconic *.iconic-property-accent, | |
.menu-bar.dark .iconic *, | |
.menu-bar.dark .iconic *.iconic-property-accent, | |
.menu-bar.primary .iconic *, | |
.menu-bar.primary .iconic *.iconic-property-accent, | |
.menu-group.dark .menu-bar .iconic *, | |
.menu-group.dark .menu-bar .iconic *.iconic-property-accent, | |
.menu-group.primary .menu-bar .iconic *, | |
.menu-group.primary .menu-bar .iconic *.iconic-property-accent, | |
.title-bar.dark .iconic *, | |
.title-bar.dark .iconic *.iconic-property-accent, | |
.title-bar.primary .iconic *, | |
.title-bar.primary .iconic *.iconic-property-accent { | |
fill: #fff; | |
stroke: #fff | |
} | |
.is-active.modal { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important; | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto; | |
height: 100vh; | |
left: 0; | |
opacity: 1; | |
top: 0; | |
-webkit-transform: scale(1); | |
transform: scale(1) | |
} | |
.is-active.dialogue.modal { | |
height: auto; | |
width: 95% | |
} | |
.modal .close-button, | |
.modal [fa-close] { | |
z-index: 1001 | |
} | |
.modal { | |
background: #fff; | |
display: none; | |
max-width: 600px; | |
opacity: 0; | |
overflow: hidden; | |
position: relative; | |
-webkit-transform: scale(0.9); | |
transform: scale(0.9); | |
transition: opacity,-webkit-transform 0.2s,0.2s; | |
width: 100%; | |
z-index: 1001 | |
} | |
.modal.tiny { | |
max-width: 300px | |
} | |
.modal.small { | |
max-width: 500px | |
} | |
.modal.large { | |
max-width: 800px | |
} | |
.modal-overlay { | |
-webkit-align-items: center; | |
align-items: center; | |
background-color: rgba(51,51,51,0.7); | |
bottom: 0; | |
display: none; | |
-ms-flex-align: center; | |
-ms-flex-pack: center; | |
-webkit-justify-content: center; | |
justify-content: center; | |
left: 0; | |
position: fixed; | |
right: 0; | |
top: 0; | |
z-index: 1000 | |
} | |
.slideInDown.ng-enter { | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translateY(-100%); | |
transform: translateY(-100%); | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.slideInLeft.ng-enter { | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translateX(100%); | |
transform: translateX(100%); | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.slideInUp.ng-enter { | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translateY(100%); | |
transform: translateY(100%); | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.slideInRight.ng-enter { | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translateX(-100%); | |
transform: translateX(-100%); | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.slideInDown.ng-enter.ng-enter-active, | |
.slideInLeft.ng-enter.ng-enter-active, | |
.slideInRight.ng-enter.ng-enter-active, | |
.slideInUp.ng-enter.ng-enter-active { | |
-webkit-transform: translateX(0) translateY(0); | |
transform: translateX(0) translateY(0) | |
} | |
.slideOutBottom.ng-leave.ng-leave-active { | |
-webkit-transform: translateY(100%); | |
transform: translateY(100%) | |
} | |
.slideOutRight.ng-leave.ng-leave-active { | |
-webkit-transform: translateX(100%); | |
transform: translateX(100%) | |
} | |
.slideOutUp.ng-leave.ng-leave-active { | |
-webkit-transform: translateY(-100%); | |
transform: translateY(-100%) | |
} | |
.slideOutBottom.ng-leave, | |
.slideOutLeft.ng-leave, | |
.slideOutRight.ng-leave, | |
.slideOutUp.ng-leave { | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translateX(0) translateY(0); | |
transform: translateX(0) translateY(0); | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.slideOutLeft.ng-leave.ng-leave-active { | |
-webkit-transform: translateX(-100%); | |
transform: translateX(-100%) | |
} | |
.fadeIn.ng-enter { | |
opacity: 0; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: opacity; | |
transition-timing-function: ease | |
} | |
.fadeIn.ng-enter.ng-enter-active { | |
opacity: 1 | |
} | |
.fadeOut.ng-leave { | |
opacity: 1; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: opacity; | |
transition-timing-function: ease | |
} | |
.fadeOut.ng-leave.ng-leave-active { | |
opacity: 0 | |
} | |
.hingeInFromTop.ng-enter { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateX(-90deg); | |
transform: perspective(2000px) rotateX(-90deg); | |
-webkit-transform-origin: top; | |
transform-origin: top; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeInFromRight.ng-enter { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateY(-90deg); | |
transform: perspective(2000px) rotateY(-90deg); | |
-webkit-transform-origin: right; | |
transform-origin: right; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeInFromBottom.ng-enter { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateX(90deg); | |
transform: perspective(2000px) rotateX(90deg); | |
-webkit-transform-origin: bottom; | |
transform-origin: bottom; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeInFromLeft.ng-enter { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateY(90deg); | |
transform: perspective(2000px) rotateY(90deg); | |
-webkit-transform-origin: left; | |
transform-origin: left; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeInFromMiddleX.ng-enter { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateX(-90deg); | |
transform: perspective(2000px) rotateX(-90deg); | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeInFromMiddleY.ng-enter { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateY(-90deg); | |
transform: perspective(2000px) rotateY(-90deg); | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeInFromBottom.ng-enter.ng-enter-active, | |
.hingeInFromLeft.ng-enter.ng-enter-active, | |
.hingeInFromMiddleX.ng-enter.ng-enter-active, | |
.hingeInFromMiddleY.ng-enter.ng-enter-active, | |
.hingeInFromRight.ng-enter.ng-enter-active, | |
.hingeInFromTop.ng-enter.ng-enter-active { | |
opacity: 1; | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg) | |
} | |
.hingeOutFromTop.ng-leave { | |
opacity: 1; | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg); | |
-webkit-transform-origin: top; | |
transform-origin: top; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeOutFromRight.ng-leave { | |
opacity: 1; | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg); | |
-webkit-transform-origin: right; | |
transform-origin: right; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeOutFromBottom.ng-leave { | |
opacity: 1; | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg); | |
-webkit-transform-origin: bottom; | |
transform-origin: bottom; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeOutFromBottom.ng-leave.ng-leave-active { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateX(90deg); | |
transform: perspective(2000px) rotateX(90deg) | |
} | |
.hingeOutFromLeft.ng-leave { | |
opacity: 1; | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg); | |
-webkit-transform-origin: left; | |
transform-origin: left; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeOutFromLeft.ng-leave.ng-leave-active { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateY(90deg); | |
transform: perspective(2000px) rotateY(90deg) | |
} | |
.hingeOutFromMiddleX.ng-leave.ng-leave-active, | |
.hingeOutFromTop.ng-leave.ng-leave-active { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateX(-90deg); | |
transform: perspective(2000px) rotateX(-90deg) | |
} | |
.hingeOutFromMiddleX.ng-leave, | |
.hingeOutFromMiddleY.ng-leave { | |
opacity: 1; | |
-webkit-transform: rotate(0deg); | |
transform: rotate(0deg); | |
-webkit-transform-origin: center; | |
transform-origin: center; | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity; | |
transition-timing-function: ease | |
} | |
.hingeOutFromMiddleY.ng-leave.ng-leave-active, | |
.hingeOutFromRight.ng-leave.ng-leave-active { | |
opacity: 0; | |
-webkit-transform: perspective(2000px) rotateY(-90deg); | |
transform: perspective(2000px) rotateY(-90deg) | |
} | |
.zoomIn.ng-enter { | |
opacity: 0; | |
-webkit-transform: scale(1.5); | |
transform: scale(1.5); | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,property; | |
transition-property: transform,property; | |
transition-timing-function: ease | |
} | |
.zoomIn.ng-enter.ng-enter-active { | |
opacity: 1; | |
-webkit-transform: scale(1); | |
transform: scale(1) | |
} | |
.zoomOut.ng-leave { | |
opacity: 1; | |
-webkit-transform: scale(0.5); | |
transform: scale(0.5); | |
transition-delay: 0; | |
transition-duration: 700ms; | |
transition-property: -webkit-transform,property; | |
transition-property: transform,property; | |
transition-timing-function: ease | |
} | |
.zoomOut.ng-leave.ng-leave-active { | |
opacity: 0; | |
-webkit-transform: scale(1); | |
transform: scale(1) | |
} | |
.spinIn.ng-enter { | |
opacity: 0; | |
-webkit-transform: rotate(-270deg); | |
transform: rotate(-270deg); | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity | |
} | |
.spinOut.ng-leave.ng-leave-active { | |
opacity: 0; | |
-webkit-transform: rotate(270deg); | |
transform: rotate(270deg) | |
} | |
.spinInCCW.ng-enter { | |
opacity: 0; | |
-webkit-transform: rotate(270deg); | |
transform: rotate(270deg); | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity | |
} | |
.spinIn.ng-enter.ng-enter-active, | |
.spinInCCW.ng-enter.ng-enter-active { | |
opacity: 1; | |
-webkit-transform: rotate(0); | |
transform: rotate(0) | |
} | |
.spinOut.ng-leave, | |
.spinOutCCW.ng-leave { | |
opacity: 1; | |
-webkit-transform: rotate(0); | |
transform: rotate(0); | |
transition-property: -webkit-transform,opacity; | |
transition-property: transform,opacity | |
} | |
.spinOutCCW.ng-leave.ng-leave-active { | |
opacity: 0; | |
-webkit-transform: rotate(-270deg); | |
transform: rotate(-270deg) | |
} | |
.slow { | |
transition-duration: 1.4s!important | |
} | |
.fast { | |
transition-duration: 300ms!important | |
} | |
.linear { | |
transition-timing-function: linear!important | |
} | |
.ease { | |
transition-timing-function: ease!important | |
} | |
.easeIn { | |
transition-timing-function: ease-in!important | |
} | |
.easeOut { | |
transition-timing-function: ease-out!important | |
} | |
.easeInOut { | |
transition-timing-function: ease-in-out!important | |
} | |
.bounceIn { | |
transition-timing-function: cubic-bezier(0.485,0.155,0.24,1.245)!important | |
} | |
.bounceOut { | |
transition-timing-function: cubic-bezier(0.485,0.155,0.515,0.845)!important | |
} | |
.bounceInOut { | |
transition-timing-function: cubic-bezier(0.76,-0.245,0.24,1.245)!important | |
} | |
.delay { | |
transition-delay: 300ms!important | |
} | |
.long-delay { | |
transition-delay: 700ms!important | |
} | |
.shake { | |
-webkit-animation-delay: 0; | |
animation-delay: 0; | |
-webkit-animation-duration: 700ms; | |
animation-duration: 700ms; | |
-webkit-animation-name: shake; | |
animation-name: shake; | |
-webkit-animation-timing-function: ease; | |
animation-timing-function: ease; | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translate3d(0,0,0); | |
transform: translate3d(0,0,0) | |
} | |
.spin-cw { | |
-webkit-animation-delay: 0; | |
animation-delay: 0; | |
-webkit-animation-duration: 700ms; | |
animation-duration: 700ms; | |
-webkit-animation-name: spin-cw; | |
animation-name: spin-cw; | |
-webkit-animation-timing-function: ease; | |
animation-timing-function: ease; | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translate3d(0,0,0); | |
transform: translate3d(0,0,0) | |
} | |
.spin-ccw { | |
-webkit-animation-delay: 0; | |
animation-delay: 0; | |
-webkit-animation-duration: 700ms; | |
animation-duration: 700ms; | |
-webkit-animation-name: spin-ccw; | |
animation-name: spin-ccw; | |
-webkit-animation-timing-function: ease; | |
animation-timing-function: ease; | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translate3d(0,0,0); | |
transform: translate3d(0,0,0) | |
} | |
.wiggle { | |
-webkit-animation-delay: 0; | |
animation-delay: 0; | |
-webkit-animation-duration: 700ms; | |
animation-duration: 700ms; | |
-webkit-animation-name: wiggle; | |
animation-name: wiggle; | |
-webkit-animation-timing-function: ease; | |
animation-timing-function: ease; | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
-webkit-transform: translate3d(0,0,0); | |
transform: translate3d(0,0,0) | |
} | |
.shake.infinite, | |
.spin-ccw.infinite, | |
.spin-cw.infinite, | |
.wiggle.infinite { | |
-webkit-animation-iteration-count: infinite; | |
animation-iteration-count: infinite | |
} | |
.shake.linear, | |
.spin-ccw.linear, | |
.spin-cw.linear, | |
.wiggle.linear { | |
-webkit-animation-timing-function: linear!important; | |
animation-timing-function: linear!important | |
} | |
.shake.ease, | |
.spin-ccw.ease, | |
.spin-cw.ease, | |
.wiggle.ease { | |
-webkit-animation-timing-function: ease!important; | |
animation-timing-function: ease!important | |
} | |
.shake.easeIn, | |
.spin-ccw.easeIn, | |
.spin-cw.easeIn, | |
.wiggle.easeIn { | |
-webkit-animation-timing-function: ease-in!important; | |
animation-timing-function: ease-in!important | |
} | |
.shake.easeOut, | |
.spin-ccw.easeOut, | |
.spin-cw.easeOut, | |
.wiggle.easeOut { | |
-webkit-animation-timing-function: ease-out!important; | |
animation-timing-function: ease-out!important | |
} | |
.shake.easeInOut, | |
.spin-ccw.easeInOut, | |
.spin-cw.easeInOut, | |
.wiggle.easeInOut { | |
-webkit-animation-timing-function: ease-in-out!important; | |
animation-timing-function: ease-in-out!important | |
} | |
.shake.bounceIn, | |
.spin-ccw.bounceIn, | |
.spin-cw.bounceIn, | |
.wiggle.bounceIn { | |
-webkit-animation-timing-function: cubic-bezier(0.485,0.155,0.24,1.245)!important; | |
animation-timing-function: cubic-bezier(0.485,0.155,0.24,1.245)!important | |
} | |
.shake.bounceOut, | |
.spin-ccw.bounceOut, | |
.spin-cw.bounceOut, | |
.wiggle.bounceOut { | |
-webkit-animation-timing-function: cubic-bezier(0.485,0.155,0.515,0.845)!important; | |
animation-timing-function: cubic-bezier(0.485,0.155,0.515,0.845)!important | |
} | |
.shake.bounceInOut, | |
.spin-ccw.bounceInOut, | |
.spin-cw.bounceInOut, | |
.wiggle.bounceInOut { | |
-webkit-animation-timing-function: cubic-bezier(0.76,-0.245,0.24,1.245)!important; | |
animation-timing-function: cubic-bezier(0.76,-0.245,0.24,1.245)!important | |
} | |
.shake.slow, | |
.spin-ccw.slow, | |
.spin-cw.slow, | |
.wiggle.slow { | |
-webkit-animation-duration: 1.4s!important; | |
animation-duration: 1.4s!important | |
} | |
.shake.fast, | |
.spin-ccw.fast, | |
.spin-cw.fast, | |
.wiggle.fast { | |
-webkit-animation-duration: 300ms!important; | |
animation-duration: 300ms!important | |
} | |
.shake.delay, | |
.spin-ccw.delay, | |
.spin-cw.delay, | |
.wiggle.delay { | |
-webkit-animation-delay: 300ms!important; | |
animation-delay: 300ms!important | |
} | |
.shake.long-delay, | |
.spin-ccw.long-delay, | |
.spin-cw.long-delay, | |
.wiggle.long-delay { | |
-webkit-animation-delay: 700ms!important; | |
animation-delay: 700ms!important | |
} | |
.long-stagger, | |
.stagger, | |
.stort-stagger { | |
transition-delay: 150ms; | |
transition-duration: 0 | |
} | |
.notification, | |
.static-notification { | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
display: none; | |
margin-bottom: .5rem; | |
margin-top: .5rem; | |
position: relative; | |
z-index: 1000 | |
} | |
.notification h1, | |
.static-notification h1 { | |
font-size: 1.25em; | |
margin: 0 | |
} | |
.is-active.modal .grid-block, | |
.is-active.modal .grid-content, | |
.notification p, | |
.static-notification p, | |
body { | |
margin: 0 | |
} | |
.button-group.expand, | |
.is-active.notification, | |
.is-active.static-notification, | |
.modal-overlay.is-active { | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex | |
} | |
.notification-container { | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex-direction: column; | |
-ms-flex-direction: column; | |
flex-direction: column; | |
position: fixed; | |
z-index: 3000 | |
} | |
.notification { | |
background: #00558b; | |
border-radius: 4px; | |
padding: 1rem | |
} | |
.notification.success { | |
background: #43ac6a; | |
border-radius: 4px; | |
padding: 1rem | |
} | |
.notification.warning { | |
background: #f08a24; | |
border-radius: 4px; | |
padding: 1rem | |
} | |
.notification.alert { | |
background: #f04124; | |
border-radius: 4px; | |
padding: 1rem | |
} | |
.notification.dark { | |
background: #232323; | |
border-radius: 4px; | |
padding: 1rem | |
} | |
.menu-bar.dark>li>a, | |
.menu-bar.primary>li>a, | |
.menu-group.dark .menu-bar>li>a, | |
.menu-group.primary .menu-bar>li>a, | |
.notification.dark, | |
.notification.dark h1, | |
.notification.dark h2, | |
.notification.dark h3, | |
.notification.dark h4, | |
.notification.dark h5, | |
.notification.dark h6, | |
.title-bar.dark a, | |
.title-bar.dark a:hover, | |
.title-bar.primary a, | |
.title-bar.primary a:hover { | |
color: #fff | |
} | |
.static-notification { | |
background: #00558b; | |
border-radius: 4px; | |
padding: 1rem; | |
position: fixed!important | |
} | |
.notification, | |
.notification .close-button, | |
.notification h1, | |
.notification h2, | |
.notification h3, | |
.notification h4, | |
.notification h5, | |
.notification h6, | |
.notification.alert, | |
.notification.alert h1, | |
.notification.alert h2, | |
.notification.alert h3, | |
.notification.alert h4, | |
.notification.alert h5, | |
.notification.alert h6, | |
.notification.success, | |
.notification.success h1, | |
.notification.success h2, | |
.notification.success h3, | |
.notification.success h4, | |
.notification.success h5, | |
.notification.success h6, | |
.notification.warning, | |
.notification.warning h1, | |
.notification.warning h2, | |
.notification.warning h3, | |
.notification.warning h4, | |
.notification.warning h5, | |
.notification.warning h6, | |
.static-notification, | |
.static-notification .close-button, | |
.static-notification h1, | |
.static-notification h2, | |
.static-notification h3, | |
.static-notification h4, | |
.static-notification h5, | |
.static-notification h6 { | |
color: white | |
} | |
.notification-container, | |
.notification-container.top-right, | |
.static-notification.top-right { | |
right: 1rem; | |
top: 1rem; | |
width: 25rem | |
} | |
.notification-container.top-left, | |
.static-notification.top-left { | |
left: 1rem; | |
top: 1rem; | |
width: 25rem | |
} | |
.notification-container.top-middle, | |
.static-notification.top-middle { | |
left: 50%; | |
margin-left: -12.5rem; | |
top: 1rem; | |
width: 25rem | |
} | |
.notification-container.bottom-right, | |
.static-notification.bottom-right { | |
bottom: 1rem; | |
right: 1rem; | |
top: auto; | |
width: 25rem | |
} | |
.notification-container.bottom-left, | |
.static-notification.bottom-left { | |
bottom: 1rem; | |
left: 1rem; | |
top: auto; | |
width: 25rem | |
} | |
.notification-container.bottom-middle, | |
.static-notification.bottom-middle { | |
bottom: 1rem; | |
left: 50%; | |
margin-left: -12.5rem; | |
top: auto; | |
width: 25rem | |
} | |
.notification-icon { | |
-webkit-align-self: flex-start; | |
align-self: flex-start; | |
-webkit-flex: 0 0 60px; | |
-ms-flex: 0 0 60px; | |
flex: 0 0 60px; | |
-ms-flex-item-align: start; | |
margin-right: 1rem | |
} | |
.notification-icon img { | |
height: auto; | |
width: 100% | |
} | |
.button-group.expand>li, | |
.notification-content { | |
-webkit-flex: 1; | |
-ms-flex: 1; | |
flex: 1 | |
} | |
.is-active.off-canvas { | |
-webkit-transform: translate(0,0)!important; | |
transform: translate(0,0)!important | |
} | |
.off-canvas~.grid-frame { | |
-webkit-backface-visibility: hidden; | |
backface-visibility: hidden; | |
background: white; | |
-webkit-transform: translate(0,0,0); | |
transform: translate(0,0,0); | |
transition: -webkit-transform 0.25s ease-out; | |
transition: transform 0.25s ease-out | |
} | |
.off-canvas { | |
background: #fff; | |
box-shadow: inset -3px 0 10px rgba(0,0,0,0.25); | |
color: #000; | |
height: 100%; | |
left: 0; | |
overflow: scroll; | |
-webkit-overflow-scrolling: touch; | |
position: fixed; | |
top: 0; | |
-webkit-transform: translateX(-100%); | |
transform: translateX(-100%); | |
transition: -webkit-transform 0.25s ease-out; | |
transition: transform 0.25s ease-out; | |
width: 250px; | |
z-index: 2 | |
} | |
.off-canvas.top { | |
box-shadow: inset 0 -3px 10px rgba(0,0,0,0.25); | |
height: 250px; | |
left: 0; | |
top: 0; | |
-webkit-transform: translateY(-100%); | |
transform: translateY(-100%); | |
width: 100% | |
} | |
.off-canvas.top.is-active~.grid-frame { | |
-webkit-transform: translateY(250px)!important; | |
transform: translateY(250px)!important | |
} | |
.off-canvas.right { | |
box-shadow: inset 3px 0 10px rgba(0,0,0,0.25); | |
height: 100%; | |
left: auto; | |
right: 0; | |
top: 0; | |
-webkit-transform: translateX(100%); | |
transform: translateX(100%); | |
width: 250px | |
} | |
.off-canvas.right.is-active~.grid-frame { | |
-webkit-transform: translateX(-250px)!important; | |
transform: translateX(-250px)!important | |
} | |
.off-canvas.bottom { | |
bottom: 0; | |
box-shadow: inset 0 3px 10px rgba(0,0,0,0.25); | |
height: 250px; | |
left: 0; | |
top: auto; | |
-webkit-transform: translateY(100%); | |
transform: translateY(100%); | |
width: 100% | |
} | |
.off-canvas.bottom.is-active~.grid-frame { | |
-webkit-transform: translateY(-250px)!important; | |
transform: translateY(-250px)!important | |
} | |
.off-canvas.left { | |
box-shadow: inset -3px 0 10px rgba(0,0,0,0.25); | |
height: 100%; | |
left: 0; | |
top: 0; | |
-webkit-transform: translateX(-100%); | |
transform: translateX(-100%); | |
width: 250px | |
} | |
.off-canvas.is-active~.grid-frame, | |
.off-canvas.left.is-active~.grid-frame { | |
-webkit-transform: translateX(250px)!important; | |
transform: translateX(250px)!important | |
} | |
.off-canvas.detached { | |
box-shadow: none; | |
z-index: 0 | |
} | |
.off-canvas.detached, | |
.off-canvas.detached.is-active { | |
-webkit-transform: none; | |
transform: none | |
} | |
.off-canvas.detached~.grid-frame { | |
box-shadow: 0 0 15px rgba(0,0,0,0.5); | |
z-index: 1 | |
} | |
.button-group.segmented>li.is-active>a, | |
.button-group.segmented>li.is-active>a:hover, | |
.button-group.segmented>li>input:checked+label, | |
.button-group.segmented>li>input:checked+label:hover, | |
.off-canvas.primary { | |
background: #00558b; | |
color: #fff | |
} | |
.button.dark, | |
.off-canvas.dark { | |
background: #232323; | |
color: #fff | |
} | |
.tether-enabled.popup { | |
opacity: 1; | |
pointer-events: auto | |
} | |
.popup { | |
background: #fff; | |
border: 0; | |
border-radius: 0; | |
box-shadow: 0 0 10px rgba(0,0,0,0.25); | |
opacity: 0; | |
overflow: hidden; | |
pointer-events: none; | |
position: absolute; | |
transition: opacity 0.25s ease-out; | |
width: 18.75rem; | |
z-index: 1000 | |
} | |
.popup.dark { | |
background: #232323; | |
border: 0; | |
border-radius: 0; | |
box-shadow: 0 0 10px rgba(0,0,0,0.25) | |
} | |
.popup.primary { | |
background: #00558b; | |
border: 0; | |
border-radius: 0; | |
box-shadow: 0 0 10px rgba(0,0,0,0.25) | |
} | |
.switch>input { | |
left: -9999px; | |
outline: 0; | |
position: absolute | |
} | |
.switch>label { | |
cursor: pointer; | |
display: block; | |
height: 100%; | |
margin: 0; | |
-ms-touch-action: manipulation; | |
touch-action: manipulation; | |
width: 100% | |
} | |
.switch { | |
border-radius: 9999px; | |
display: inline-block; | |
height: 2rem; | |
overflow: hidden; | |
position: relative; | |
width: 3.125rem | |
} | |
.switch input:checked+label::after { | |
left: 1.125rem | |
} | |
.switch>label, | |
meter, | |
meter::-webkit-meter-bar, | |
progress::-webkit-progress-bar { | |
background: #ccc | |
} | |
.switch>label::after { | |
background: white; | |
border: 4px solid #ccc; | |
border-radius: 9999px; | |
content: ''; | |
display: block; | |
height: 2rem; | |
left: 0; | |
position: absolute; | |
top: 0; | |
transition: left 0.15s ease-out; | |
width: 2rem | |
} | |
.switch input:checked+label { | |
background: #00558b; | |
margin: 0 | |
} | |
.button-group.segmented, | |
.switch input:checked+label::after { | |
border-color: #00558b | |
} | |
.switch.small { | |
height: 1.625rem; | |
width: 2.5rem | |
} | |
.switch.small>label::after { | |
height: 1.625rem; | |
width: 1.625rem | |
} | |
.switch.small input:checked+label::after { | |
left: 0.875rem | |
} | |
.switch.large { | |
height: 2.375rem; | |
width: 3.75rem | |
} | |
.switch.large>label::after { | |
height: 2.375rem; | |
width: 2.375rem | |
} | |
.switch.large input:checked+label::after { | |
left: 1.375rem | |
} | |
.tabs { | |
background: transparent; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap | |
} | |
.tabs.vertical { | |
background: transparent; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap | |
} | |
.tabs .tab-item { | |
background: #f3f3f3; | |
color: #000; | |
cursor: pointer; | |
-webkit-flex: 0 1 auto; | |
-ms-flex: 0 1 auto; | |
flex: 0 1 auto; | |
line-height: 1; | |
margin: 0; | |
padding: 1rem | |
} | |
.card-section, | |
.padding, | |
.tab-contents { | |
padding: 1rem | |
} | |
.accordion { | |
border: 1px solid #cbcbcb | |
} | |
.accordion-title { | |
background: #f3f3f3; | |
color: #000; | |
cursor: pointer; | |
line-height: 1; | |
padding: 1rem | |
} | |
.accordion-title:hover, | |
.tabs .tab-item.is-active:hover, | |
.tabs .tab-item:hover { | |
background: #e7e7e7 | |
} | |
.is-active>.accordion-title, | |
.tabs .tab-item.is-active { | |
background: #ececec; | |
color: #000 | |
} | |
.accordion-content { | |
display: none; | |
padding: 1rem | |
} | |
.is-active.panel, | |
.is-active>.accordion-content, | |
.tab-contents .tab-content.is-active, | |
article, | |
aside, | |
details, | |
figcaption, | |
figure, | |
footer, | |
header, | |
hgroup, | |
main, | |
nav, | |
section, | |
summary { | |
display: block | |
} | |
blockquote, | |
dd, | |
div, | |
dl, | |
dt, | |
form, | |
h1, | |
h2, | |
h3, | |
h4, | |
h5, | |
h6, | |
li, | |
ol, | |
p, | |
pre, | |
td, | |
th, | |
ul { | |
margin: 0; | |
padding: 0 | |
} | |
a { | |
color: #00558b; | |
line-height: inherit; | |
text-decoration: none | |
} | |
.block-list li>a, | |
.block-list li>label, | |
a[ui-sref] { | |
cursor: pointer | |
} | |
a:focus, | |
a:hover { | |
color: #004978 | |
} | |
.block-list [type="text"]:focus, | |
.block-list [type="text"]:hover, | |
.block-list input[type="color"]:focus, | |
.block-list input[type="color"]:hover, | |
.block-list input[type="date"]:focus, | |
.block-list input[type="date"]:hover, | |
.block-list input[type="datetime"]:focus, | |
.block-list input[type="datetime"]:hover, | |
.block-list input[type="datetime-local"]:focus, | |
.block-list input[type="datetime-local"]:hover, | |
.block-list input[type="email"]:focus, | |
.block-list input[type="email"]:hover, | |
.block-list input[type="month"]:focus, | |
.block-list input[type="month"]:hover, | |
.block-list input[type="number"]:focus, | |
.block-list input[type="number"]:hover, | |
.block-list input[type="password"]:focus, | |
.block-list input[type="password"]:hover, | |
.block-list input[type="search"]:focus, | |
.block-list input[type="search"]:hover, | |
.block-list input[type="tel"]:focus, | |
.block-list input[type="tel"]:hover, | |
.block-list input[type="time"]:focus, | |
.block-list input[type="time"]:hover, | |
.block-list input[type="url"]:focus, | |
.block-list input[type="url"]:hover, | |
.block-list input[type="week"]:focus, | |
.block-list input[type="week"]:hover, | |
.block-list textarea:focus, | |
.block-list textarea:hover, | |
a img, | |
img { | |
border: 0 | |
} | |
p { | |
font-family: inherit; | |
font-size: 1rem; | |
font-weight: normal; | |
line-height: 1.6; | |
margin-bottom: 1.25rem; | |
text-rendering: optimizeLegibility | |
} | |
p.lead { | |
font-size: 1.21875rem; | |
line-height: 1.6 | |
} | |
p aside { | |
font-size: 0.875rem; | |
font-style: italic; | |
line-height: 1.35 | |
} | |
h1, | |
h2, | |
h3, | |
h4, | |
h5, | |
h6 { | |
color: #222; | |
font-family: Helvetica Neue,Helvetica,Helvetica,Arial,sans-serif; | |
font-style: normal; | |
font-weight: normal; | |
line-height: 1.4; | |
margin-bottom: 0.5rem; | |
margin-top: 0.2rem; | |
text-rendering: optimizeLegibility | |
} | |
h1 small, | |
h2 small, | |
h3 small, | |
h4 small, | |
h5 small, | |
h6 small { | |
color: #6f6f6f; | |
font-size: 60%; | |
line-height: 0 | |
} | |
h1 { | |
font-size: 2em; | |
font-size: 2.125rem; | |
margin: .67em 0 | |
} | |
h2 { | |
font-size: 1.6875rem | |
} | |
h3 { | |
font-size: 1.375rem | |
} | |
h4, | |
h5 { | |
font-size: 1.125rem | |
} | |
.subheader { | |
color: #6f6f6f; | |
font-weight: normal; | |
line-height: 1.4; | |
margin-bottom: 0.5rem; | |
margin-top: 0.2rem | |
} | |
em, | |
i { | |
font-style: italic; | |
line-height: inherit | |
} | |
b, | |
strong { | |
font-weight: bold; | |
line-height: inherit | |
} | |
small { | |
color: #6f6f6f; | |
font-size: 80%; | |
font-size: 60%; | |
line-height: inherit | |
} | |
code { | |
background-color: #fbfbfb; | |
border-color: #e2e2e2; | |
border-style: solid; | |
border-width: 1px; | |
color: #464646; | |
font-family: Consolas,Liberation Mono,Courier,monospace; | |
font-weight: normal; | |
padding: 0.125rem 0.3125rem 0.0625rem | |
} | |
dl, | |
ol, | |
ul { | |
font-family: inherit; | |
font-size: 1rem; | |
line-height: 1.6; | |
list-style-position: outside; | |
margin-bottom: 1.25rem | |
} | |
ol, | |
ul { | |
margin-left: 1.1rem | |
} | |
ol li ol, | |
ol li ul, | |
ul li ol, | |
ul li ul { | |
margin-bottom: 0; | |
margin-left: 1.25rem | |
} | |
.block-list, | |
.block-list ul, | |
ul.no-bullet, | |
ul.no-bullet li ol, | |
ul.no-bullet li ul { | |
list-style-type: none | |
} | |
dl dt { | |
font-weight: bold; | |
margin-bottom: 0.3rem | |
} | |
dl dd { | |
margin-bottom: 0.75rem | |
} | |
abbr, | |
acronym { | |
border-bottom: 1px dotted #ddd; | |
color: #222; | |
cursor: help; | |
font-size: 90%; | |
text-transform: uppercase | |
} | |
abbr, | |
button, | |
select { | |
text-transform: none | |
} | |
blockquote { | |
border-left: 1px solid #ddd; | |
margin: 0 0 1.25rem; | |
padding: 0.5625rem 1.25rem 0 1.1875rem | |
} | |
blockquote cite { | |
color: #555; | |
display: block; | |
font-size: 0.8125rem | |
} | |
blockquote cite:before { | |
content: "\2014 \0020" | |
} | |
blockquote cite a, | |
blockquote cite a:visited { | |
color: #555 | |
} | |
blockquote, | |
blockquote p { | |
color: #6f6f6f; | |
line-height: 1.6 | |
} | |
.v-align { | |
-webkit-align-items: center; | |
align-items: center; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-ms-flex-align: center; | |
-ms-flex-pack: justify; | |
-webkit-justify-content: space-between; | |
justify-content: space-between | |
} | |
.v-align .align-top, | |
.v-align .small-align-top { | |
-webkit-align-self: flex-start; | |
align-self: flex-start; | |
-ms-flex-item-align: start | |
} | |
.v-align .align-center, | |
.v-align .small-align-center { | |
-webkit-align-self: center; | |
align-self: center; | |
-ms-flex-item-align: center | |
} | |
.v-align .align-bottom, | |
.v-align .small-align-bottom { | |
-webkit-align-self: flex-end; | |
align-self: flex-end; | |
-ms-flex-item-align: end | |
} | |
.invisible { | |
visibility: hidden | |
} | |
.hide-for-small { | |
display: block!important; | |
display: none!important | |
} | |
.hide-for-small[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important; | |
display: none!important | |
} | |
.show-for-small { | |
display: none!important; | |
display: block!important | |
} | |
.show-for-small[class*="grid-block"] { | |
display: none!important; | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
.hide-for-large, | |
.hide-for-large-only, | |
.hide-for-medium, | |
.hide-for-medium-only, | |
.hide-for-small-only { | |
display: block!important | |
} | |
.hide-for-large-only[class*="grid-block"], | |
.hide-for-large[class*="grid-block"], | |
.hide-for-medium-only[class*="grid-block"], | |
.hide-for-medium[class*="grid-block"], | |
.hide-for-small-only[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
@media only screen and (orientation: portrait) { | |
.hide-for-portrait { | |
display: none!important | |
} | |
.show-for-portrait { | |
display: block!important | |
} | |
.hide-for-portrait[class*="grid-block"], | |
.show-for-portrait[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
} | |
@media only screen and (orientation: landscape) { | |
.hide-for-landscape { | |
display: none!important | |
} | |
.show-for-landscape { | |
display: block!important | |
} | |
.hide-for-landscape[class*="grid-block"], | |
.show-for-landscape[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
} | |
.small-text-left, | |
.text-left { | |
text-align: left | |
} | |
.small-text-right, | |
.text-right { | |
text-align: right | |
} | |
@media only screen and (min-width: 0em) and (max-width: 39.9375rem) { | |
.notification-container, | |
.notification-container.bottom-left, | |
.notification-container.bottom-middle, | |
.notification-container.bottom-right, | |
.notification-container.top-left, | |
.notification-container.top-middle, | |
.notification-container.top-right, | |
.static-notification.bottom-left, | |
.static-notification.bottom-middle, | |
.static-notification.bottom-right, | |
.static-notification.top-left, | |
.static-notification.top-middle, | |
.static-notification.top-right { | |
left: 1rem; | |
margin-left: 0; | |
right: 1rem; | |
width: auto | |
} | |
.hide-for-small-only, | |
.hide-for-small-only[class*="grid-block"] { | |
display: none!important | |
} | |
.show-for-small-only { | |
display: block!important | |
} | |
.show-for-small-only[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
.small-only-text-left { | |
text-align: left | |
} | |
.small-only-text-right { | |
text-align: right | |
} | |
.small-only-text-center { | |
text-align: center | |
} | |
.small-only-text-justify { | |
text-align: justify | |
} | |
} | |
@media only screen and (min-width: 40em) { | |
.action-sheet { | |
border-radius: 4px; | |
bottom: 0; | |
box-shadow: 0 0 10px rgba(0,0,0,0.25); | |
left: 50%; | |
opacity: 0; | |
pointer-events: none; | |
position: absolute; | |
top: auto; | |
-webkit-transform: translateX(-50%) translateY(110%); | |
transform: translateX(-50%) translateY(110%); | |
width: 300px | |
} | |
.action-sheet.is-active { | |
-webkit-transform: translateX(-50%) translateY(100%); | |
transform: translateX(-50%) translateY(100%) | |
} | |
.action-sheet::after, | |
.action-sheet::before { | |
border-bottom: 10px solid white; | |
border-top: 0; | |
bottom: auto; | |
top: -10px | |
} | |
.action-sheet::before { | |
border-bottom-color: rgba(0,0,0,0.15); | |
top: -12px | |
} | |
.action-sheet.top { | |
border-radius: 4px; | |
bottom: auto; | |
box-shadow: 0 0 10px rgba(0,0,0,0.25); | |
left: 50%; | |
opacity: 0; | |
pointer-events: none; | |
position: absolute; | |
top: 0; | |
-webkit-transform: translateX(-50%) translateY(-120%); | |
transform: translateX(-50%) translateY(-120%); | |
width: 300px | |
} | |
.action-sheet.is-active, | |
.action-sheet.top.is-active { | |
opacity: 1; | |
pointer-events: auto | |
} | |
.action-sheet.top::after, | |
.action-sheet.top::before, | |
.action-sheet::after, | |
.action-sheet::before { | |
border-left: 10px solid transparent; | |
border-right: 10px solid transparent; | |
content: ''; | |
display: block; | |
height: 0; | |
left: 50%; | |
margin-left: -10px; | |
position: absolute; | |
width: 0 | |
} | |
.action-sheet.top.is-active { | |
-webkit-transform: translateX(-50%) translateY(-110%); | |
transform: translateX(-50%) translateY(-110%) | |
} | |
.action-sheet.top::after, | |
.action-sheet.top::before { | |
border-bottom: 0; | |
border-top: 10px solid white; | |
bottom: -10px; | |
top: auto | |
} | |
.action-sheet.top::before { | |
border-top-color: rgba(0,0,0,0.15); | |
bottom: -12px | |
} | |
.medium-vertical.grid-block, | |
.medium-vertical.grid-frame, | |
.medium-vertical.large-grid-block, | |
.medium-vertical.medium-grid-block, | |
.medium-vertical.small-grid-block { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap | |
} | |
.medium-horizontal.grid-block, | |
.medium-horizontal.grid-frame, | |
.medium-horizontal.large-grid-block, | |
.medium-horizontal.medium-grid-block, | |
.medium-horizontal.small-grid-block { | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap | |
} | |
.medium-grid-block { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex: 1 1; | |
-ms-flex: 1 1; | |
flex: 1 1; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap; | |
-ms-flex-order: 0; | |
-ms-flex-pack: start; | |
-webkit-flex-wrap: nowrap; | |
-ms-flex-wrap: nowrap; | |
flex-wrap: nowrap; | |
height: 100vh; | |
height: auto; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start; | |
-webkit-order: 0; | |
order: 0; | |
overflow: hidden; | |
-webkit-overflow-scrolling: touch; | |
-ms-overflow-style: -ms-autohiding-scrollbar; | |
overflow-y: auto; | |
position: relative | |
} | |
.medium-grid-content { | |
display: block; | |
-webkit-flex: 1 1; | |
-ms-flex: 1 1; | |
flex: 1 1; | |
-webkit-overflow-scrolling: touch; | |
-ms-overflow-style: -ms-autohiding-scrollbar; | |
overflow-y: auto; | |
padding: 0 1rem | |
} | |
.medium-grid-block.panel, | |
.medium-grid-content.panel { | |
background: transparent; | |
bottom: auto; | |
box-shadow: none; | |
height: auto; | |
left: auto; | |
position: relative; | |
right: auto; | |
top: auto; | |
-webkit-transform: none; | |
transform: none; | |
width: auto; | |
z-index: auto | |
} | |
.medium-1 { | |
-webkit-flex: 0 0 8.33333%; | |
-ms-flex: 0 0 8.33333%; | |
flex: 0 0 8.33333%; | |
max-width: 8.33333% | |
} | |
.medium-order-1 { | |
-ms-flex-order: 1; | |
-webkit-order: 1; | |
order: 1 | |
} | |
.medium-offset-1 { | |
margin-left: 8.33333% | |
} | |
.medium-up-1>div, | |
.medium-up-1>li, | |
.medium-up-1>section { | |
-webkit-flex: 0 0 100%; | |
-ms-flex: 0 0 100%; | |
flex: 0 0 100%; | |
padding: 0 1rem 1rem | |
} | |
.medium-2 { | |
-webkit-flex: 0 0 16.66667%; | |
-ms-flex: 0 0 16.66667%; | |
flex: 0 0 16.66667%; | |
max-width: 16.66667% | |
} | |
.medium-order-2 { | |
-ms-flex-order: 2; | |
-webkit-order: 2; | |
order: 2 | |
} | |
.medium-offset-2 { | |
margin-left: 16.66667% | |
} | |
.medium-up-2>div, | |
.medium-up-2>li, | |
.medium-up-2>section { | |
-webkit-flex: 0 0 50%; | |
-ms-flex: 0 0 50%; | |
flex: 0 0 50%; | |
padding: 0 1rem 1rem | |
} | |
.medium-3 { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
max-width: 25% | |
} | |
.medium-order-3 { | |
-ms-flex-order: 3; | |
-webkit-order: 3; | |
order: 3 | |
} | |
.medium-offset-3 { | |
margin-left: 25% | |
} | |
.medium-up-3>div, | |
.medium-up-3>li, | |
.medium-up-3>section { | |
-webkit-flex: 0 0 33.33333%; | |
-ms-flex: 0 0 33.33333%; | |
flex: 0 0 33.33333%; | |
padding: 0 1rem 1rem | |
} | |
.medium-4 { | |
-webkit-flex: 0 0 33.33333%; | |
-ms-flex: 0 0 33.33333%; | |
flex: 0 0 33.33333%; | |
max-width: 33.33333% | |
} | |
.medium-order-4 { | |
-ms-flex-order: 4; | |
-webkit-order: 4; | |
order: 4 | |
} | |
.medium-offset-4 { | |
margin-left: 33.33333% | |
} | |
.medium-up-4>div, | |
.medium-up-4>li, | |
.medium-up-4>section { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
padding: 0 1rem 1rem | |
} | |
.medium-5 { | |
-webkit-flex: 0 0 41.66667%; | |
-ms-flex: 0 0 41.66667%; | |
flex: 0 0 41.66667%; | |
max-width: 41.66667% | |
} | |
.medium-order-5 { | |
-ms-flex-order: 5; | |
-webkit-order: 5; | |
order: 5 | |
} | |
.medium-offset-5 { | |
margin-left: 41.66667% | |
} | |
.medium-up-5>div, | |
.medium-up-5>li, | |
.medium-up-5>section { | |
-webkit-flex: 0 0 20%; | |
-ms-flex: 0 0 20%; | |
flex: 0 0 20%; | |
padding: 0 1rem 1rem | |
} | |
.medium-6 { | |
-webkit-flex: 0 0 50%; | |
-ms-flex: 0 0 50%; | |
flex: 0 0 50%; | |
max-width: 50% | |
} | |
.medium-order-6 { | |
-ms-flex-order: 6; | |
-webkit-order: 6; | |
order: 6 | |
} | |
.medium-offset-6 { | |
margin-left: 50% | |
} | |
.medium-up-6>div, | |
.medium-up-6>li, | |
.medium-up-6>section { | |
-webkit-flex: 0 0 16.66667%; | |
-ms-flex: 0 0 16.66667%; | |
flex: 0 0 16.66667%; | |
padding: 0 1rem 1rem | |
} | |
.medium-7 { | |
-webkit-flex: 0 0 58.33333%; | |
-ms-flex: 0 0 58.33333%; | |
flex: 0 0 58.33333%; | |
max-width: 58.33333% | |
} | |
.medium-order-7 { | |
-ms-flex-order: 7; | |
-webkit-order: 7; | |
order: 7 | |
} | |
.medium-offset-7 { | |
margin-left: 58.33333% | |
} | |
.medium-up-7>div, | |
.medium-up-7>li, | |
.medium-up-7>section { | |
-webkit-flex: 0 0 14.28571%; | |
-ms-flex: 0 0 14.28571%; | |
flex: 0 0 14.28571%; | |
padding: 0 1rem 1rem | |
} | |
.medium-8 { | |
-webkit-flex: 0 0 66.66667%; | |
-ms-flex: 0 0 66.66667%; | |
flex: 0 0 66.66667%; | |
max-width: 66.66667% | |
} | |
.medium-order-8 { | |
-ms-flex-order: 8; | |
-webkit-order: 8; | |
order: 8 | |
} | |
.medium-offset-8 { | |
margin-left: 66.66667% | |
} | |
.medium-up-8>div, | |
.medium-up-8>li, | |
.medium-up-8>section { | |
-webkit-flex: 0 0 12.5%; | |
-ms-flex: 0 0 12.5%; | |
flex: 0 0 12.5%; | |
padding: 0 1rem 1rem | |
} | |
.medium-9 { | |
-webkit-flex: 0 0 75%; | |
-ms-flex: 0 0 75%; | |
flex: 0 0 75%; | |
max-width: 75% | |
} | |
.medium-order-9 { | |
-ms-flex-order: 9; | |
-webkit-order: 9; | |
order: 9 | |
} | |
.medium-offset-9 { | |
margin-left: 75% | |
} | |
.medium-up-9>div, | |
.medium-up-9>li, | |
.medium-up-9>section { | |
-webkit-flex: 0 0 11.11111%; | |
-ms-flex: 0 0 11.11111%; | |
flex: 0 0 11.11111%; | |
padding: 0 1rem 1rem | |
} | |
.medium-10 { | |
-webkit-flex: 0 0 83.33333%; | |
-ms-flex: 0 0 83.33333%; | |
flex: 0 0 83.33333%; | |
max-width: 83.33333% | |
} | |
.medium-order-10 { | |
-ms-flex-order: 10; | |
-webkit-order: 10; | |
order: 10 | |
} | |
.medium-offset-10 { | |
margin-left: 83.33333% | |
} | |
.medium-up-10>div, | |
.medium-up-10>li, | |
.medium-up-10>section { | |
-webkit-flex: 0 0 10%; | |
-ms-flex: 0 0 10%; | |
flex: 0 0 10%; | |
padding: 0 1rem 1rem | |
} | |
.medium-11 { | |
-webkit-flex: 0 0 91.66667%; | |
-ms-flex: 0 0 91.66667%; | |
flex: 0 0 91.66667%; | |
max-width: 91.66667% | |
} | |
.medium-order-11 { | |
-ms-flex-order: 11; | |
-webkit-order: 11; | |
order: 11 | |
} | |
.medium-offset-11 { | |
margin-left: 91.66667% | |
} | |
.medium-up-11>div, | |
.medium-up-11>li, | |
.medium-up-11>section { | |
-webkit-flex: 0 0 9.09091%; | |
-ms-flex: 0 0 9.09091%; | |
flex: 0 0 9.09091%; | |
padding: 0 1rem 1rem | |
} | |
.medium-12 { | |
-webkit-flex: 0 0 100%; | |
-ms-flex: 0 0 100%; | |
flex: 0 0 100%; | |
max-width: 100% | |
} | |
.medium-order-12 { | |
-ms-flex-order: 12; | |
-webkit-order: 12; | |
order: 12 | |
} | |
.medium-offset-12 { | |
margin-left: 100% | |
} | |
.medium-up-1, | |
.medium-up-10, | |
.medium-up-11, | |
.medium-up-12, | |
.medium-up-2, | |
.medium-up-3, | |
.medium-up-4, | |
.medium-up-5, | |
.medium-up-6, | |
.medium-up-7, | |
.medium-up-8, | |
.medium-up-9 { | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap; | |
list-style-type: none; | |
overflow: visible | |
} | |
.medium-up-12>div, | |
.medium-up-12>li, | |
.medium-up-12>section { | |
-webkit-flex: 0 0 8.33333%; | |
-ms-flex: 0 0 8.33333%; | |
flex: 0 0 8.33333%; | |
padding: 0 1rem 1rem | |
} | |
.menu-bar.medium-expand li { | |
-webkit-flex: 1 0 auto; | |
-ms-flex: 1 0 auto; | |
flex: 1 0 auto | |
} | |
.menu-bar.medium-align-left { | |
-ms-flex-pack: start; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start | |
} | |
.menu-bar.medium-align-right { | |
-ms-flex-pack: end; | |
-webkit-justify-content: flex-end; | |
justify-content: flex-end | |
} | |
.menu-bar.medium-align-center { | |
-ms-flex-pack: center; | |
-webkit-justify-content: center; | |
justify-content: center | |
} | |
.menu-bar.medium-align-justify { | |
-ms-flex-pack: justify; | |
-webkit-justify-content: space-between; | |
justify-content: space-between | |
} | |
.menu-bar.medium-align-spaced { | |
-ms-flex-pack: distribute; | |
-webkit-justify-content: space-around; | |
justify-content: space-around | |
} | |
.menu-bar.medium-horizontal { | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap; | |
overflow-x: hidden | |
} | |
.menu-bar.medium-vertical>li>a { | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap | |
} | |
.menu-bar.medium-horizontal>li>a, | |
.menu-bar.medium-icon-top>li>a, | |
.menu-bar.medium-vertical { | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap | |
} | |
.menu-bar.medium-icon-top>li>a>.iconic, | |
.menu-bar.medium-icon-top>li>a>img { | |
margin: 0 0 1rem 0 | |
} | |
.menu-bar.medium-icon-right>li>a { | |
-webkit-flex-flow: row-reverse nowrap; | |
-ms-flex-flow: row-reverse nowrap; | |
flex-flow: row-reverse nowrap | |
} | |
.menu-bar.medium-icon-right>li>a>.iconic, | |
.menu-bar.medium-icon-right>li>a>img { | |
margin: 0 0 0 1rem | |
} | |
.menu-bar.medium-icon-bottom>li>a { | |
-webkit-flex-flow: column-reverse nowrap; | |
-ms-flex-flow: column-reverse nowrap; | |
flex-flow: column-reverse nowrap | |
} | |
.menu-bar.medium-icon-bottom>li>a>.iconic, | |
.menu-bar.medium-icon-bottom>li>a>img { | |
margin: 1rem 0 0 0 | |
} | |
.menu-bar.medium-icon-bottom>li>.iconic, | |
.menu-bar.medium-icon-bottom>li>img, | |
.menu-bar.medium-icon-left>li>.iconic, | |
.menu-bar.medium-icon-left>li>img, | |
.menu-bar.medium-icon-right>li>.iconic, | |
.menu-bar.medium-icon-right>li>img, | |
.menu-bar.medium-icon-top>li>.iconic, | |
.menu-bar.medium-icon-top>li>img { | |
height: 25px; | |
margin: 0; | |
width: 25px | |
} | |
.menu-bar.medium-icon-left>li>a { | |
-webkit-align-items: center; | |
align-items: center; | |
-ms-flex-align: center; | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap | |
} | |
.menu-bar.medium-icon-left>li>a>.iconic, | |
.menu-bar.medium-icon-left>li>a>img { | |
margin: 0 1rem 0 0 | |
} | |
.menu-group { | |
-webkit-flex-wrap: nowrap; | |
-ms-flex-wrap: nowrap; | |
flex-wrap: nowrap | |
} | |
.menu-bar.medium-condense li, | |
.menu-group>.menu-group-left, | |
.menu-group>.menu-group-right { | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto | |
} | |
.is-active.modal { | |
height: auto; | |
max-width: 600px | |
} | |
h1, | |
h2, | |
h3, | |
h4, | |
h5, | |
h6 { | |
line-height: 1.4 | |
} | |
h1 { | |
font-size: 2.75rem | |
} | |
h2 { | |
font-size: 2.3125rem | |
} | |
h3 { | |
font-size: 1.6875rem | |
} | |
h4 { | |
font-size: 1.4375rem | |
} | |
h5 { | |
font-size: 1.125rem | |
} | |
h6 { | |
font-size: 1rem | |
} | |
.v-align .medium-align-top { | |
-webkit-align-self: flex-start; | |
align-self: flex-start; | |
-ms-flex-item-align: start | |
} | |
.v-align .medium-align-center { | |
-webkit-align-self: center; | |
align-self: center; | |
-ms-flex-item-align: center | |
} | |
.v-align .medium-align-bottom { | |
-webkit-align-self: flex-end; | |
align-self: flex-end; | |
-ms-flex-item-align: end | |
} | |
.hide-for-medium, | |
.hide-for-medium[class*="grid-block"] { | |
display: none!important | |
} | |
.show-for-medium { | |
display: block!important | |
} | |
.show-for-medium[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
.medium-text-left { | |
text-align: left | |
} | |
.medium-text-right { | |
text-align: right | |
} | |
.medium-text-center { | |
text-align: center | |
} | |
.medium-text-justify { | |
text-align: justify | |
} | |
} | |
@media only screen and (min-width: 40em) and (max-width: 74.9375rem) { | |
.hide-for-medium-only, | |
.hide-for-medium-only[class*="grid-block"] { | |
display: none!important | |
} | |
.show-for-medium-only { | |
display: block!important | |
} | |
.show-for-medium-only[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
.medium-only-text-left { | |
text-align: left | |
} | |
.medium-only-text-right { | |
text-align: right | |
} | |
.medium-only-text-center { | |
text-align: center | |
} | |
.medium-only-text-justify { | |
text-align: justify | |
} | |
} | |
.small-text-justify, | |
.text-justify { | |
text-align: justify | |
} | |
@media only screen and (min-width: 75em) { | |
.large-vertical.grid-block, | |
.large-vertical.grid-frame, | |
.large-vertical.large-grid-block, | |
.large-vertical.medium-grid-block, | |
.large-vertical.small-grid-block { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap | |
} | |
.large-horizontal.grid-block, | |
.large-horizontal.grid-frame, | |
.large-horizontal.large-grid-block, | |
.large-horizontal.medium-grid-block, | |
.large-horizontal.small-grid-block { | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap | |
} | |
.large-grid-block { | |
-webkit-align-items: stretch; | |
align-items: stretch; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex: 1 1; | |
-ms-flex: 1 1; | |
flex: 1 1; | |
-ms-flex-align: stretch; | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap; | |
-ms-flex-order: 0; | |
-ms-flex-pack: start; | |
-webkit-flex-wrap: nowrap; | |
-ms-flex-wrap: nowrap; | |
flex-wrap: nowrap; | |
height: 100vh; | |
height: auto; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start; | |
-webkit-order: 0; | |
order: 0; | |
overflow: hidden; | |
-webkit-overflow-scrolling: touch; | |
-ms-overflow-style: -ms-autohiding-scrollbar; | |
overflow-y: auto; | |
position: relative | |
} | |
.large-grid-content { | |
display: block; | |
-webkit-flex: 1 1; | |
-ms-flex: 1 1; | |
flex: 1 1; | |
-webkit-overflow-scrolling: touch; | |
-ms-overflow-style: -ms-autohiding-scrollbar; | |
overflow-y: auto; | |
padding: 0 1rem | |
} | |
.large-grid-block.panel, | |
.large-grid-content.panel { | |
background: transparent; | |
bottom: auto; | |
box-shadow: none; | |
height: auto; | |
left: auto; | |
position: relative; | |
right: auto; | |
top: auto; | |
-webkit-transform: none; | |
transform: none; | |
width: auto; | |
z-index: auto | |
} | |
.large-1 { | |
-webkit-flex: 0 0 8.33333%; | |
-ms-flex: 0 0 8.33333%; | |
flex: 0 0 8.33333%; | |
max-width: 8.33333% | |
} | |
.large-order-1 { | |
-ms-flex-order: 1; | |
-webkit-order: 1; | |
order: 1 | |
} | |
.large-offset-1 { | |
margin-left: 8.33333% | |
} | |
.large-up-1>div, | |
.large-up-1>li, | |
.large-up-1>section { | |
-webkit-flex: 0 0 100%; | |
-ms-flex: 0 0 100%; | |
flex: 0 0 100%; | |
padding: 0 1rem 1rem | |
} | |
.large-2 { | |
-webkit-flex: 0 0 16.66667%; | |
-ms-flex: 0 0 16.66667%; | |
flex: 0 0 16.66667%; | |
max-width: 16.66667% | |
} | |
.large-order-2 { | |
-ms-flex-order: 2; | |
-webkit-order: 2; | |
order: 2 | |
} | |
.large-offset-2 { | |
margin-left: 16.66667% | |
} | |
.large-up-2>div, | |
.large-up-2>li, | |
.large-up-2>section { | |
-webkit-flex: 0 0 50%; | |
-ms-flex: 0 0 50%; | |
flex: 0 0 50%; | |
padding: 0 1rem 1rem | |
} | |
.large-3 { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
max-width: 25% | |
} | |
.large-order-3 { | |
-ms-flex-order: 3; | |
-webkit-order: 3; | |
order: 3 | |
} | |
.large-offset-3 { | |
margin-left: 25% | |
} | |
.large-up-3>div, | |
.large-up-3>li, | |
.large-up-3>section { | |
-webkit-flex: 0 0 33.33333%; | |
-ms-flex: 0 0 33.33333%; | |
flex: 0 0 33.33333%; | |
padding: 0 1rem 1rem | |
} | |
.large-4 { | |
-webkit-flex: 0 0 33.33333%; | |
-ms-flex: 0 0 33.33333%; | |
flex: 0 0 33.33333%; | |
max-width: 33.33333% | |
} | |
.large-order-4 { | |
-ms-flex-order: 4; | |
-webkit-order: 4; | |
order: 4 | |
} | |
.large-offset-4 { | |
margin-left: 33.33333% | |
} | |
.large-up-4>div, | |
.large-up-4>li, | |
.large-up-4>section { | |
-webkit-flex: 0 0 25%; | |
-ms-flex: 0 0 25%; | |
flex: 0 0 25%; | |
padding: 0 1rem 1rem | |
} | |
.large-5 { | |
-webkit-flex: 0 0 41.66667%; | |
-ms-flex: 0 0 41.66667%; | |
flex: 0 0 41.66667%; | |
max-width: 41.66667% | |
} | |
.large-order-5 { | |
-ms-flex-order: 5; | |
-webkit-order: 5; | |
order: 5 | |
} | |
.large-offset-5 { | |
margin-left: 41.66667% | |
} | |
.large-up-5>div, | |
.large-up-5>li, | |
.large-up-5>section { | |
-webkit-flex: 0 0 20%; | |
-ms-flex: 0 0 20%; | |
flex: 0 0 20%; | |
padding: 0 1rem 1rem | |
} | |
.large-6 { | |
-webkit-flex: 0 0 50%; | |
-ms-flex: 0 0 50%; | |
flex: 0 0 50%; | |
max-width: 50% | |
} | |
.large-order-6 { | |
-ms-flex-order: 6; | |
-webkit-order: 6; | |
order: 6 | |
} | |
.large-offset-6 { | |
margin-left: 50% | |
} | |
.large-up-6>div, | |
.large-up-6>li, | |
.large-up-6>section { | |
-webkit-flex: 0 0 16.66667%; | |
-ms-flex: 0 0 16.66667%; | |
flex: 0 0 16.66667%; | |
padding: 0 1rem 1rem | |
} | |
.large-7 { | |
-webkit-flex: 0 0 58.33333%; | |
-ms-flex: 0 0 58.33333%; | |
flex: 0 0 58.33333%; | |
max-width: 58.33333% | |
} | |
.large-order-7 { | |
-ms-flex-order: 7; | |
-webkit-order: 7; | |
order: 7 | |
} | |
.large-offset-7 { | |
margin-left: 58.33333% | |
} | |
.large-up-7>div, | |
.large-up-7>li, | |
.large-up-7>section { | |
-webkit-flex: 0 0 14.28571%; | |
-ms-flex: 0 0 14.28571%; | |
flex: 0 0 14.28571%; | |
padding: 0 1rem 1rem | |
} | |
.large-8 { | |
-webkit-flex: 0 0 66.66667%; | |
-ms-flex: 0 0 66.66667%; | |
flex: 0 0 66.66667%; | |
max-width: 66.66667% | |
} | |
.large-order-8 { | |
-ms-flex-order: 8; | |
-webkit-order: 8; | |
order: 8 | |
} | |
.large-offset-8 { | |
margin-left: 66.66667% | |
} | |
.large-up-8>div, | |
.large-up-8>li, | |
.large-up-8>section { | |
-webkit-flex: 0 0 12.5%; | |
-ms-flex: 0 0 12.5%; | |
flex: 0 0 12.5%; | |
padding: 0 1rem 1rem | |
} | |
.large-9 { | |
-webkit-flex: 0 0 75%; | |
-ms-flex: 0 0 75%; | |
flex: 0 0 75%; | |
max-width: 75% | |
} | |
.large-order-9 { | |
-ms-flex-order: 9; | |
-webkit-order: 9; | |
order: 9 | |
} | |
.large-offset-9 { | |
margin-left: 75% | |
} | |
.large-up-9>div, | |
.large-up-9>li, | |
.large-up-9>section { | |
-webkit-flex: 0 0 11.11111%; | |
-ms-flex: 0 0 11.11111%; | |
flex: 0 0 11.11111%; | |
padding: 0 1rem 1rem | |
} | |
.large-10 { | |
-webkit-flex: 0 0 83.33333%; | |
-ms-flex: 0 0 83.33333%; | |
flex: 0 0 83.33333%; | |
max-width: 83.33333% | |
} | |
.large-order-10 { | |
-ms-flex-order: 10; | |
-webkit-order: 10; | |
order: 10 | |
} | |
.large-offset-10 { | |
margin-left: 83.33333% | |
} | |
.large-up-10>div, | |
.large-up-10>li, | |
.large-up-10>section { | |
-webkit-flex: 0 0 10%; | |
-ms-flex: 0 0 10%; | |
flex: 0 0 10%; | |
padding: 0 1rem 1rem | |
} | |
.large-11 { | |
-webkit-flex: 0 0 91.66667%; | |
-ms-flex: 0 0 91.66667%; | |
flex: 0 0 91.66667%; | |
max-width: 91.66667% | |
} | |
.large-order-11 { | |
-ms-flex-order: 11; | |
-webkit-order: 11; | |
order: 11 | |
} | |
.large-offset-11 { | |
margin-left: 91.66667% | |
} | |
.large-up-11>div, | |
.large-up-11>li, | |
.large-up-11>section { | |
-webkit-flex: 0 0 9.09091%; | |
-ms-flex: 0 0 9.09091%; | |
flex: 0 0 9.09091%; | |
padding: 0 1rem 1rem | |
} | |
.large-12 { | |
-webkit-flex: 0 0 100%; | |
-ms-flex: 0 0 100%; | |
flex: 0 0 100%; | |
max-width: 100% | |
} | |
.large-order-12 { | |
-ms-flex-order: 12; | |
-webkit-order: 12; | |
order: 12 | |
} | |
.large-offset-12 { | |
margin-left: 100% | |
} | |
.large-up-1, | |
.large-up-10, | |
.large-up-11, | |
.large-up-12, | |
.large-up-2, | |
.large-up-3, | |
.large-up-4, | |
.large-up-5, | |
.large-up-6, | |
.large-up-7, | |
.large-up-8, | |
.large-up-9 { | |
-webkit-flex-flow: row wrap; | |
-ms-flex-flow: row wrap; | |
flex-flow: row wrap; | |
list-style-type: none; | |
overflow: visible | |
} | |
.large-up-12>div, | |
.large-up-12>li, | |
.large-up-12>section { | |
-webkit-flex: 0 0 8.33333%; | |
-ms-flex: 0 0 8.33333%; | |
flex: 0 0 8.33333%; | |
padding: 0 1rem 1rem | |
} | |
.menu-bar.large-condense li { | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto | |
} | |
.menu-bar.large-expand li { | |
-webkit-flex: 1 0 auto; | |
-ms-flex: 1 0 auto; | |
flex: 1 0 auto | |
} | |
.menu-bar.large-align-left { | |
-ms-flex-pack: start; | |
-webkit-justify-content: flex-start; | |
justify-content: flex-start | |
} | |
.menu-bar.large-align-right { | |
-ms-flex-pack: end; | |
-webkit-justify-content: flex-end; | |
justify-content: flex-end | |
} | |
.menu-bar.large-align-center { | |
-ms-flex-pack: center; | |
-webkit-justify-content: center; | |
justify-content: center | |
} | |
.menu-bar.large-align-justify { | |
-ms-flex-pack: justify; | |
-webkit-justify-content: space-between; | |
justify-content: space-between | |
} | |
.menu-bar.large-align-spaced { | |
-ms-flex-pack: distribute; | |
-webkit-justify-content: space-around; | |
justify-content: space-around | |
} | |
.menu-bar.large-horizontal { | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap; | |
overflow-x: hidden | |
} | |
.menu-bar.large-vertical>li>a { | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap | |
} | |
.menu-bar.large-horizontal>li>a, | |
.menu-bar.large-icon-top>li>a, | |
.menu-bar.large-vertical { | |
-webkit-flex-flow: column nowrap; | |
-ms-flex-flow: column nowrap; | |
flex-flow: column nowrap | |
} | |
.menu-bar.large-icon-top>li>a>.iconic, | |
.menu-bar.large-icon-top>li>a>img { | |
margin: 0 0 1rem 0 | |
} | |
.menu-bar.large-icon-right>li>a { | |
-webkit-flex-flow: row-reverse nowrap; | |
-ms-flex-flow: row-reverse nowrap; | |
flex-flow: row-reverse nowrap | |
} | |
.menu-bar.large-icon-right>li>a>.iconic, | |
.menu-bar.large-icon-right>li>a>img { | |
margin: 0 0 0 1rem | |
} | |
.menu-bar.large-icon-bottom>li>a { | |
-webkit-flex-flow: column-reverse nowrap; | |
-ms-flex-flow: column-reverse nowrap; | |
flex-flow: column-reverse nowrap | |
} | |
.menu-bar.large-icon-bottom>li>a>.iconic, | |
.menu-bar.large-icon-bottom>li>a>img { | |
margin: 1rem 0 0 0 | |
} | |
.menu-bar.large-icon-bottom>li>.iconic, | |
.menu-bar.large-icon-bottom>li>img, | |
.menu-bar.large-icon-left>li>.iconic, | |
.menu-bar.large-icon-left>li>img, | |
.menu-bar.large-icon-right>li>.iconic, | |
.menu-bar.large-icon-right>li>img, | |
.menu-bar.large-icon-top>li>.iconic, | |
.menu-bar.large-icon-top>li>img { | |
height: 25px; | |
margin: 0; | |
width: 25px | |
} | |
.menu-bar.large-icon-left>li>a { | |
-webkit-align-items: center; | |
align-items: center; | |
-ms-flex-align: center; | |
-webkit-flex-flow: row nowrap; | |
-ms-flex-flow: row nowrap; | |
flex-flow: row nowrap | |
} | |
.menu-bar.large-icon-left>li>a>.iconic, | |
.menu-bar.large-icon-left>li>a>img { | |
margin: 0 1rem 0 0 | |
} | |
.v-align .large-align-top { | |
-webkit-align-self: flex-start; | |
align-self: flex-start; | |
-ms-flex-item-align: start | |
} | |
.v-align .large-align-center { | |
-webkit-align-self: center; | |
align-self: center; | |
-ms-flex-item-align: center | |
} | |
.v-align .large-align-bottom { | |
-webkit-align-self: flex-end; | |
align-self: flex-end; | |
-ms-flex-item-align: end | |
} | |
.hide-for-large, | |
.hide-for-large[class*="grid-block"] { | |
display: none!important | |
} | |
.show-for-large { | |
display: block!important | |
} | |
.show-for-large[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
.large-text-left { | |
text-align: left | |
} | |
.large-text-right { | |
text-align: right | |
} | |
.large-text-center { | |
text-align: center | |
} | |
.large-text-justify { | |
text-align: justify | |
} | |
} | |
@media only screen and (min-width: 75em) and (max-width: 89.9375rem) { | |
.hide-for-large-only, | |
.hide-for-large-only[class*="grid-block"] { | |
display: none!important | |
} | |
.show-for-large-only { | |
display: block!important | |
} | |
.show-for-large-only[class*="grid-block"] { | |
display: -webkit-flex!important; | |
display: -ms-flexbox!important; | |
display: flex!important | |
} | |
.large-only-text-left { | |
text-align: left | |
} | |
.large-only-text-right { | |
text-align: right | |
} | |
.large-only-text-center { | |
text-align: center | |
} | |
.large-only-text-justify { | |
text-align: justify | |
} | |
} | |
.float-left { | |
float: left | |
} | |
.float-right { | |
float: right | |
} | |
.float-none { | |
float: none | |
} | |
.hljs { | |
background: #f8f8f8; | |
color: #333; | |
display: block; | |
line-height: 1.3; | |
margin-bottom: 1.5rem; | |
overflow-x: auto; | |
padding: 0.75rem; | |
-webkit-text-size-adjust: none | |
} | |
.diff .hljs-header, | |
.hljs-comment, | |
.hljs-javadoc, | |
.hljs-template_comment { | |
color: #998; | |
font-style: italic | |
} | |
.css .rule .hljs-keyword, | |
.hljs-keyword, | |
.hljs-request, | |
.hljs-status, | |
.hljs-subst, | |
.hljs-winutils, | |
.javascript .hljs-title, | |
.nginx .hljs-title { | |
color: #333; | |
font-weight: bold | |
} | |
.hljs-dartdoc, | |
.hljs-phpdoc, | |
.hljs-string, | |
.hljs-tag .hljs-value, | |
.tex .hljs-formula { | |
color: #d14 | |
} | |
.hljs-id, | |
.hljs-title, | |
.scss .hljs-preprocessor { | |
color: #900; | |
font-weight: bold | |
} | |
.hljs-list .hljs-keyword, | |
.hljs-subst, | |
.javascript .hljs-title { | |
font-weight: normal | |
} | |
.hljs-class .hljs-title, | |
.hljs-type, | |
.tex .hljs-command, | |
.vhdl .hljs-literal { | |
color: #458; | |
font-weight: bold | |
} | |
.django .hljs-tag .hljs-keyword, | |
.hljs-rules .hljs-property, | |
.hljs-tag, | |
.hljs-tag .hljs-title { | |
color: #000080; | |
font-weight: normal | |
} | |
.hljs-attribute, | |
.hljs-hexcolor, | |
.hljs-number, | |
.hljs-variable, | |
.lisp .hljs-body, | |
.ruby .hljs-constant { | |
color: #008080 | |
} | |
.hljs-regexp { | |
color: #009926 | |
} | |
.clojure .hljs-keyword, | |
.hljs-prompt, | |
.hljs-symbol, | |
.lisp .hljs-keyword, | |
.ruby .hljs-symbol .hljs-string, | |
.scheme .hljs-keyword, | |
.tex .hljs-special { | |
color: #990073 | |
} | |
.hljs-built_in { | |
color: #0086b3 | |
} | |
.hljs-cdata, | |
.hljs-doctype, | |
.hljs-pi, | |
.hljs-pragma, | |
.hljs-preprocessor, | |
.hljs-shebang { | |
color: #999; | |
font-weight: bold | |
} | |
.hljs-deletion { | |
background: #fdd | |
} | |
.hljs-addition { | |
background: #dfd | |
} | |
.diff .hljs-change { | |
background: #0086b3 | |
} | |
.hljs-chunk { | |
color: #aaa | |
} | |
.global-nav { | |
background: #333; | |
height: 45px; | |
margin-bottom: 0; | |
overflow: hidden | |
} | |
.global-nav ul.title-area { | |
float: left; | |
list-style: none; | |
margin-bottom: 0; | |
position: relative; | |
width: auto | |
} | |
.global-nav ul.title-area li.name img.zurb-logo { | |
height: 16px!important; | |
margin-bottom: -3px; | |
margin-right: 5px; | |
width: 72px!important | |
} | |
.global-nav ul.title-area li.name a { | |
color: #fff; | |
display: inline-block; | |
padding: 10px | |
} | |
.global-nav ul.title-area li.name h1 { | |
display: inline-block; | |
line-height: 18px; | |
margin-top: 0; | |
padding: 0 | |
} | |
@media only screen and (max-width: 769px) { | |
.global-nav ul.title-area li.name a.sidebar-button { | |
display: inline-block!important; | |
z-index: 99 | |
} | |
.global-nav ul.title-area li.name h1 { | |
margin-left: -10px | |
} | |
} | |
.global-nav ul.title-area li.name h1 a { | |
font-family: zurb-logo; | |
font-size: 36px; | |
font-weight: normal; | |
opacity: 1; | |
opacity: .75; | |
padding: 12px 15px 12px 0; | |
text-rendering: auto; | |
transition: all .25s ease-in-out | |
} | |
.global-nav ul.title-area li.name h1 a:hover { | |
opacity: 0.75; | |
opacity: 1 | |
} | |
.global-nav ul.title-area li.name h1 a strong { | |
font-family: helvetica; | |
font-size: 17px; | |
margin-left: -7px | |
} | |
.global-nav ul.right { | |
float: right; | |
margin-bottom: 0; | |
margin-right: none | |
} | |
.global-nav ul.right li { | |
display: block; | |
float: left | |
} | |
.global-nav ul.right li a { | |
background: #333; | |
border-left: 1px solid #4d4d4d; | |
color: #fff; | |
display: block; | |
font-size: 13px; | |
font-weight: bold; | |
line-height: 45px; | |
padding: 0 15px | |
} | |
.global-nav ul.right li a.avatar { | |
line-height: 0 | |
} | |
.global-nav ul.right li a.avatar img { | |
display: block; | |
height: 47px; | |
padding: 5px 0 7px | |
} | |
.global-nav ul.right li a.current, | |
.global-nav ul.right li a.current:hover { | |
background: #484848 | |
} | |
.global-nav ul.right li a:hover { | |
background: #3d3d3d; | |
color: #fff | |
} | |
.global-nav ul.right li a:not(.button) { | |
padding: 0 15px | |
} | |
.docs.container { | |
max-width: 1000px | |
} | |
.comparison-table { | |
border-collapse: separate; | |
display: block; | |
padding: 10px; | |
width: 100% | |
} | |
.comparison-table thead tr { | |
color: #002b36; | |
font-size: 16px; | |
font-size: 1.6rem; | |
font-weight: bold | |
} | |
.comparison-table thead tr td { | |
border: none!important; | |
padding-bottom: 10px | |
} | |
@media (max-width: 767px) { | |
.comparison-table thead tr { | |
font-size: 14px; | |
font-size: 1.4rem; | |
font-weight: normal | |
} | |
} | |
.comparison-table tr { | |
width: 100% | |
} | |
.comparison-table tr td { | |
border-right: 2px solid #ddd | |
} | |
.comparison-table tr:first-child td { | |
border-top: 2px solid #ddd | |
} | |
.comparison-table tr:last-child td { | |
border-bottom: 2px solid #ddd | |
} | |
.comparison-table tr td:first-child { | |
border-left: 2px solid #ddd; | |
color: #002b36; | |
font-weight: bold; | |
padding: 10px; | |
width: 25% | |
} | |
.comparison-table tr td.marker.yes { | |
color: #43ac6a; | |
text-align: center; | |
vertical-align: middle; | |
width: 10% | |
} | |
.comparison-table tr td.marker.no { | |
color: #f04124; | |
text-align: center; | |
vertical-align: middle; | |
width: 10% | |
} | |
.comparison-table tr:nth-child(even) { | |
background: #efefef | |
} | |
@media (max-width: 525px) { | |
.comparison-table td, | |
.comparison-table tr td, | |
.comparison-table tr td.marker, | |
.comparison-table tr td:first-child, | |
.comparison-table tr td:first-child+td { | |
border-bottom: 0; | |
border-left: 2px solid #ddd; | |
border-top: 0; | |
display: block; | |
position: relative; | |
width: 100% | |
} | |
.comparison-table tr:first-child td:last-child { | |
border-top-right-radius: 0 | |
} | |
.comparison-table tr:last-child td:first-child { | |
border-bottom-left-radius: 0 | |
} | |
.comparison-table tr:last-child td:last-child { | |
border-bottom: 2px solid #ddd | |
} | |
.comparison-table tr td:first-child { | |
border-top: 2px solid #ddd | |
} | |
.comparison-table tr td:first-child+td { | |
padding: 0 10px 10px | |
} | |
.comparison-table tr td.marker { | |
font-weight: bold; | |
padding: 10px | |
} | |
.comparison-table tr td.marker:before { | |
content: "Grid: " | |
} | |
.comparison-table tr td.marker+td.marker:before { | |
content: "Layout/UI: " | |
} | |
.comparison-table tr td.marker+td.marker+td.marker:before { | |
content: "JS: " | |
} | |
.comparison-table thead tr td.marker { | |
display: none | |
} | |
} | |
.sidebar { | |
background: #f9f9f9!important; | |
border-right: 1px solid #e7e7e7; | |
padding: 0!important | |
} | |
.sidebar .menu-bar { | |
background: #f9f9f9!important | |
} | |
.sidebar .menu-bar li a { | |
-webkit-align-items: flex-start; | |
align-items: flex-start; | |
color: #00558b; | |
-ms-flex-align: start; | |
font-size: .8rem | |
} | |
.sidebar .menu-bar .title { | |
color: #666; | |
font-size: 0.85rem; | |
font-weight: bold; | |
padding-bottom: 0; | |
padding-top: 1.5rem; | |
text-transform: uppercase | |
} | |
.main-docs-section { | |
padding-top: 1rem | |
} | |
.docs-search-box { | |
border-bottom: 1px solid #e7e7e7; | |
overflow: visible; | |
padding: 1rem | |
} | |
.card ul, | |
.card.alert ul, | |
.card.dark ul, | |
.card.primary ul, | |
.card.success ul, | |
.card.warning ul, | |
.docs-search-box input { | |
margin-bottom: 0 | |
} | |
.docs-search-box .autocomplete input { | |
font-size: 1rem; | |
padding: 0.5rem | |
} | |
.docs-search-box .autocomplete>ul { | |
border: 1px solid #ccc; | |
border-top: 0; | |
box-shadow: 0 4px 5px rgba(0,0,0,0.25); | |
margin-left: 0 | |
} | |
.docs-search-box .autocomplete>ul li.active { | |
background: #00558b; | |
color: white | |
} | |
h3.subheader { | |
font-size: 1.25rem | |
} | |
hr { | |
border: solid #ddd; | |
border-width: 1px 0 0; | |
box-sizing: content-box; | |
clear: both; | |
height: 0; | |
height: 0; | |
margin: 1.25rem 0 1.1875rem; | |
margin: 2.75rem 0 2.5rem 0 | |
} | |
.card.callout { | |
background: #f7f7f7; | |
padding: 1rem | |
} | |
.docs-example-panels { | |
height: 300px; | |
overflow: hidden; | |
position: relative | |
} | |
.badge.docs-example-badges { | |
display: inline-block; | |
margin-right: 1rem; | |
position: relative | |
} | |
.upper-footer { | |
background: #f3f3f3; | |
margin: 2rem -1rem 0 -1rem; | |
padding: 1.875rem 0 | |
} | |
.zurb-footer-top.bg-blue { | |
background: #2daebf | |
} | |
.zurb-footer-top.bg-fblue { | |
background: #13a7c7 | |
} | |
.zurb-footer-top.bg-green { | |
background: #b8d30b | |
} | |
.zurb-footer-top.bg-dgreen { | |
background: #afc908 | |
} | |
.zurb-footer-top.bg-magenta { | |
background: #a9014b | |
} | |
.zurb-footer-top.bg-orange { | |
background: #ff5c00 | |
} | |
.zurb-footer-top.bg-lorange { | |
background: #ff6908 | |
} | |
.zurb-footer-top.bg-oyellow { | |
background: #444 | |
} | |
.zurb-footer-top.bg-loyellow { | |
background: #ffb515 | |
} | |
.zurb-footer-top { | |
background: #435159; | |
color: white; | |
margin: 0 -1rem; | |
margin-top: 3rem; | |
overflow: hidden; | |
padding: 40px 10px | |
} | |
.clearfix:after, | |
.clearfix:before, | |
.zurb-footer-top .row .columns:after, | |
.zurb-footer-top .row .columns:before { | |
content: " "; | |
display: table | |
} | |
.clearfix:after, | |
.zurb-footer-top .row .columns:after { | |
clear: both | |
} | |
.zurb-footer-top.zurb { | |
background-position: 10px 7px | |
} | |
.small-text-center, | |
.text-center, | |
.zurb-footer-top .property { | |
text-align: center | |
} | |
.zurb-footer-top .property .property-info { | |
padding-top: 20px | |
} | |
.zurb-footer-top .property h2 { | |
margin: 0; | |
padding: 0!important | |
} | |
.zurb-footer-top .property h2 a { | |
filter: alpha(opacity = 100); | |
font-family: zurb-logo; | |
font-size: emCalc(18px); | |
font-weight: normal; | |
opacity: 1; | |
padding: 0; | |
transition: all .25s ease-in-out | |
} | |
.zurb-footer-top .property h2 a:hover { | |
filter: alpha(opacity = 80); | |
opacity: 0.8 | |
} | |
.zurb-footer-top .property h2 a.services { | |
width: 190px | |
} | |
.action-sheet.dark::before, | |
.action-sheet.primary::before, | |
.global-nav ul.title-area li.name h1 a span, | |
.tab-contents .tab-content, | |
.zurb-footer-top .property h2 a span, | |
[hidden], | |
template { | |
display: none | |
} | |
.zurb-footer-top .property h2 a strong { | |
font-size: 17px; | |
margin-left: -7px | |
} | |
.zurb-footer-top .property h3 { | |
color: white; | |
font-size: 24px; | |
font-weight: 600; | |
margin-bottom: 10px | |
} | |
.zurb-footer-top .property h3 a { | |
font-size: 1em | |
} | |
.zurb-footer-top .property h4 { | |
color: white; | |
font-size: 20px; | |
margin-bottom: 10px | |
} | |
.zurb-footer-top .property a, | |
.zurb-footer-top .property li, | |
.zurb-footer-top .property p { | |
color: white; | |
font-size: 14px; | |
line-height: 21px | |
} | |
.zurb-footer-top .property a { | |
color: white; | |
font-weight: 600 | |
} | |
.zurb-footer-top .property .connect-links, | |
.zurb-footer-top .property .learn-links, | |
.zurb-footer-top .property .support-links { | |
background: url(../img/footer-top-icons.png) no-repeat center 0; | |
border-left: 1px solid rgba(255,255,255,0.2); | |
height: 220px; | |
margin-bottom: 30px; | |
padding: 50px 0 0 0 | |
} | |
.zurb-footer-top .property .connect-links ul, | |
.zurb-footer-top .property .learn-links ul, | |
.zurb-footer-top .property .support-links ul { | |
list-style: none; | |
margin-left: 0 | |
} | |
.zurb-footer-top .property .connect-links ul li, | |
.zurb-footer-top .property .learn-links ul li, | |
.zurb-footer-top .property .support-links ul li { | |
line-height: 20px | |
} | |
.zurb-footer-top .property .learn-links { | |
background-position: center -325px | |
} | |
.zurb-footer-top .property .support-links { | |
background-position: center -635px | |
} | |
.zurb-footer-top .property .connect-links { | |
background-position: center -9px; | |
padding: 50px 20px 0 | |
} | |
.zurb-footer-top .property .connect-links .button { | |
background: rgba(0,0,0,0.1); | |
border: 0; | |
box-shadow: none; | |
-webkit-box-shadow: none; | |
-moz-box-shadow: none; | |
color: #fff!important; | |
font-size: 12px; | |
font-weight: normal; | |
font-weight: 600; | |
padding: 6px 16px; | |
text-shadow: none | |
} | |
.zurb-footer-top .global { | |
border-top: 1px solid rgba(255,255,255,0.2) | |
} | |
.zurb-footer-top .global .footer-link-block { | |
display: block; | |
font-weight: normal; | |
margin: 30px 0 0 0 | |
} | |
.zurb-footer-top .global .footer-link-block.services { | |
background: url(../img/footer-studios.png) left top no-repeat | |
} | |
.zurb-footer-top .global .footer-link-block.foundation { | |
background: url(../img/footer-foundation.png) left top no-repeat | |
} | |
.zurb-footer-top .global .footer-link-block.apps { | |
background: url(../img/footer-products.png) left top no-repeat | |
} | |
.zurb-footer-top .global .footer-link-block.expo { | |
background: url(../img/footer-expo.png) left top no-repeat | |
} | |
.zurb-footer-top .global .footer-link-block span { | |
color: white; | |
display: block; | |
font-size: 12px; | |
line-height: 18px; | |
padding-left: 40px | |
} | |
.zurb-footer-top .global .footer-link-block span.title { | |
font-size: 18px; | |
font-weight: 300; | |
margin-bottom: 5px | |
} | |
.zurb-footer-bottom { | |
background: #333; | |
margin: 0 -1rem -1rem -1rem; | |
overflow: hidden; | |
padding: 24px 10px | |
} | |
.zurb-footer-bottom .design-border { | |
border-bottom: 1px solid #484848; | |
margin-bottom: 25px; | |
padding-bottom: 5px | |
} | |
.zurb-footer-bottom a.zurb-logo { | |
background: url(../img/footer-icons.png) no-repeat 0 3px; | |
color: #858585; | |
display: inline-block; | |
font-size: 16px; | |
font-weight: normal; | |
padding: 25px 0 0 0; | |
width: 90px | |
} | |
.zurb-footer-bottom ul.zurb-links { | |
display: inline-block; | |
margin: 0 | |
} | |
.zurb-footer-bottom ul.zurb-links li { | |
display: block; | |
float: left; | |
font-family: Proxima Nova Condensed,proxima-nova-condensed,Helvetica Neue,Helvetica,Arial,sans-serif; | |
font-size: 14px; | |
font-weight: 700; | |
margin-left: 6px; | |
text-transform: uppercase | |
} | |
.zurb-footer-bottom ul.zurb-links li a { | |
color: #666; | |
padding: 3px 6px | |
} | |
.zurb-footer-bottom ul.zurb-links li a:hover { | |
color: #777 | |
} | |
.zurb-footer-bottom p.copyright { | |
color: #666; | |
font-size: 13px; | |
margin: 6px 0 0 | |
} | |
.zurb-footer-bottom ul.home-social { | |
display: block; | |
float: right; | |
margin-bottom: 8px | |
} | |
.zurb-footer-bottom ul.home-social li { | |
display: block; | |
float: left; | |
list-style: none; | |
margin-left: 10px | |
} | |
.block-list ul, | |
.zurb-footer-bottom ul.home-social li:first-child, | |
ul.no-bullet { | |
margin-left: 0 | |
} | |
.zurb-footer-bottom ul.home-social li a { | |
background: url(../img/social.png) no-repeat center 0; | |
display: block; | |
height: 50px; | |
width: 50px | |
} | |
.zurb-footer-bottom a.zurb-logo:hover, | |
.zurb-footer-bottom ul.home-social li a:hover, | |
.zurb-footer-top .property a:hover { | |
opacity: 0.8 | |
} | |
.zurb-footer-bottom ul.home-social li a.twitter { | |
background-position: center 0 | |
} | |
.zurb-footer-bottom ul.home-social li a.facebook { | |
background-position: center -200px | |
} | |
.zurb-footer-bottom ul.home-social li a.mail { | |
background-position: center -400px | |
} | |
@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) { | |
.zurb-footer-top .property { | |
padding-top: 0 | |
} | |
.zurb-footer-top .property .connect-links, | |
.zurb-footer-top .property .learn-links, | |
.zurb-footer-top .property .support-links { | |
height: 240px; | |
padding: 50px 10px 0 | |
} | |
} | |
.support-links p { | |
margin-left: 8px; | |
margin-right: 8px | |
} | |
@media only screen and (max-width: 767px) { | |
.learn-links h4 { | |
display: none | |
} | |
.zurb-footer-top .property .property-info { | |
padding-top: 0 | |
} | |
.zurb-footer-top .property .connect-links, | |
.zurb-footer-top .property .learn-links, | |
.zurb-footer-top .property .support-links { | |
border: 0; | |
border-top: 1px dotted rgba(255,255,255,0.2); | |
height: auto; | |
margin: 4px 0 0 0; | |
padding: 80px 20px 0 | |
} | |
.zurb-footer-top .property .connect-links li a, | |
.zurb-footer-top .property .learn-links li a, | |
.zurb-footer-top .property .support-links li a { | |
font-size: 15px; | |
line-height: 2 | |
} | |
.zurb-footer-top .property .connect-links a, | |
.zurb-footer-top .property .connect-links p, | |
.zurb-footer-top .property .learn-links a, | |
.zurb-footer-top .property .learn-links p, | |
.zurb-footer-top .property .support-links a, | |
.zurb-footer-top .property .support-links p { | |
font-size: 16px | |
} | |
.zurb-footer-top .property .learn-links { | |
background: 0; | |
border: 0; | |
margin: 0; | |
padding-top: 0 | |
} | |
.zurb-footer-top .property .support-links { | |
background-position: center -618px; | |
padding: 76px 20px 0 | |
} | |
.zurb-footer-top .global { | |
border: 0 | |
} | |
.zurb-footer-top .footer-link-block span { | |
font-size: 11px; | |
line-height: 16px | |
} | |
.zurb-footer-top .footer-link-block.services { | |
background-position: 0 -158px!important; | |
border-top: 1px dotted rgba(255,255,255,0.2); | |
margin-top: 0; | |
padding-top: 40px | |
} | |
.zurb-footer-bottom { | |
text-align: center | |
} | |
.zurb-footer-bottom .columns { | |
padding: 0 | |
} | |
.zurb-footer-bottom a.zurb-logo { | |
display: block; | |
margin: 0 auto | |
} | |
.zurb-footer-bottom ul.zurb-links { | |
margin: 16px 0 10px | |
} | |
.zurb-footer-bottom ul.home-social { | |
display: inline-block; | |
float: none; | |
height: 44px; | |
margin: 0 0 20px 0; | |
text-align: center | |
} | |
.zurb-footer-top .property .connect-links { | |
background-position: center 10px; | |
border-bottom: 1px dotted rgba(255,255,255,0.2); | |
margin-bottom: 20px; | |
padding: 76px 20px 14px | |
} | |
.zurb-footer-top .global .footer-link-block { | |
clear: both; | |
margin: 0!important; | |
padding-top: 50px; | |
text-align: center | |
} | |
.zurb-footer-top .global .footer-link-block span { | |
padding-left: 0 | |
} | |
.zurb-footer-top .global .footer-link-block.services { | |
background-position: center 15px!important; | |
border-top: 0 | |
} | |
.zurb-footer-top .global .footer-link-block.foundation { | |
background-position: center 15px!important | |
} | |
.zurb-footer-top .global .footer-link-block.apps, | |
.zurb-footer-top .global .footer-link-block.expo { | |
background-position: center 45px!important; | |
padding-top: 80px | |
} | |
} | |
@media only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) { | |
.zurb-footer-top .info-padding { | |
background-image: url(../img/footer-large-icon-retina.png); | |
background-size: 100px 400px | |
} | |
.zurb-footer-bottom ul.home-social li a { | |
background-image: url(../img/social-retina.png); | |
background-size: 50px 600px | |
} | |
.zurb-footer-top .global .footer-link-block { | |
display: block; | |
font-weight: normal; | |
margin: 30px 0 0 0 | |
} | |
.zurb-footer-top .global .footer-link-block.services { | |
background: url(../img/footer-studios-retina.png) left top no-repeat | |
} | |
.zurb-footer-top .global .footer-link-block.foundation { | |
background: url(../img/footer-foundation-retina.png) left top no-repeat | |
} | |
.zurb-footer-top .global .footer-link-block.apps { | |
background: url(../img/footer-products-retina.png) left top no-repeat | |
} | |
.zurb-footer-top .global .footer-link-block.expo { | |
background: url(../img/footer-expo-retina.png) left top no-repeat | |
} | |
.zurb-footer-bottom a.zurb-logo { | |
background-image: url(../../img/footer-icons-retina.png); | |
background-size: 100px 1400px | |
} | |
.zurb-footer-top .property .connect-links, | |
.zurb-footer-top .property .learn-links, | |
.zurb-footer-top .property .support-links { | |
background-image: url(../img/footer-top-icons-retina.png); | |
background-size: 100px 1400px | |
} | |
} | |
@media only screen and (max-width: 320px), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) { | |
.zurb-footer-top .info-padding { | |
background-image: url(../img/footer-large-icon-retina.png); | |
background-size: 100px 400px | |
} | |
.zurb-footer-bottom ul.home-social li a { | |
background-image: url(../img/social-retina.png); | |
background-size: 50px 600px | |
} | |
.zurb-footer-top .global .footer-link-block { | |
display: block; | |
font-weight: normal; | |
margin: 30px 0 0 0 | |
} | |
.zurb-footer-top .global .footer-link-block.services { | |
background: url(../img/footer-studios-retina.png) left top no-repeat; | |
background-size: 30px | |
} | |
.zurb-footer-top .global .footer-link-block.foundation { | |
background: url(../img/footer-foundation-retina.png) left top no-repeat; | |
background-size: 30px | |
} | |
.zurb-footer-top .global .footer-link-block.apps { | |
background: url(../img/footer-products-retina.png) left top no-repeat; | |
background-size: 30px | |
} | |
.zurb-footer-top .global .footer-link-block.expo { | |
background: url(../img/footer-expo-retina.png) left top no-repeat; | |
background-size: 30px | |
} | |
.zurb-footer-bottom a.zurb-logo { | |
background-image: url(../img/footer-icons-retina.png); | |
background-size: 100px 1400px | |
} | |
.zurb-footer-top .property .connect-links, | |
.zurb-footer-top .property .support-links { | |
background-image: url(../img/footer-top-icons-retina.png); | |
background-size: 100px 1400px | |
} | |
} | |
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { | |
.zurb-footer-top .property .learn-links { | |
background: 0 | |
} | |
} | |
.docs-example-panel { | |
-webkit-align-items: center; | |
align-items: center; | |
color: #666; | |
-ms-flex-align: center; | |
-ms-flex-pack: center; | |
-webkit-justify-content: center; | |
justify-content: center; | |
padding: 1rem; | |
text-align: center | |
} | |
.docs-example-panel p { | |
font-size: 1.5rem | |
} | |
.docs-grid-demo { | |
height: 100px; | |
margin: 0 0 1.5rem 0!important | |
} | |
.docs-grid-demo, | |
.docs-grid-demo .grid-block, | |
.docs-grid-demo .grid-container, | |
.docs-grid-demo .grid-content { | |
background: rgba(0,85,139,0.1); | |
color: white; | |
font-weight: bold; | |
margin: 1rem; | |
padding: 0; | |
text-align: center | |
} | |
.docs-grid-demo .shrink { | |
width: 100px | |
} | |
.docs-grid-demo.small-up-3, | |
input[type="number"]::-webkit-inner-spin-button, | |
input[type="number"]::-webkit-outer-spin-button { | |
height: auto | |
} | |
.docs-grid-demo.small-up-3 .grid-block { | |
background: transparent; | |
height: 70px; | |
margin: 0; | |
position: relative | |
} | |
.docs-grid-demo.small-up-3 .grid-block::after { | |
background: rgba(0,85,139,0.1); | |
bottom: 1rem; | |
content: ''; | |
display: block; | |
left: 1rem; | |
position: absolute; | |
right: 1rem; | |
top: 1rem | |
} | |
.docs-grid-demo.vertical .grid-block { | |
height: 50px | |
} | |
.docs-grid-demo.vertical .grid-block:first-child { | |
margin-bottom: 0.5rem | |
} | |
.docs-grid-demo .grid-container { | |
height: 100px; | |
margin: 0 auto -1rem auto; | |
max-width: 400px | |
} | |
.docs-grid-demo .small-offset-2 { | |
margin-left: 16.66667%!important | |
} | |
.docs-grid-demo .text { | |
-webkit-align-items: center; | |
align-items: center; | |
-ms-flex-align: center; | |
-ms-flex-pack: center; | |
font-size: 2rem; | |
-webkit-justify-content: center; | |
justify-content: center | |
} | |
.inline-list { | |
display: inline-block; | |
list-style-type: none; | |
text-align: left | |
} | |
.icon-label { | |
margin-left: 1rem | |
} | |
.icon li { | |
margin-bottom: 1rem | |
} | |
.band { | |
background: #eee | |
} | |
nav { | |
background: #708090; | |
color: #f1f1f1 | |
} | |
h6, | |
nav h1 { | |
font-size: 1rem | |
} | |
.img-bucket { | |
background: #f1f1f1 | |
} | |
.slide-panel { | |
bottom: 0; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
height: 200px; | |
position: absolute; | |
width: 100%; | |
z-index: 100 | |
} | |
.button [class*="fi-"] { | |
position: relative; | |
top: 2px | |
} | |
#img-1 { | |
z-index: 1 | |
} | |
.position-absolute .ui-animation { | |
position: absolute | |
} | |
.hide, | |
.position-absolute .ui-animation [zf-offcanvas], | |
.position-absolute .ui-animation [zf-panel], | |
.show-for-large, | |
.show-for-large-only, | |
.show-for-large-only[class*="grid-block"], | |
.show-for-large[class*="grid-block"], | |
.show-for-medium, | |
.show-for-medium-only, | |
.show-for-medium-only[class*="grid-block"], | |
.show-for-medium[class*="grid-block"], | |
.show-for-small-only, | |
.show-for-small-only[class*="grid-block"] { | |
display: none!important | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment