You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1191 lines
20 KiB
Stylus
1191 lines
20 KiB
Stylus
/* Reset
|
|
----------------------------------- */
|
|
@import url("normalize.css")
|
|
|
|
|
|
/* Fonts
|
|
----------------------------------- */
|
|
$font = 'MontserratRegular'
|
|
$fontBold = 'MontserratBold'
|
|
$stack = $font, Helvetica, Arial, sans-serif
|
|
$stackBold = $fontBold, Helvetica, Arial, sans-serif
|
|
|
|
@font-face
|
|
font-family $font
|
|
src url('./montserrat-regular.eot')
|
|
src url('./montserrat-regular.eot?#iefix') format('embedded-opentype'),
|
|
url('./montserrat-regular.woff') format('woff'),
|
|
url('./montserrat-regular.ttf') format('truetype'),
|
|
url('./montserrat-regular.svg#' + $font + '') format('svg')
|
|
font-style normal
|
|
font-weight normal
|
|
|
|
@font-face
|
|
font-family $fontBold
|
|
src url('./montserrat-bold.eot')
|
|
src url('./montserrat-bold.eot?#iefix') format('embedded-opentype'),
|
|
url('./montserrat-bold.woff') format('woff'),
|
|
url('./montserrat-bold.ttf') format('truetype'),
|
|
url('./montserrat-bold.svg#' + $fontBold + '') format('svg')
|
|
font-style normal
|
|
font-weight bold
|
|
|
|
|
|
/* Demo
|
|
----------------------------------- */
|
|
html
|
|
body
|
|
height 100%
|
|
|
|
body
|
|
font 14px/20px $stack
|
|
color #222
|
|
background #ebe7df url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAFZCAIAAAA96mnzAAACKklEQVR4Xn2VUW7kMAxD+QLf/1x7gv71LNwdKTLhZFtggMCwSVEUPdb3159/v0uSrM8HtGRZuoQk1R69J12o9ixJWvSnVyfLdbNw0XAXWe1fIL8BoqmNGiV/cHc9Gq4NXxLKHhteRyLpA28cl0SLdx0BckSWL4gkPlIVTg1nN9Ys3iyWI5AGDA5xOXB5BJaWmOw6KSLeU6+0P50QshQyEL2im/YMIL60dTSZ3RXenlkiJpMj8XPMAl1FtjMRW19NxzOE5VGWPVGrc7aSJgz1Y9ku57mpYSwn1h0ivFOXxoCKMCXiahbbZNIZR+tkphllPsomipCwb4GMkXTmPfVg40Jt2y4RQM/PqX5JTM4iiTN8Zz1XvbIAEEvoEW+3nxTLL3lB7t7J3WwyI7g5OVxKIeFEH4FIGLC9I+XqvSd4AxJM5O6WTPr54RAxLG44FVrEuz+kFdXyLiuX6kLPVLZL2ISlcHNlBIKm5rR8nEi9wJeA6Y8JZlJOyDiin0K5ag+AXHtALBicXasjIUu9h0STBbCMU+89gMnu/J05MU1QWqdbPMRPIZIzDgsi8Olg5t7wHhUg/pv5RUzO+BHDmczHkAfZWxlSYgNI5Ig5XRoc66dW9L45eHDkbkqCO7RLG5cna/HD7YhZnfINkFo8iNyj5kx6pFrxNGRlfhV2e1Zt5DnGU8T7Tud1ivi8jU8/3Zy88pkn6+zdXiJ7AVSFBZA3VcwDfXtt5UUHS38B35hQVuJip4MAAAAASUVORK5CYII=") repeat-x
|
|
*background-image url(ie/header-line.png)
|
|
|
|
a
|
|
color #222
|
|
text-decoration none
|
|
border-bottom 1px solid #bbb
|
|
|
|
&:hover
|
|
color #000
|
|
|
|
a
|
|
.self
|
|
-webkit-transition color .1s
|
|
-moz-transition color .1s
|
|
-ms-transition color .1s
|
|
-o-transition color .1s
|
|
transition color .1s
|
|
|
|
.self
|
|
color #333
|
|
border-bottom 1px dotted #aaa
|
|
cursor pointer
|
|
|
|
&:hover
|
|
color #000
|
|
|
|
strong
|
|
font-family $stackBold
|
|
font-weight 700
|
|
|
|
p
|
|
margin 0 0 8px
|
|
|
|
label
|
|
cursor pointer
|
|
|
|
h1
|
|
h2
|
|
h3
|
|
h4
|
|
margin 0
|
|
font bold 20px/60px $stackBold
|
|
|
|
h2
|
|
height 60px
|
|
text-align center
|
|
text-transform uppercase
|
|
|
|
h4
|
|
font-size 18px
|
|
line-height 24px
|
|
|
|
ul
|
|
margin 0
|
|
padding 0
|
|
list-style none
|
|
|
|
table
|
|
width 100%
|
|
margin-bottom 21px
|
|
|
|
th
|
|
td
|
|
padding 11px 20px 12px
|
|
vertical-align top
|
|
font-weight normal
|
|
text-align left
|
|
border-bottom 2px solid #E7E5E0
|
|
|
|
thead &
|
|
background lighten(#E7E5E0, 50%)
|
|
|
|
th
|
|
white-space nowrap
|
|
|
|
td
|
|
width 100%
|
|
|
|
.focus
|
|
outline 1px dotted rgba(0,0,0,.5) !important
|
|
|
|
.clear
|
|
position relative
|
|
*zoom 1
|
|
|
|
&:before
|
|
&:after
|
|
content ''
|
|
display table
|
|
clear both
|
|
|
|
.layout
|
|
width 930px
|
|
margin 0 auto
|
|
padding 0 15px
|
|
|
|
.header
|
|
padding 115px 0 73px
|
|
color #fff
|
|
text-align center
|
|
|
|
h1
|
|
strong
|
|
letter-spacing -1px
|
|
text-transform uppercase
|
|
|
|
h1
|
|
padding-bottom 23px
|
|
font-size 22px
|
|
line-height 28px
|
|
|
|
h3
|
|
position relative
|
|
padding 35px 0 17px
|
|
font-size 120px
|
|
line-height 140px
|
|
letter-spacing -5px
|
|
|
|
&:before
|
|
content ''
|
|
display inline-block
|
|
width 72px
|
|
height 64px
|
|
margin-right 32px
|
|
vertical-align middle
|
|
background url(icheck.png)
|
|
|
|
&:after
|
|
content ''
|
|
position absolute
|
|
top 0
|
|
left 50%
|
|
width 100px
|
|
margin-left -50px
|
|
border-top 3px solid #fff
|
|
|
|
strong
|
|
font 24px/30px $stack
|
|
|
|
a
|
|
color #fff
|
|
border-bottom-color #fff
|
|
|
|
.features
|
|
position relative
|
|
font-size 16px
|
|
color #555
|
|
background #fff
|
|
|
|
.self
|
|
color #555
|
|
border-bottom-color #bbb
|
|
|
|
&:hover
|
|
color #222
|
|
|
|
.arrows
|
|
top 0
|
|
|
|
&:hover .arrows .bottom
|
|
left 0
|
|
|
|
h2
|
|
color #fff
|
|
background #2489c5
|
|
|
|
ul
|
|
padding 44px 60px 36px
|
|
|
|
li
|
|
padding 0 0 9px 36px
|
|
background url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABI0lEQVR4XpXSP0vDUBjF4ZtLkIr4EYzduogdXJTWWV2FLMVNoQrdAhlUUFAEcejo1q13svgFBAUdxA/g30kcdQoIIlL9DWcKuZEeeOCl99w3gTSI49h4MoFb/KCJz6KShS/rOh/TbEZZECLBiSQIR1nQQgAnAVr/LZjEnIq76OJbutjRGR26isUB3pDhBikucWoUzVdI1cl05zBk2MI5jvCKIfL5QluzxTS20bY6WENdl0ujTl13Ni3DABtwWEFp1HG6M7Aq9NHBGRbgy7w6HfTzX6GHCyyXPV2dnu9/MIUX+PIMOkRsbq7hHkZmxciDOrZoQRUVPCGCw504RDobR7VoQQ0f2Mejls1IRb/t4R10CcLc6/2igSVcw8gqFnEMOnSVPxQqQaPw2y7fAAAAAElFTkSuQmCC") 0 1px no-repeat
|
|
*background-image url(ie/icon-star.png)
|
|
|
|
&.offset
|
|
margin-top 20px
|
|
|
|
.mark
|
|
padding 0 2px
|
|
color lighten(#555, 20%)
|
|
background lighten(#d7d4cc, 40%)
|
|
|
|
.skin-polaris &
|
|
background darken(#2C323C, 20%)
|
|
|
|
.skin-futurico &
|
|
background darken(#2E3035, 20%)
|
|
|
|
.social
|
|
height 60px
|
|
margin-bottom 60px
|
|
padding 0 60px
|
|
font-size 16px
|
|
color #555
|
|
background lighten(#EBE7DF, 50%)
|
|
|
|
a
|
|
color #777
|
|
border-bottom-color #ccc
|
|
|
|
&:hover
|
|
color #444
|
|
|
|
.left
|
|
float left
|
|
padding-top 19px
|
|
|
|
li
|
|
float left
|
|
padding-right 30px
|
|
|
|
a
|
|
position relative
|
|
|
|
.right
|
|
float right
|
|
padding-top 20px
|
|
|
|
li
|
|
float right
|
|
padding-left 10px
|
|
|
|
&.local
|
|
padding-top 19px
|
|
|
|
li
|
|
padding-left 30px
|
|
font-size 14px
|
|
|
|
.demo-holder
|
|
margin-bottom 97px
|
|
|
|
.demo-title
|
|
padding-bottom 36px
|
|
font-size 26px
|
|
letter-spacing -1px
|
|
|
|
.demo
|
|
position relative
|
|
|
|
&:hover .arrows .top
|
|
&:hover .arrows .bottom
|
|
left 0
|
|
|
|
.demo-list
|
|
position relative
|
|
margin-right 360px
|
|
padding 33px 57px 17px
|
|
color #555
|
|
background #fff
|
|
border 3px solid #ddd8ce
|
|
|
|
ul
|
|
float right
|
|
white-space nowrap
|
|
|
|
&:first-child
|
|
float left
|
|
|
|
li
|
|
position relative
|
|
padding 0 0 18px 42px
|
|
|
|
input
|
|
position absolute
|
|
top 4px
|
|
left 0
|
|
|
|
.icheckbox_square-blue
|
|
.iradio_square-blue
|
|
position absolute
|
|
top -1px
|
|
left 0
|
|
|
|
span
|
|
color #bbb
|
|
|
|
.demo-methods
|
|
padding 21px 360px 0 0
|
|
|
|
.mark
|
|
background darken(#e7e5e0, 10%)
|
|
|
|
dt
|
|
position relative
|
|
padding 17px 150px 18px 0
|
|
font 16px/24px $stack
|
|
color #444
|
|
border-bottom 3px solid #ddd8ce
|
|
|
|
.self
|
|
cursor pointer
|
|
|
|
&:hover
|
|
color #222
|
|
|
|
.code
|
|
position absolute
|
|
right 0
|
|
bottom 18px
|
|
color #777
|
|
|
|
.self:hover
|
|
color #444
|
|
|
|
dd
|
|
position relative
|
|
display none
|
|
margin 0
|
|
background #fff
|
|
border 3px solid #ddd8ce
|
|
border-top none
|
|
|
|
&:before
|
|
content ''
|
|
position absolute
|
|
top -13px
|
|
left 0
|
|
width 0
|
|
height 0
|
|
border 5px solid transparent
|
|
border-bottom-color #ddd8ce
|
|
border-left-color #ddd8ce
|
|
|
|
.markup
|
|
margin 0
|
|
color #888
|
|
background lighten(#ebe7df, 50%)
|
|
border none
|
|
|
|
.comment
|
|
color #aaa
|
|
|
|
.demo-callbacks
|
|
position absolute
|
|
top 0
|
|
right 0
|
|
bottom 0
|
|
width 300px
|
|
color #aaa
|
|
background #232323
|
|
border 3px solid #ddd8ce
|
|
|
|
h2
|
|
color #fff
|
|
background #6a5a8c
|
|
|
|
ul
|
|
position absolute
|
|
top 60px
|
|
width 100%
|
|
bottom 0
|
|
overflow auto
|
|
|
|
li
|
|
margin-top -1px
|
|
padding 13px 20px 15px
|
|
border-top 1px solid #2e2e2e
|
|
|
|
span
|
|
color #888
|
|
|
|
.skins
|
|
position relative
|
|
*zoom 1
|
|
|
|
h2
|
|
position absolute
|
|
top -38px
|
|
right 0
|
|
left 0
|
|
font-size 24px
|
|
text-align center
|
|
|
|
.arrows
|
|
position absolute
|
|
top 3px
|
|
left -60px
|
|
width 60px
|
|
overflow hidden
|
|
|
|
.top
|
|
.bottom
|
|
position relative
|
|
left 60px
|
|
width 60px
|
|
height 60px
|
|
cursor pointer
|
|
-webkit-transition left .3s, background-color .2s
|
|
-moz-transition left .3s, background-color .2s
|
|
-ms-transition left .3s, background-color .2s
|
|
-o-transition left .3s, background-color .2s
|
|
transition left .3s, background-color .2s
|
|
|
|
.top
|
|
background lighten(#5a9aa8, 25%) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAALCAYAAACZIGYHAAAAdklEQVR4Xo3MuwmFQBiE0b0FmAuutnRBsAARLMTYRzvWItiEYLq/s6CYyMwGXzTDcWbG8mhEf/ZjQIV2ZCigjiASMAVJIAVKAQ4FKWBDJVoYpAB/7z8GRaAQgBNQG8dZA28f0BmHBgUCKGh9hhpNKH8BWY8GlF2OH3hCC1zmdAAAAABJRU5ErkJggg==") 50% no-repeat
|
|
*background-image url(ie/arrow-top.png)
|
|
|
|
&:hover
|
|
background-color lighten(#5a9aa8, 10%)
|
|
|
|
.bottom
|
|
background lighten(#dba571, 20%) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAALCAYAAACZIGYHAAAAf0lEQVR4Xo3MzQmEQBCE0TGAvQuOpiQIBiCCgXj2J52NRTAJwev0Vh+WOgjlNHyHguYFM/M6tKLSd2YTmtHHR48S8jtQzAB2430d2bgJvQLsdqRCZwZUPAFLaPjrjYAUMKLgwBtUK4CIhi4BEFGQBohISANEJKQBIqqIFtSqvx/0bXhCCUrgiAAAAABJRU5ErkJggg==") 50% no-repeat
|
|
*background-image url(ie/arrow-bottom.png)
|
|
|
|
&:hover
|
|
background-color #dba571
|
|
|
|
@media screen and (max-width:1049px)
|
|
.arrows
|
|
.fork-me
|
|
display none
|
|
|
|
.skin
|
|
position relative
|
|
margin-bottom 40px
|
|
|
|
&:hover .arrows .top
|
|
&:hover .arrows .bottom
|
|
left 0
|
|
|
|
h3
|
|
position relative
|
|
z-index 20
|
|
float left
|
|
height 60px
|
|
padding 0 57px
|
|
line-height 58px
|
|
background #fff
|
|
border 3px solid #ddd8ce
|
|
border-bottom none
|
|
|
|
&:before
|
|
content ''
|
|
position absolute
|
|
top 100%
|
|
left 0
|
|
width 100%
|
|
height 2px
|
|
margin-top -1px
|
|
background #fff
|
|
|
|
&.skin-polaris h3
|
|
color lighten(#7a828b, 60%)
|
|
background #2c323c
|
|
|
|
&:before
|
|
background #2c323c
|
|
|
|
&.skin-futurico h3
|
|
color lighten(#888, 50%)
|
|
background #2e3035
|
|
|
|
&:before
|
|
background #2e3035
|
|
|
|
dl
|
|
z-index 10
|
|
width 100%
|
|
margin 0
|
|
|
|
dt
|
|
position relative
|
|
top -53px
|
|
right -3px
|
|
float right
|
|
height 47px
|
|
margin-right -3px
|
|
padding 0 57px
|
|
line-height 47px
|
|
border 3px solid #ddd8ce
|
|
cursor pointer
|
|
|
|
&:hover
|
|
background #f0ede7
|
|
border-bottom 3px solid #ddd8ce
|
|
|
|
&.selected
|
|
height 50px
|
|
background #fff
|
|
border-bottom none
|
|
cursor default
|
|
|
|
&:before
|
|
content ''
|
|
position absolute
|
|
top 100%
|
|
left 0
|
|
width 100%
|
|
height 2px
|
|
margin-top -1px
|
|
background #fff
|
|
|
|
&.skin-polaris dt
|
|
color lighten(#7a828b, 60%)
|
|
background lighten(#30363f, 30%)
|
|
|
|
&:hover
|
|
background lighten(#30363f, 15%)
|
|
|
|
&.selected
|
|
background #2c323c
|
|
|
|
&:before
|
|
background #2c323c
|
|
|
|
&.skin-futurico dt
|
|
color lighten(#888, 50%)
|
|
background lighten(#2e3035, 30%)
|
|
|
|
&:hover
|
|
background lighten(#2e3035, 15%)
|
|
|
|
&.selected
|
|
background #2e3035
|
|
|
|
&:before
|
|
background #2e3035
|
|
|
|
dd
|
|
position relative
|
|
display none
|
|
float left
|
|
width 100%
|
|
margin -3px -100% 0 0
|
|
overflow hidden
|
|
color #444
|
|
background #fff
|
|
border 3px solid #ddd8ce
|
|
|
|
&.selected
|
|
display block
|
|
|
|
a
|
|
color #444
|
|
|
|
&:hover
|
|
color #111
|
|
|
|
&.skin-polaris dd
|
|
color #7a828b
|
|
background #2c323c
|
|
|
|
a
|
|
color #7a828b
|
|
border-bottom-color lighten(#2c323c, 20%)
|
|
|
|
&:hover
|
|
color lighten(#7a828b, 30%)
|
|
|
|
&.skin-futurico dd
|
|
color #888
|
|
background #2e3035
|
|
|
|
a
|
|
color #888
|
|
border-bottom-color lighten(#2e3035, 20%)
|
|
|
|
&:hover
|
|
color #aaa
|
|
|
|
.skin-section
|
|
float left
|
|
padding 42px 0 31px 57px
|
|
line-height 18px
|
|
|
|
h4
|
|
padding-bottom 18px
|
|
|
|
.skin-polaris &
|
|
color lighten(#7a828b, 20%)
|
|
|
|
.skin-futurico &
|
|
color lighten(#888, 20%)
|
|
|
|
.list
|
|
float left
|
|
padding-right 60px
|
|
|
|
li
|
|
position relative
|
|
padding-bottom 15px
|
|
|
|
.skin-minimal & .list li
|
|
padding-left 38px
|
|
|
|
.skin-square & .list li
|
|
padding-left 42px
|
|
|
|
.skin-flat & .list li
|
|
.skin-line & label
|
|
padding-left 40px
|
|
|
|
.skin-line & h4
|
|
padding-bottom 24px
|
|
|
|
.skin-line & .list
|
|
padding-right 40px
|
|
|
|
li
|
|
padding-bottom 10px
|
|
|
|
.skin-polaris & .list li
|
|
padding-left 37px
|
|
|
|
.skin-futurico & .list li
|
|
padding-left 36px
|
|
|
|
.icheckbox_minimal
|
|
.icheckbox_minimal-red
|
|
.icheckbox_minimal-green
|
|
.icheckbox_minimal-blue
|
|
.icheckbox_minimal-aero
|
|
.icheckbox_minimal-grey
|
|
.icheckbox_minimal-orange
|
|
.icheckbox_minimal-yellow
|
|
.icheckbox_minimal-pink
|
|
.icheckbox_minimal-purple
|
|
.iradio_minimal
|
|
.iradio_minimal-red
|
|
.iradio_minimal-green
|
|
.iradio_minimal-blue
|
|
.iradio_minimal-aero
|
|
.iradio_minimal-grey
|
|
.iradio_minimal-orange
|
|
.iradio_minimal-yellow
|
|
.iradio_minimal-pink
|
|
.iradio_minimal-purple
|
|
position absolute
|
|
top 1px
|
|
left 0
|
|
|
|
.skin input[type=checkbox]
|
|
.skin input[type=radio]
|
|
position absolute
|
|
top 2px
|
|
left 0
|
|
|
|
.icheckbox_square
|
|
.icheckbox_square-red
|
|
.icheckbox_square-green
|
|
.icheckbox_square-blue
|
|
.icheckbox_square-aero
|
|
.icheckbox_square-grey
|
|
.icheckbox_square-orange
|
|
.icheckbox_square-yellow
|
|
.icheckbox_square-pink
|
|
.icheckbox_square-purple
|
|
.iradio_square
|
|
.iradio_square-red
|
|
.iradio_square-green
|
|
.iradio_square-blue
|
|
.iradio_square-aero
|
|
.iradio_square-grey
|
|
.iradio_square-orange
|
|
.iradio_square-yellow
|
|
.iradio_square-pink
|
|
.iradio_square-purple
|
|
position absolute
|
|
top -1px
|
|
left 0
|
|
|
|
.icheckbox_flat
|
|
.icheckbox_flat-red
|
|
.icheckbox_flat-green
|
|
.icheckbox_flat-blue
|
|
.icheckbox_flat-aero
|
|
.icheckbox_flat-grey
|
|
.icheckbox_flat-orange
|
|
.icheckbox_flat-yellow
|
|
.icheckbox_flat-pink
|
|
.icheckbox_flat-purple
|
|
.iradio_flat
|
|
.iradio_flat-red
|
|
.iradio_flat-green
|
|
.iradio_flat-blue
|
|
.iradio_flat-aero
|
|
.iradio_flat-grey
|
|
.iradio_flat-orange
|
|
.iradio_flat-yellow
|
|
.iradio_flat-pink
|
|
.iradio_flat-purple
|
|
position absolute
|
|
top 0
|
|
left 0
|
|
|
|
.icheckbox_polaris
|
|
.iradio_polaris
|
|
position absolute
|
|
top -4px
|
|
left -6px
|
|
|
|
.icheckbox_futurico
|
|
.iradio_futurico
|
|
position absolute
|
|
top 2px
|
|
left 0
|
|
|
|
.skin-states
|
|
float right
|
|
padding-right 57px
|
|
padding-left 0
|
|
|
|
.state
|
|
cursor default !important
|
|
|
|
.list
|
|
padding-right 0
|
|
|
|
.skin-minimal & .list li
|
|
padding-left 71px
|
|
|
|
.skin-square & .list li
|
|
padding-left 79px
|
|
|
|
.skin-flat & .list li
|
|
padding-left 75px
|
|
|
|
.skin-line & .list
|
|
padding-right 0
|
|
|
|
.skin-polaris & .list li
|
|
padding-left 69px
|
|
|
|
.skin-futurico & .list li
|
|
padding-left 67px
|
|
|
|
.iradio_minimal
|
|
.iradio_minimal-red
|
|
.iradio_minimal-green
|
|
.iradio_minimal-blue
|
|
.iradio_minimal-aero
|
|
.iradio_minimal-grey
|
|
.iradio_minimal-orange
|
|
.iradio_minimal-yellow
|
|
.iradio_minimal-pink
|
|
.iradio_minimal-purple
|
|
left 33px
|
|
|
|
.iradio_square
|
|
.iradio_square-red
|
|
.iradio_square-green
|
|
.iradio_square-blue
|
|
.iradio_square-aero
|
|
.iradio_square-grey
|
|
.iradio_square-orange
|
|
.iradio_square-yellow
|
|
.iradio_square-pink
|
|
.iradio_square-purple
|
|
left 37px
|
|
|
|
.iradio_flat
|
|
.iradio_flat-red
|
|
.iradio_flat-green
|
|
.iradio_flat-blue
|
|
.iradio_flat-aero
|
|
.iradio_flat-grey
|
|
.iradio_flat-orange
|
|
.iradio_flat-yellow
|
|
.iradio_flat-pink
|
|
.iradio_flat-purple
|
|
left 35px
|
|
|
|
.iradio_polaris
|
|
left 26px
|
|
|
|
.iradio_futurico
|
|
left 31px
|
|
|
|
.colors
|
|
clear both
|
|
padding 24px 0 9px
|
|
|
|
.skin-line &
|
|
padding-top 28px
|
|
|
|
strong
|
|
float left
|
|
line-height 20px
|
|
margin-right 20px
|
|
|
|
li
|
|
position relative
|
|
float left
|
|
width 16px
|
|
height 16px
|
|
margin 2px 1px 0 0
|
|
background #000
|
|
cursor pointer
|
|
filter unquote('alpha(opacity=50)')
|
|
opacity .5
|
|
-webkit-transition opacity .2s
|
|
-moz-transition opacity .2s
|
|
-ms-transition opacity .2s
|
|
-o-transition opacity .2s
|
|
transition opacity .2s
|
|
|
|
&:hover
|
|
filter unquote('alpha(opacity=100)')
|
|
opacity 1
|
|
|
|
&.active
|
|
height 20px
|
|
margin-top 0
|
|
filter unquote('alpha(opacity=75)')
|
|
opacity .75
|
|
|
|
&.red
|
|
background #d54e21
|
|
|
|
&.green
|
|
background #78a300
|
|
|
|
&.blue
|
|
background #0e76a8
|
|
|
|
&.aero
|
|
background #9cc2cb
|
|
|
|
&.grey
|
|
background #73716e
|
|
|
|
&.orange
|
|
background #f70
|
|
|
|
&.yellow
|
|
background #fc0
|
|
|
|
&.pink
|
|
background #ff66b5
|
|
|
|
&.purple
|
|
background #6a5a8c
|
|
|
|
.skin-square &.red
|
|
background #e56c69
|
|
|
|
.skin-square &.green
|
|
background #1b7e5a
|
|
|
|
.skin-square &.blue
|
|
background #2489c5
|
|
|
|
.skin-square &.aero
|
|
background #9cc2cb
|
|
|
|
.skin-square &.grey
|
|
background #73716e
|
|
|
|
.skin-square &.yellow
|
|
background #fc3
|
|
|
|
.skin-square &.pink
|
|
background #a77a94
|
|
|
|
.skin-square &.purple
|
|
background #6a5a8c
|
|
|
|
.skin-square &.orange
|
|
background #f70
|
|
|
|
.skin-flat &.red
|
|
background #ec7063
|
|
|
|
.skin-flat &.green
|
|
background #1abc9c
|
|
|
|
.skin-flat &.blue
|
|
background #3498db
|
|
|
|
.skin-flat &.grey
|
|
background #95a5a6
|
|
|
|
.skin-flat &.orange
|
|
background #f39c12
|
|
|
|
.skin-flat &.yellow
|
|
background #f1c40f
|
|
|
|
.skin-flat &.pink
|
|
background #af7ac5
|
|
|
|
.skin-flat &.purple
|
|
background #8677a7
|
|
|
|
.skin-line &.yellow
|
|
background #FFC414
|
|
|
|
.skins-info
|
|
padding 13px 0 57px
|
|
font-size 16px
|
|
line-height 22px
|
|
text-align center
|
|
|
|
p
|
|
margin-bottom 17px
|
|
|
|
.skin-pre
|
|
padding 43px 60px 0
|
|
|
|
.skin-usage
|
|
padding 19px 60px 8px
|
|
list-style decimal outside
|
|
|
|
li
|
|
margin-bottom 23px
|
|
|
|
.schemes
|
|
margin-bottom -3px
|
|
padding 13px 0 0 20px
|
|
color #888
|
|
|
|
ul
|
|
float left
|
|
padding-right 60px
|
|
|
|
li
|
|
margin 0
|
|
padding-bottom 3px
|
|
|
|
.usage
|
|
position relative
|
|
margin-bottom 80px
|
|
background #fff
|
|
|
|
a
|
|
border-bottom-color #ddd
|
|
|
|
.self
|
|
border-bottom-color #bbb
|
|
|
|
.arrows
|
|
top 0
|
|
|
|
&:hover .arrows .top
|
|
&:hover .arrows .bottom
|
|
left 0
|
|
|
|
h2
|
|
color #fff
|
|
background #1f7f5c
|
|
|
|
h4
|
|
margin 26px 0 10px
|
|
|
|
&.indeterminate
|
|
margin-top 28px
|
|
|
|
p
|
|
margin-bottom 5px
|
|
|
|
&.offset
|
|
margin-top 10px
|
|
|
|
&.callbacks-info
|
|
margin-bottom 19px
|
|
|
|
&.methods-info
|
|
margin-bottom 10px
|
|
|
|
&.methods-callback
|
|
margin-top 10px
|
|
|
|
&.issue-tracker
|
|
margin-top 31px
|
|
|
|
.markup
|
|
margin 9px 0 16px
|
|
|
|
.usage-inner
|
|
font-size 15px
|
|
line-height 23px
|
|
padding 41px 60px 39px
|
|
|
|
.markup
|
|
margin 10px 0 18px
|
|
padding 8px 0 9px 17px
|
|
font 14px/20px $stack
|
|
color lighten(#555, 20%)
|
|
background lighten(#d7d4cc, 40%)
|
|
border-left 3px solid darken(#ebeae5, 10%)
|
|
|
|
.comment
|
|
color lighten(#555, 40%)
|
|
|
|
.self
|
|
color #555
|
|
|
|
&:hover
|
|
color #333
|
|
|
|
.skin-polaris &
|
|
background darken(#2C323C, 20%)
|
|
border-left-color darken(#2C323C, 30%)
|
|
|
|
.skin-futurico &
|
|
background darken(#2E3035, 20%)
|
|
border-left-color darken(#2E3035, 30%)
|
|
|
|
.skin-polaris &
|
|
.skin-futurico &
|
|
|
|
.comment
|
|
color #555
|
|
|
|
.browsers
|
|
margin-bottom 74px
|
|
|
|
h2
|
|
margin-bottom 29px
|
|
font-size 24px
|
|
|
|
.browsers-inner
|
|
padding 0 60px
|
|
font-size 15px
|
|
line-height 23px
|
|
|
|
p
|
|
margin-bottom 15px
|
|
|
|
.benefits
|
|
position relative
|
|
margin-bottom 59px
|
|
color #888
|
|
background #232323
|
|
|
|
.arrows
|
|
top 0
|
|
|
|
&:hover .arrows .top
|
|
&:hover .arrows .bottom
|
|
left 0
|
|
|
|
h2
|
|
color #fff
|
|
background #6a5b8c
|
|
|
|
a
|
|
color #888
|
|
border-bottom-color #444
|
|
|
|
&:hover
|
|
color #aaa
|
|
|
|
.mark
|
|
color #777
|
|
background lighten(#232323, 10%)
|
|
|
|
.benefits-inner
|
|
padding 41px 60px 29px
|
|
font-size 15px
|
|
line-height 23px
|
|
|
|
p
|
|
margin-bottom 15px
|
|
|
|
ul
|
|
margin -10px 0 15px
|
|
|
|
.download
|
|
height 63px
|
|
text-align center
|
|
|
|
a
|
|
display block
|
|
height 60px
|
|
font-size 18px
|
|
line-height 58px
|
|
color #fff
|
|
border-bottom 0 solid darken(#E76B66, 10%)
|
|
background #E76B66
|
|
-webkit-transition border-bottom .2s
|
|
-moz-transition border-bottom .2s
|
|
-ms-transition border-bottom .2s
|
|
-o-transition border-bottom .2s
|
|
transition border-bottom .2s
|
|
|
|
&:before
|
|
content ''
|
|
display inline-block
|
|
width 26px
|
|
height 26px
|
|
margin-right 12px
|
|
background url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAACYUlEQVR4Xr3VPWhTURjH4VOt0ES7ZRJbEJpsNsaimx9E0GpRCdgU/NhsRAdNBYcK0RirQcSkIIK2cRBRiragVayDhqBDLVWatFvsIKK2UMEp4KBcf8N/KNdwvcHWAw8c/rzvebk5yU2dZVnmf6wVNdb70Ca+5Rrkx0e8E/ZkyzCoAyuxBZu17/jXQV34jjwCytowjUk90Ywyo5q8errcDoriPgpoRhEj6MQrGHmpbARF1RbUG3Uz6Bae4iBacQNNSKEPRi4pa1JNq3pGcds+qNrXu4B1CKKCWtZqlPAZO/72RDGsRdKWh5ATIdOSpHpjbu6ojBfYBiPdOIQeHJMeZd0wsh1jKDsNakEc97AHo8o3IYCz2I1nGMYuZQHVGPXs1RlxtNgH+TCFtBpvIqua40ghqkGdOIp27VOqMcigX8PTKIKzWXwZDDbAQhDG5o6yx2iAkQY80T4HYxOEpbP/uCOnN+wq1Nlq6x3qrWp3NIcKJvAWV+FVzU804i6uwyNZZY34BaOeyzpjQmfOLR70DSGcwyxOIa7mAZzHQ+QxLHllCdUYnMYZzOqsjeBsPbp8QFZ7Lw7gCt4jhGu4qCEGa5SVVWPUM4Yjbn5HfrTjNYzk8AAZ5CSjbBBG3qjXr0CqX+YAviJpy6cQg9NKIoJBN6+gIGbwA16kMY5eeGDEo2xcNV71TCPo5qM7iX14hJIueB4XkICRhLJ51ZTUsx8n3AwawmGE8QUhRDR4J4yElUUQUm1YvUPOfxPO4khj66KL70W/m+Z6uF3P0YdJBRVlZqkHlbEezQo+YWHJB8mC1Lx+Ayeq7nRIoewwAAAAAElFTkSuQmCC")
|
|
*background-image url(ie/icon-options.png)
|
|
vertical-align middle
|
|
|
|
&:hover
|
|
border-bottom-width 3px
|
|
|
|
.license
|
|
color #444
|
|
text-align center
|
|
padding 30px 0 75px
|
|
|
|
.footer
|
|
padding-top 28px
|
|
height 60px
|
|
color #666
|
|
background #e2dfd8
|
|
|
|
ul
|
|
float left
|
|
|
|
li
|
|
float left
|
|
padding 2px 10px 0 0
|
|
|
|
&.local li
|
|
padding 0 30px 0 0
|
|
|
|
.code
|
|
float right
|
|
|
|
a
|
|
color #444
|
|
|
|
&:hover
|
|
color #222
|
|
|
|
.footer-inner
|
|
width 930px
|
|
margin 0 auto
|
|
overflow hidden
|
|
|
|
.fork-me
|
|
position fixed
|
|
*position absolute
|
|
top 0
|
|
right 0
|
|
width 40px
|
|
height 40px
|
|
overflow hidden
|
|
text-indent 100%
|
|
white-space nowrap
|
|
background #28545b url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAnElEQVR4XqVSgQmEMAyszw/gCI7wK7iBblBHcISfxG6gG/gjuIGO0A3ygaYQCCG2HhweF+6aShsAcDcBJBpuvlwFagqGJwUf5EL6kgV2eEe2yIgc9QI73CMPs8AOywI7nHDSzCxYxcnJ6+hrFnQkJrb2nGclP3Fj+vf0IUV1AgCZHiS86lOObxD4qqSD5mtXmAq1e2fB3vqXact3f/JmXumJlVq1AAAAAElFTkSuQmCC") 50% no-repeat
|
|
*background-image url(ie/icon-fork.png)
|
|
|
|
&:hover
|
|
background-color #1f7f5c
|
|
|
|
.skin dt
|
|
.fork-me
|
|
-webkit-transition background-color .2s
|
|
-moz-transition background-color .2s
|
|
-ms-transition background-color .2s
|
|
-o-transition background-color .2s
|
|
transition background-color .2s |