diff --git a/_layouts/ffs-fr.html b/_layouts/ffs-fr.html index e348278ed8bda23a4e9b4583f0b870ebf96fc37e..563b85c3f96d2d1cd4f73ea35d80be9dd7cf9339 100644 --- a/_layouts/ffs-fr.html +++ b/_layouts/ffs-fr.html @@ -59,7 +59,7 @@ layout: base <p class="bar-fund-status">Raised <span class="progress-number-funded">{{proposal.amount-funded}}</span> of <span class="progress-number-goal">{{proposal.amount}}</span> XMR</p> </div> <div class="progress-bar"> - <span class="fund-progress" style="width: {{proposal-percentage}}%"></span> + <span class="fund-progress" style="width: {{proposal.percentage}}%"></span> </div> <p><a href="{{proposal.donate-url}}" class="btn btn-primary">Contribute</a></p> {%endif%} diff --git a/_layouts/ffs-wip.html b/_layouts/ffs-wip.html index ca958d1ed01f09ea2b1cffa022ffe9c7a2e182b0..33d6cd65169fdd356a5521aabbaab860a41daa0b 100644 --- a/_layouts/ffs-wip.html +++ b/_layouts/ffs-wip.html @@ -88,7 +88,7 @@ layout: base </div> {%endif%} </div> - </div> + </div> </div> </div> </div> diff --git a/css/custom.css b/css/custom.css index e84bb41b98c8fda6cb4d64dd1410747f46af3f6a..c0198f543981300a4c514467f039d1f651d208ec 100644 --- a/css/custom.css +++ b/css/custom.css @@ -1,91 +1,90 @@ /*FONTS*/ @font-face { - font-family: 'Hind'; - font-weight: 500; - font-style: normal; - src: url('../fonts/Hind-500.eot'); - src: url('../fonts/Hind-500.eot?#iefix') format('embedded-opentype'), - local('Hind Medium'), - local('Hind-500'), - url('../fonts/Hind-500.woff2') format('woff2'), - url('../fonts/Hind-500.woff') format('woff'), - url('../fonts/Hind-500.ttf') format('truetype'), - url('../fonts/Hind-500.svg#Hind') format('svg'); + font-family: 'Hind'; + font-weight: 500; + font-style: normal; + src: url('../fonts/Hind-500.eot'); + src: url('../fonts/Hind-500.eot?#iefix') format('embedded-opentype'), + local('Hind Medium'), + local('Hind-500'), + url('../fonts/Hind-500.woff2') format('woff2'), + url('../fonts/Hind-500.woff') format('woff'), + url('../fonts/Hind-500.ttf') format('truetype'), + url('../fonts/Hind-500.svg#Hind') format('svg'); } /* hind-600 - latin */ @font-face { - font-family: 'Hind'; - font-style: normal; - font-weight: 600; - src: url('..../fonts/Hind-600.eot'); - src: local('Hind SemiBold'), local('Hind-600'), - url('..../fonts/Hind-600.eot?#iefix') format('embedded-opentype'), - url('../fonts/Hind-600.woff2') format('woff2'), - url('../fonts/Hind-600.woff') format('woff'), - url('../fonts/Hind-600.ttf') format('truetype'), - url('../fonts/Hind-600.svg#Hind') format('svg'); + font-family: 'Hind'; + font-style: normal; + font-weight: 600; + src: url('..../fonts/Hind-600.eot'); + src: local('Hind SemiBold'), local('Hind-600'), + url('..../fonts/Hind-600.eot?#iefix') format('embedded-opentype'), + url('../fonts/Hind-600.woff2') format('woff2'), + url('../fonts/Hind-600.woff') format('woff'), + url('../fonts/Hind-600.ttf') format('truetype'), + url('../fonts/Hind-600.svg#Hind') format('svg'); } @font-face { - font-family: 'Hind'; - font-weight: 700; - font-style: normal; - src: url('../fonts/Hind-700.eot'); - src: url('../fonts/Hind-700.eot?#iefix') format('embedded-opentype'), - local('Hind Bold'), - local('Hind-700'), - url('../fonts/Hind-700.woff2') format('woff2'), - url('../fonts/Hind-700.woff') format('woff'), - url('../fonts/Hind-700.ttf') format('truetype'), - url('../fonts/Hind-700.svg#Hind') format('svg'); + font-family: 'Hind'; + font-weight: 700; + font-style: normal; + src: url('../fonts/Hind-700.eot'); + src: url('../fonts/Hind-700.eot?#iefix') format('embedded-opentype'), + local('Hind Bold'), + local('Hind-700'), + url('../fonts/Hind-700.woff2') format('woff2'), + url('../fonts/Hind-700.woff') format('woff'), + url('../fonts/Hind-700.ttf') format('truetype'), + url('../fonts/Hind-700.svg#Hind') format('svg'); } @font-face { - font-family: 'Open Sans'; - font-weight: 400; - font-style: normal; - src: url('../fonts/Open-Sans-regular.eot'); - src: url('../fonts/Open-Sans-regular.eot?#iefix') format('embedded-opentype'), - local('Open Sans'), - local('Open-Sans-regular'), - url('../fonts/Open-Sans-regular.woff2') format('woff2'), - url('../fonts/Open-Sans-regular.woff') format('woff'), - url('../fonts/Open-Sans-regular.ttf') format('truetype'), - url('../fonts/Open-Sans-regular.svg#OpenSans') format('svg'); + font-family: 'Open Sans'; + font-weight: 400; + font-style: normal; + src: url('../fonts/Open-Sans-regular.eot'); + src: url('../fonts/Open-Sans-regular.eot?#iefix') format('embedded-opentype'), + local('Open Sans'), + local('Open-Sans-regular'), + url('../fonts/Open-Sans-regular.woff2') format('woff2'), + url('../fonts/Open-Sans-regular.woff') format('woff'), + url('../fonts/Open-Sans-regular.ttf') format('truetype'), + url('../fonts/Open-Sans-regular.svg#OpenSans') format('svg'); } @font-face { - font-family: 'Open Sans'; - font-weight: 700; - font-style: normal; - src: url('../fonts/Open-Sans-700.eot'); - src: url('../fonts/Open-Sans-700.eot?#iefix') format('embedded-opentype'), - local('Open Sans Extrabold'), - local('Open-Sans-700'), - url('../fonts/Open-Sans-700.woff2') format('woff2'), - url('../fonts/Open-Sans-700.woff') format('woff'), - url('../fonts/Open-Sans-700.ttf') format('truetype'), - url('../fonts/Open-Sans-700.svg#OpenSans') format('svg'); + font-family: 'Open Sans'; + font-weight: 700; + font-style: normal; + src: url('../fonts/Open-Sans-700.eot'); + src: url('../fonts/Open-Sans-700.eot?#iefix') format('embedded-opentype'), + local('Open Sans Extrabold'), + local('Open-Sans-700'), + url('../fonts/Open-Sans-700.woff2') format('woff2'), + url('../fonts/Open-Sans-700.woff') format('woff'), + url('../fonts/Open-Sans-700.ttf') format('truetype'), + url('../fonts/Open-Sans-700.svg#OpenSans') format('svg'); } @font-face { - font-family: 'icons'; - src: url('../fonts/icons.eot?58817762'); - src: url('../fonts/icons.eot?58817762#iefix') format('embedded-opentype'), - url('../fonts/icons.woff2?58817762') format('woff2'), - url('../fonts/icons.woff?58817762') format('woff'), - url('../fonts/icons.ttf?58817762') format('truetype'), - url('../fonts/icons.svg?58817762#icons') format('svg'); - font-weight: normal; - font-style: normal; + font-family: 'icons'; + src: url('../fonts/icons.eot?58817762'); + src: url('../fonts/icons.eot?58817762#iefix') format('embedded-opentype'), + url('../fonts/icons.woff2?58817762') format('woff2'), + url('../fonts/icons.woff?58817762') format('woff'), + url('../fonts/icons.ttf?58817762') format('truetype'), + url('../fonts/icons.svg?58817762#icons') format('svg'); + font-weight: normal; + font-style: normal; } /*FLEXBOX*/ -.container, -.container-fluid { +.container, .container-fluid { margin-left: auto; margin-right: auto; } @@ -96,19 +95,33 @@ } .row { - box-sizing: border-box; - display: -ms-flexbox; - display: -webkit-box; - display: flex; - -ms-flex: 0 1 auto; - -webkit-box-flex: 0; - flex: 0 1 auto; - -ms-flex-direction: row; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - flex-direction: row; - -ms-flex-wrap: wrap; - flex-wrap: wrap; + box-sizing: border-box; + display: -ms-flexbox; + display: -webkit-box; + display: flex; + -ms-flex: 0 1 auto; + -webkit-box-flex: 0; + flex: 0 1 auto; + -ms-flex-direction: row; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + flex-direction: row; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} + +.row.reverse { + -ms-flex-direction: row-reverse; + -webkit-box-orient: horizontal; + -webkit-box-direction: reverse; + flex-direction: row-reverse; +} + +.col.reverse { + -ms-flex-direction: column-reverse; + -webkit-box-orient: vertical; + -webkit-box-direction: reverse; + flex-direction: column-reverse; } .col-xs, @@ -124,15 +137,225 @@ .col-xs-10, .col-xs-11, .col-xs-12 { + box-sizing: border-box; + -ms-flex: 0 0 auto; + -webkit-box-flex: 0; + flex: 0 0 auto; + /*padding-right: 1rem; + padding-left: 1rem;*/ +} + +.col-xs { + -webkit-flex-grow: 1; + -ms-flex-positive: 1; + -webkit-box-flex: 1; + flex-grow: 1; + -ms-flex-preferred-size: 0; + flex-basis: 0; + max-width: 100%; +} + +.col-xs-1 { + -ms-flex-preferred-size: 8.333%; + flex-basis: 8.333%; + max-width: 8.333%; +} + +.col-xs-2 { + -ms-flex-preferred-size: 16.667%; + flex-basis: 16.667%; + max-width: 16.667%; +} + +.col-xs-3 { + -ms-flex-preferred-size: 25%; + flex-basis: 25%; + max-width: 25%; +} + +.col-xs-4 { + -ms-flex-preferred-size: 33.333%; + flex-basis: 33.333%; + max-width: 33.333%; +} + +.col-xs-5 { + -ms-flex-preferred-size: 41.667%; + flex-basis: 41.667%; + max-width: 41.667%; +} + +.col-xs-6 { + -ms-flex-preferred-size: 50%; + flex-basis: 50%; + max-width: 50%; +} + +.col-xs-7 { + -ms-flex-preferred-size: 58.333%; + flex-basis: 58.333%; + max-width: 58.333%; +} + +.col-xs-8 { + -ms-flex-preferred-size: 66.667%; + flex-basis: 66.667%; + max-width: 66.667%; +} + +.col-xs-9 { + -ms-flex-preferred-size: 75%; + flex-basis: 75%; + max-width: 75%; +} + +.col-xs-10 { + -ms-flex-preferred-size: 83.333%; + flex-basis: 83.333%; + max-width: 83.333%; +} + +.col-xs-11 { + -ms-flex-preferred-size: 91.667%; + flex-basis: 91.667%; + max-width: 91.667%; +} + +.col-xs-12 { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; +} + +.col-xs-offset-1 { + margin-left: 8.333%; +} + +.col-xs-offset-2 { + margin-left: 16.667%; +} + +.col-xs-offset-3 { + margin-left: 25%; +} + +.col-xs-offset-4 { + margin-left: 33.333%; +} + +.col-xs-offset-5 { + margin-left: 41.667%; +} + +.col-xs-offset-6 { + margin-left: 50%; +} + +.col-xs-offset-7 { + margin-left: 58.333%; +} + +.col-xs-offset-8 { + margin-left: 66.667%; +} + +.col-xs-offset-9 { + margin-left: 75%; +} + +.col-xs-offset-10 { + margin-left: 83.333%; +} + +.col-xs-offset-11 { + margin-left: 91.667%; +} + +.start-xs { + -ms-flex-pack: start; + -webkit-box-pack: start; + justify-content: flex-start; + text-align: start; +} + +.center-xs { + -ms-flex-pack: center; + -webkit-box-pack: center; + justify-content: center; + text-align: center; +} + +.end-xs { + -ms-flex-pack: end; + -webkit-box-pack: end; + justify-content: flex-end; + text-align: right; +} + +.top-xs { + -ms-flex-align: start; + -webkit-box-align: start; + align-items: flex-start; +} + +.middle-xs { + -ms-flex-align: center; + -webkit-box-align: center; + align-items: center; +} + +.bottom-xs { + -ms-flex-align: end; + -webkit-box-align: end; + align-items: flex-end; +} + +.around-xs { + -ms-flex-pack: distribute; + justify-content: space-around; +} + +.between-xs { + -ms-flex-pack: justify; + -webkit-box-pack: justify; + justify-content: space-between; +} + +.first-xs { + -ms-flex-order: -1; + -webkit-box-ordinal-group: 0; + order: -1; +} + +.last-xs { + -ms-flex-order: 1; + -webkit-box-ordinal-group: 2; + order: 1; +} + +@media only screen and (min-width: 48em) { + .col-sm, + .col-sm-1, + .col-sm-2, + .col-sm-3, + .col-sm-4, + .col-sm-5, + .col-sm-6, + .col-sm-7, + .col-sm-8, + .col-sm-9, + .col-sm-10, + .col-sm-11, + .col-sm-12 { box-sizing: border-box; -ms-flex: 0 0 auto; -webkit-box-flex: 0; flex: 0 0 auto; /*padding-right: 1rem; - padding-left: 1rem;*/ -} + padding-left: 1rem;*/ + } -.col-xs { + .col-sm { -webkit-flex-grow: 1; -ms-flex-positive: 1; -webkit-box-flex: 1; @@ -140,431 +363,613 @@ -ms-flex-preferred-size: 0; flex-basis: 0; max-width: 100%; -} + } -.col-xs-3 { + .col-sm-1 { + -ms-flex-preferred-size: 8.333%; + flex-basis: 8.333%; + max-width: 8.333%; + } + + .col-sm-2 { + -ms-flex-preferred-size: 16.667%; + flex-basis: 16.667%; + max-width: 16.667%; + } + + .col-sm-3 { -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; -} + } -.col-xs-4 { + .col-sm-4 { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; max-width: 33.333%; -} + } -.col-xs-5 { + .col-sm-5 { -ms-flex-preferred-size: 41.667%; flex-basis: 41.667%; max-width: 41.667%; -} + } -.col-xs-6 { + .col-sm-6 { -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; -} + } -.col-xs-7 { + .col-sm-7 { -ms-flex-preferred-size: 58.333%; flex-basis: 58.333%; max-width: 58.333%; -} + } -.col-xs-8 { + .col-sm-8 { -ms-flex-preferred-size: 66.667%; flex-basis: 66.667%; max-width: 66.667%; -} + } -.col-xs-9 { + .col-sm-9 { -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; -} + } -.col-xs-12 { + .col-sm-10 { + -ms-flex-preferred-size: 83.333%; + flex-basis: 83.333%; + max-width: 83.333%; + } + + .col-sm-11 { + -ms-flex-preferred-size: 91.667%; + flex-basis: 91.667%; + max-width: 91.667%; + } + + .col-sm-12 { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; -} + } -.start-xs { + .col-sm-offset-1 { + margin-left: 8.333%; + } + + .col-sm-offset-2 { + margin-left: 16.667%; + } + + .col-sm-offset-3 { + margin-left: 25%; + } + + .col-sm-offset-4 { + margin-left: 33.333%; + } + + .col-sm-offset-5 { + margin-left: 41.667%; + } + + .col-sm-offset-6 { + margin-left: 50%; + } + + .col-sm-offset-7 { + margin-left: 58.333%; + } + + .col-sm-offset-8 { + margin-left: 66.667%; + } + + .col-sm-offset-9 { + margin-left: 75%; + } + + .col-sm-offset-10 { + margin-left: 83.333%; + } + + .col-sm-offset-11 { + margin-left: 91.667%; + } + + .start-sm { -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; -} + } -.center-xs { + .center-sm { -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; -} + } -.end-xs { + .end-sm { -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: right; -} + } -.top-xs { + .top-sm { -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; -} + } -.middle-xs { + .middle-sm { -ms-flex-align: center; -webkit-box-align: center; align-items: center; -} + } -.bottom-xs { + .bottom-sm { -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; -} + } -.around-xs { + .around-sm { -ms-flex-pack: distribute; justify-content: space-around; -} + } -.between-xs { + .between-sm { -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; -} + } -.first-xs { + .first-sm { -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; -} + } -.last-xs { + .last-sm { -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; + } } -@media only screen and (min-width: 48em) { +@media only screen and (min-width: 62em) { + .container { + width: 61rem; + } + + .col-md, + .col-md-1, + .col-md-2, + .col-md-3, + .col-md-4, + .col-md-5, + .col-md-6, + .col-md-7, + .col-md-8, + .col-md-9, + .col-md-10, + .col-md-11, + .col-md-12 { + box-sizing: border-box; + -ms-flex: 0 0 auto; + -webkit-box-flex: 0; + flex: 0 0 auto; + } - .col-sm, - .col-sm-1, - .col-sm-2, - .col-sm-3, - .col-sm-4, - .col-sm-5, - .col-sm-6, - .col-sm-7, - .col-sm-8, - .col-sm-9, - .col-sm-10, - .col-sm-11, - .col-sm-12 { - box-sizing: border-box; - -ms-flex: 0 0 auto; - -webkit-box-flex: 0; - flex: 0 0 auto; - /*padding-right: 1rem; - padding-left: 1rem;*/ - } + .col-md { + -webkit-flex-grow: 1; + -ms-flex-positive: 1; + -webkit-box-flex: 1; + flex-grow: 1; + -ms-flex-preferred-size: 0; + flex-basis: 0; + max-width: 100%; + } - .col-sm { - -webkit-flex-grow: 1; - -ms-flex-positive: 1; - -webkit-box-flex: 1; - flex-grow: 1; - -ms-flex-preferred-size: 0; - flex-basis: 0; - max-width: 100%; - } + .col-md-1 { + -ms-flex-preferred-size: 8.333%; + flex-basis: 8.333%; + max-width: 8.333%; + } - .col-sm-3 { - -ms-flex-preferred-size: 25%; - flex-basis: 25%; - max-width: 25%; - } + .col-md-2 { + -ms-flex-preferred-size: 16.667%; + flex-basis: 16.667%; + max-width: 16.667%; + } - .col-sm-4 { - -ms-flex-preferred-size: 33.333%; - flex-basis: 33.333%; - max-width: 33.333%; - } + .col-md-3 { + -ms-flex-preferred-size: 25%; + flex-basis: 25%; + max-width: 25%; + } - .col-sm-5 { - -ms-flex-preferred-size: 41.667%; - flex-basis: 41.667%; - max-width: 41.667%; - } + .col-md-4 { + -ms-flex-preferred-size: 33.333%; + flex-basis: 33.333%; + max-width: 33.333%; + } - .col-sm-6 { - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50%; - } + .col-md-5 { + -ms-flex-preferred-size: 41.667%; + flex-basis: 41.667%; + max-width: 41.667%; + } - .col-sm-7 { - -ms-flex-preferred-size: 58.333%; - flex-basis: 58.333%; - max-width: 58.333%; - } + .col-md-6 { + -ms-flex-preferred-size: 50%; + flex-basis: 50%; + max-width: 50%; + } - .col-sm-8 { - -ms-flex-preferred-size: 66.667%; - flex-basis: 66.667%; - max-width: 66.667%; - } + .col-md-7 { + -ms-flex-preferred-size: 58.333%; + flex-basis: 58.333%; + max-width: 58.333%; + } - .col-sm-9 { - -ms-flex-preferred-size: 75%; - flex-basis: 75%; - max-width: 75%; - } + .col-md-8 { + -ms-flex-preferred-size: 66.667%; + flex-basis: 66.667%; + max-width: 66.667%; + } - .col-sm-12 { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - } + .col-md-9 { + -ms-flex-preferred-size: 75%; + flex-basis: 75%; + max-width: 75%; + } - .start-sm { - -ms-flex-pack: start; - -webkit-box-pack: start; - justify-content: flex-start; - text-align: start; - } + .col-md-10 { + -ms-flex-preferred-size: 83.333%; + flex-basis: 83.333%; + max-width: 83.333%; + } - .center-sm { - -ms-flex-pack: center; - -webkit-box-pack: center; - justify-content: center; - text-align: center; - } + .col-md-11 { + -ms-flex-preferred-size: 91.667%; + flex-basis: 91.667%; + max-width: 91.667%; + } - .end-sm { - -ms-flex-pack: end; - -webkit-box-pack: end; - justify-content: flex-end; - text-align: right; - } + .col-md-12 { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + } - .top-sm { - -ms-flex-align: start; - -webkit-box-align: start; - align-items: flex-start; - } + .col-md-offset-1 { + margin-left: 8.333%; + } - .middle-sm { - -ms-flex-align: center; - -webkit-box-align: center; - align-items: center; - } + .col-md-offset-2 { + margin-left: 16.667%; + } - .bottom-sm { - -ms-flex-align: end; - -webkit-box-align: end; - align-items: flex-end; - } + .col-md-offset-3 { + margin-left: 25%; + } - .around-sm { - -ms-flex-pack: distribute; - justify-content: space-around; - } + .col-md-offset-4 { + margin-left: 33.333%; + } - .between-sm { - -ms-flex-pack: justify; - -webkit-box-pack: justify; - justify-content: space-between; - } + .col-md-offset-5 { + margin-left: 41.667%; + } - .first-sm { - -ms-flex-order: -1; - -webkit-box-ordinal-group: 0; - order: -1; - } + .col-md-offset-6 { + margin-left: 50%; + } - .last-sm { - -ms-flex-order: 1; - -webkit-box-ordinal-group: 2; - order: 1; - } -} + .col-md-offset-7 { + margin-left: 58.333%; + } -@media only screen and (min-width: 62em) { - .container { - width: 61rem; - } + .col-md-offset-8 { + margin-left: 66.667%; + } - .col-md, - .col-md-1, - .col-md-2, - .col-md-3, - .col-md-4, - .col-md-5, - .col-md-6, - .col-md-7, - .col-md-8, - .col-md-9, - .col-md-10, - .col-md-11, - .col-md-12 { - box-sizing: border-box; - -ms-flex: 0 0 auto; - -webkit-box-flex: 0; - flex: 0 0 auto; - } + .col-md-offset-9 { + margin-left: 75%; + } - .col-md-3 { - -ms-flex-preferred-size: 25%; - flex-basis: 25%; - max-width: 25%; - } + .col-md-offset-10 { + margin-left: 83.333%; + } - .col-md-4 { - -ms-flex-preferred-size: 33.333%; - flex-basis: 33.333%; - max-width: 33.333%; - } + .col-md-offset-11 { + margin-left: 91.667%; + } - .col-md-5 { - -ms-flex-preferred-size: 41.667%; - flex-basis: 41.667%; - max-width: 41.667%; - } + .start-md { + -ms-flex-pack: start; + -webkit-box-pack: start; + justify-content: flex-start; + text-align: start; + } - .col-md-6 { - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50%; - } + .center-md { + -ms-flex-pack: center; + -webkit-box-pack: center; + justify-content: center; + text-align: center; + } - .col-md-7 { - -ms-flex-preferred-size: 58.333%; - flex-basis: 58.333%; - max-width: 58.333%; - } + .end-md { + -ms-flex-pack: end; + -webkit-box-pack: end; + justify-content: flex-end; + text-align: right; + } - .col-md-8 { - -ms-flex-preferred-size: 66.667%; - flex-basis: 66.667%; - max-width: 66.667%; - } + .top-md { + -ms-flex-align: start; + -webkit-box-align: start; + align-items: flex-start; + } - .col-md-9 { - -ms-flex-preferred-size: 75%; - flex-basis: 75%; - max-width: 75%; - } + .middle-md { + -ms-flex-align: center; + -webkit-box-align: center; + align-items: center; + } - .col-md-12 { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - } + .bottom-md { + -ms-flex-align: end; + -webkit-box-align: end; + align-items: flex-end; + } - .start-md { - -ms-flex-pack: start; - -webkit-box-pack: start; - justify-content: flex-start; - text-align: start; - } + .around-md { + -ms-flex-pack: distribute; + justify-content: space-around; + } - .center-md { - -ms-flex-pack: center; - -webkit-box-pack: center; - justify-content: center; - text-align: center; - } + .between-md { + -ms-flex-pack: justify; + -webkit-box-pack: justify; + justify-content: space-between; + } - .end-md { - -ms-flex-pack: end; - -webkit-box-pack: end; - justify-content: flex-end; - text-align: right; - } + .first-md { + -ms-flex-order: -1; + -webkit-box-ordinal-group: 0; + order: -1; + } - .top-md { - -ms-flex-align: start; - -webkit-box-align: start; - align-items: flex-start; - } + .last-md { + -ms-flex-order: 1; + -webkit-box-ordinal-group: 2; + order: 1; + } +} - .middle-md { - -ms-flex-align: center; - -webkit-box-align: center; - align-items: center; - } +@media only screen and (min-width: 75em) { + .container { + width: 71rem; + margin-left: auto; + margin-right: auto; + } + + .col-lg, + .col-lg-1, + .col-lg-2, + .col-lg-3, + .col-lg-4, + .col-lg-5, + .col-lg-6, + .col-lg-7, + .col-lg-8, + .col-lg-9, + .col-lg-10, + .col-lg-11, + .col-lg-12 { + box-sizing: border-box; + -ms-flex: 0 0 auto; + -webkit-box-flex: 0; + flex: 0 0 auto; + } - .bottom-md { - -ms-flex-align: end; - -webkit-box-align: end; - align-items: flex-end; - } + .col-lg { + -webkit-flex-grow: 1; + -ms-flex-positive: 1; + -webkit-box-flex: 1; + flex-grow: 1; + -ms-flex-preferred-size: 0; + flex-basis: 0; + max-width: 100%; + } - .around-md { - -ms-flex-pack: distribute; - justify-content: space-around; - } + .col-lg-1 { + -ms-flex-preferred-size: 8.333%; + flex-basis: 8.333%; + max-width: 8.333%; + } - .between-md { - -ms-flex-pack: justify; - -webkit-box-pack: justify; - justify-content: space-between; - } + .col-lg-2 { + -ms-flex-preferred-size: 16.667%; + flex-basis: 16.667%; + max-width: 16.667%; + } - .first-md { - -ms-flex-order: -1; - -webkit-box-ordinal-group: 0; - order: -1; - } + .col-lg-3 { + -ms-flex-preferred-size: 25%; + flex-basis: 25%; + max-width: 25%; + } - .last-md { - -ms-flex-order: 1; - -webkit-box-ordinal-group: 2; - order: 1; - } -} + .col-lg-4 { + -ms-flex-preferred-size: 33.333%; + flex-basis: 33.333%; + max-width: 33.333%; + } -@media only screen and (min-width: 75em) { - .container { - width: 71rem; - margin-left: auto; - margin-right: auto; - } + .col-lg-5 { + -ms-flex-preferred-size: 41.667%; + flex-basis: 41.667%; + max-width: 41.667%; + } - .col-lg, - .col-lg-1, - .col-lg-2, - .col-lg-3, - .col-lg-4, - .col-lg-5, - .col-lg-6, - .col-lg-7, - .col-lg-8, - .col-lg-9, - .col-lg-10, - .col-lg-11, - .col-lg-12 { - box-sizing: border-box; - -ms-flex: 0 0 auto; - -webkit-box-flex: 0; - flex: 0 0 auto; - } - - .col-lg-8 { + .col-lg-6 { + -ms-flex-preferred-size: 50%; + flex-basis: 50%; + max-width: 50%; + } + + .col-lg-7 { + -ms-flex-preferred-size: 58.333%; + flex-basis: 58.333%; + max-width: 58.333%; + } + .col-lg-8 { -ms-flex-preferred-size: 66.667%; flex-basis: 66.667%; max-width: 66.667%; + } -} - + .col-lg-9 { + -ms-flex-preferred-size: 75%; + flex-basis: 75%; + max-width: 75%; + } + + .col-lg-10 { + -ms-flex-preferred-size: 83.333%; + flex-basis: 83.333%; + max-width: 83.333%; + } + + .col-lg-11 { + -ms-flex-preferred-size: 91.667%; + flex-basis: 91.667%; + max-width: 91.667%; + } + + .col-lg-12 { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + } + + .col-lg-offset-1 { + margin-left: 8.333%; + } + + .col-lg-offset-2 { + margin-left: 16.667%; + } + + .col-lg-offset-3 { + margin-left: 25%; + } + + .col-lg-offset-4 { + margin-left: 33.333%; + } + + .col-lg-offset-5 { + margin-left: 41.667%; + } + + .col-lg-offset-6 { + margin-left: 50%; + } + + .col-lg-offset-7 { + margin-left: 58.333%; + } + + .col-lg-offset-8 { + margin-left: 66.667%; + } + + .col-lg-offset-9 { + margin-left: 75%; + } + + .col-lg-offset-10 { + margin-left: 83.333%; + } + + .col-lg-offset-11 { + margin-left: 91.667%; + } + + .start-lg { + -ms-flex-pack: start; + -webkit-box-pack: start; + justify-content: flex-start; + text-align: start; + } + + .center-lg { + -ms-flex-pack: center; + -webkit-box-pack: center; + justify-content: center; + text-align: center; + } + + .end-lg { + -ms-flex-pack: end; + -webkit-box-pack: end; + justify-content: flex-end; + text-align: right; + } + + .top-lg { + -ms-flex-align: start; + -webkit-box-align: start; + align-items: flex-start; + } + + .middle-lg { + -ms-flex-align: center; + -webkit-box-align: center; + align-items: center; + } + + .bottom-lg { + -ms-flex-align: end; + -webkit-box-align: end; + align-items: flex-end; + } + + .around-lg { + -ms-flex-pack: distribute; + justify-content: space-around; + } + + .between-lg { + -ms-flex-pack: justify; + -webkit-box-pack: justify; + justify-content: space-between; + } + + .first-lg { + -ms-flex-order: -1; + -webkit-box-ordinal-group: 0; + order: -1; + } + + .last-lg { + -ms-flex-order: 1; + -webkit-box-ordinal-group: 2; + order: 1; + } } /******************GENERAL**********************/ @@ -578,9 +983,7 @@ body { background-color: #edeef0; } -body p, -body blockquote, -body ul { +body p, body blockquote, body ul { line-height: 1.7; font-size: 1rem; } @@ -590,64 +993,38 @@ a { text-decoration: none; } -a:hover, -a:focus, -a:active { +a:hover, a:focus, a:active { text-decoration: underline; outline: 0; } -textarea:focus, -input:focus { +textarea:focus, input:focus{ outline: none; } -a, -button, -input, -select, -textarea, -label, -label:checked, -label:focus { - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); +a, button, input, select, textarea, label, label:checked, label:focus { + -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; } -h1, -h2, -h3, -h4, -h5, -h6, -p { - margin: 0; - padding: 0; -} +h1, h2, h3, h4, h5, h6, p {margin: 0; padding: 0;} -img, -video { - max-width: 100%; -} +img, video {max-width: 100%;} ::-webkit-input-placeholder { - color: #AAA; + color: #AAA; } - ::-moz-placeholder { - color: #AAA; + color: #AAA; } - :-moz-placeholder { - color: #AAA; + color: #AAA; } - :-ms-input-placeholder { - color: #AAA; + color: #AAA; } - ::-ms-input-placeholder { - color: #AAA; + color: #AAA; } .list-unstyled { @@ -655,170 +1032,479 @@ video { padding-left: 0; } -.list-inline > li { - display: inline; +.list-inline>li { + display: inline; +} + +.text-center {text-align: center;} + +.text-adapted { + max-width: 40rem; + margin-left: auto; + margin-right: auto; +} + +.info-block, .white-nav { + background-color: #ffffff; + -moz-box-shadow: 0 2px 4px rgba(50,50,93,.1); + -webkit-box-shadow: 0 2px 4px rgba(50,50,93,.1); + box-shadow: 0 2px 4px rgba(50,50,93,.1); +} + +.bold { + font-weight: 600; +} + +code { + white-space: pre-wrap; + background-color: #fff1e8; + color: #2f6f9f; + padding: 0.2rem; + margin: 0 0.2rem; + border-radius: 0.2rem; + text-indent: 0; + line-height: 1.1rem; +} + +pre.highlight { + background-color: #fff1e8; + color: #2f6f9f; + padding: 0.7rem; + border-radius: 0.2rem; + text-indent: -6px; +} + +pre.highlight>code { + background-color: none; +} + +.arrow-down { + width: 0; + height: 0; + border-left: 3px solid transparent; + border-right: 3px solid transparent; + border-top: 3px solid #393939; +} + +.untranslated { + background-color: #ff7519; + position: fixed; + bottom: 0; + left: 0; + z-index: 4; + width: 100%; + text-align: center; + color: white; + padding-bottom: 1rem; +} + +.untranslated.yes { + display: none; +} + +.untranslated.no { + display: block; +} + + + + + + + + +.upgrade-content { + background-color: #e5ba38; + top: 0; + left: 0; + z-index: 4; + width: 100%; + text-align: center; + color: #4c4c4c; + padding-bottom: 1.3rem; + padding-top: 1.3rem; + -moz-box-shadow: 0 2px 6px rgba(50,50,93,.1); + -webkit-box-shadow: 0 2px 6px rgba(50,50,93,.1); + box-shadow: 0 2px 6px rgba(50,50,93,.1); + margin-bottom: 0.4rem; + position: relative; +} + +.upgrade-content a { + color: #4c4c4c; + font-size: 1.1rem; +} + +.upgrade-content p { + padding: 0; + display: block; + font-size: 1.1rem; +} + +#upgrade-toggle { + display: none; +} + +#upgrade-toggle:checked ~ .upgrade-content, #upgrade-toggle:checked ~ .upgrade-x { + display: none; +} + +label.upgrade-x { + position: absolute; + right: 1rem; + width: 32px; + height: 32px; + opacity: 0.7; + cursor: pointer; +} + +label.upgrade-x:hover { + opacity: 1; +} + +label.upgrade-x:before, label.upgrade-x:after { + position: absolute; + content: ' '; + height: 33px; + width: 3px; + background-color: #4c4c4c; +} + +label.upgrade-x:before { + transform: rotate(45deg); +} + +label.upgrade-x:after { + transform: rotate(-45deg); +} + +@media only screen and (max-width: 75rem) { + +.upgrade-content p { + width: 90%; + margin: 0 auto; + font-size: 1rem; +} + +.upgrade-content a { + font-size: 1rem; +} + +label.upgrade-x:before, label.upgrade-x:after { + position: absolute; + content: ' '; + height: 30px; + background-color: #4c4c4c; +} + +} + +@media only screen and (max-width: 62rem) { + +.upgrade-content { + position: fixed; + top: auto; + bottom: 0; + margin-bottom: 0; + -moz-box-shadow: 0 0 6px rgba(50,50,93,.1); + -webkit-box-shadow: 0 0 6px rgba(50,50,93,.1); + box-shadow: 0 0 6px rgba(50,50,93,.1); +} + +.upgrade-content p { + width: 80%; +} + +label.upgrade-x { + top: 0.5rem; + right: 0.5rem; +} + +} + +@media only screen and (max-width: 30rem) { + +.upgrade-content p { + width: 75%; +} + +} + + + + + + + +.disclaimer { + background-color: #ff7519; + position: fixed; + bottom: 0; + left: 0; + z-index: 4; + width: 100%; + text-align: center; + color: white; + padding-bottom: 1rem; +} + +.untranslated-link { + color: white; + text-decoration: underline; +} + +.disclaimer-link { + color: white; + text-decoration: underline; +} + +@media only screen and (max-width: 75rem) { + +body p, body blockquote, body ul { + font-size: 16px; + font-size: 1rem; +} + +} + +@media only screen and (max-width: 62rem) { + +.page-wrapper { + padding-top: 4.5rem; +} + code { + word-break: break-all; + } + +} + +@media only screen and (max-width: 48rem) { + +body {font-size: 1rem;} + +.page-wrapper { + padding-top: 4.5rem; +} + .untranslated p { + font-size: 0.6rem; + } + +} + +/*******************HEADINGS*************************/ + +h1 { + font-family: 'Hind', 'Open Sans', sans-serif; + font-weight: 600; + font-size: 2.3rem; + line-height: 1; + margin: 2.5rem 0 0.7rem 0; +} + +h2 { + font-family: 'Hind', 'Open Sans', sans-serif; + font-weight: 600; + font-size: 1.75rem; + line-height: 1.3; + text-align: center; +} + +h3 { + font-family: 'Open Sans', sans-serif; + font-size: 1.5rem; + font-weight: 400; + /*margin: 2.7rem 0 1rem 0;*/ + letter-spacing: 0.05rem; + line-height: 1.3; + padding-top: 1rem; + margin-top: 1rem; + margin-bottom: 0; +} + +p, h4 { + padding-top: 1rem; +} + +h1#main-h1 { + font-family: 'Hind', 'Open Sans', sans-serif; + font-weight: 700; + font-size: 3.4375rem; + text-transform: uppercase; + margin: 0; + line-height: 1; + padding: 0; +} + + +h2#main-h2 { + font-family: 'Open Sans', sans-serif; + font-size: 1.5625rem; + font-size: 1.75rem; + font-weight: 400; + margin: 1rem 0 0 0; + letter-spacing: 0.05rem; + line-height: 1; + text-align: left; +} + +.about-main h3, .about-monero h3 { + padding-top: 0; + font-weight: 600; + line-height: 1.7; + font-size: 1.15rem; + letter-spacing: normal; +} + +.info-block h2 { + margin-top: 4rem; + margin-bottom: 1rem; + margin-bottom: 0; +} + +.info-block h2:first-child, h3:first-child, h3:first-of-type { + margin-top: 0; +} + +.events h3 { + margin-top: 1rem; } -.text-center { + +.container.description p, .container.description h3 { + padding: 0 5rem; text-align: center; + margin-bottom: 2.5rem; } -.text-adapted { - max-width: 40rem; - margin-left: auto; - margin-right: auto; -} -.info-block, -.white-nav { - background-color: #ffffff; - -moz-box-shadow: 0 2px 4px rgba(50, 50, 93, .1); - -webkit-box-shadow: 0 2px 4px rgba(50, 50, 93, .1); - box-shadow: 0 2px 4px rgba(50, 50, 93, .1); +.pre-roadmap p { + margin-bottom: 2.5rem; } -.bold { - font-weight: 600; +.hangouts ul { + margin-bottom: 2.5rem; } -code { - white-space: pre-wrap; - background-color: #fff1e8; - color: #2f6f9f; - padding: 0.2rem; - margin: 0 0.2rem; - border-radius: 0.2rem; - text-indent: 0; - line-height: 1.1rem; -} +@media only screen and (max-width: 75rem) { -pre.highlight { - background-color: #fff1e8; - color: #2f6f9f; - padding: 0.7rem; - border-radius: 0.2rem; - text-indent: -6px; +h1#main-h1 { + font-size: 2.4rem; + margin: 0; + line-height: 1; } -pre.highlight > code { - background-color: none; +h2#main-h2 { + font-size: 1.25rem; + margin: 0.5rem 0 0 0; } -.arrow-down { - width: 0; - height: 0; - border-left: 3px solid transparent; - border-right: 3px solid transparent; - border-top: 3px solid #393939; +h2, .info-block h2 { + font-size: 23px; + font-size: 1.5625rem; + margin-bottom: 0; } -@media only screen and (max-width: 75rem) { - - body p, - body blockquote, - body ul { - font-size: 16px; - font-size: 1rem; - } +h3 { + font-size: 19px; + font-size: 1.25rem; + padding-top: 1rem; + margin-top: 1rem; + margin-bottom: 0; +} } @media only screen and (max-width: 62rem) { - .page-wrapper { - padding-top: 4.5rem; - } - - code { - word-break: break-all; - } - +h1 { + margin: 0.5rem 0 1rem 0; } -@media only screen and (max-width: 48rem) { +.pre-roadmap p, .container.description p { + margin-bottom: 1.5rem; + margin-top: -1rem; +} - body { - font-size: 1rem; - } +h1#main-h1 { + font-size: 3rem; + text-transform: uppercase; + margin: 0; +} - .page-wrapper { - padding-top: 4.5rem; - } +h2#main-h2 { + font-size: 1.25rem; + margin: 1rem 0 0 0; +} - .untranslated p { - font-size: 0.6rem; - } +h2, .info-block h2 { + font-size: 23px; + font-size: 1.5625rem; + margin-bottom: 0; +} +h3 { + font-size: 20px; + font-size: 1.25rem; + padding-top: 1rem; + margin-top: 1rem; + margin-bottom: 0; } -/*******************HEADINGS*************************/ +p { + padding-top: 1rem; +} -h1 { - font-family: 'Hind', 'Open Sans', sans-serif; - font-weight: 600; - line-height: 1; } -h2 { - font-family: 'Hind', 'Open Sans', sans-serif; - font-weight: 600; - line-height: 1.3; +@media only screen and (max-width: 48rem) { + +h1#main-h1 { + font-size: 3rem; } -h3 { - line-height: 1.3; +h1 { + font-size: 1.8rem; + padding: 0.3rem; + margin: 0.5rem 0; } -p, -h4 { +.about-main h3, .about-monero h3 { padding-top: 1rem; } -.info-block h2 { - margin-top: 4rem; - margin-bottom: 1rem; - margin-bottom: 0; +.container.description p { + padding: 0 2rem; } -.info-block h2:first-child, -h3:first-child, -h3:first-of-type { - margin-top: 0; +.pre-roadmap p, .container.description p { + margin-bottom: 1rem; + margin-top: -0.5rem; } -.container.description p, -.container.description h3 { - padding: 0 5rem; - text-align: center; - margin-bottom: 2.5rem; } -@media only screen and (max-width: 62rem) { +@media only screen and (max-width: 47.9rem) { - h2, - .info-block h2 { - margin-bottom: 0; - } - p { - padding-top: 1rem; - } } -@media only screen and (max-width: 48rem) { - .container.description p { - padding: 0 2rem; - } +@media only screen and (max-width: 30rem) { + +h1#main-h1 { + font-size: 2.5rem; } -@media only screen and (max-width: 30rem) { +h2#main-h2 { + font-size: 1.5rem; + margin-top: 0.5rem; +} - h2, .info-block h2 { - font-size: 1.4rem; - } +h2, .info-block h2 { + font-size: 1.4rem; +} } @@ -833,30 +1519,22 @@ h3:first-of-type { word-wrap: break-word; } -.full > .info-block.text-adapt { +.full>.info-block.text-adapt { padding: 4rem 15rem; } .guides .info-block { - word-break: keep-all; + word-break:keep-all; } -.left.two-thirds, -.left.one-third, -.left.half, -.left.one-fourth, -.left.three-fourths { +.left.two-thirds, .left.one-third, .left.half, .left.one-fourth, .left.three-fourths { display: flex; display: -ms-flexbox; display: -webkit-flex; padding-right: 0.5rem; } -.right.two-thirds, -.right.one-third, -.right.half, -.right.one-fourth, -.right.three-fourths { +.right.two-thirds, .right.one-third, .right.half, .right.one-fourth, .right.three-fourths { display: flex; display: -ms-flexbox; display: -webkit-flex; @@ -869,9 +1547,7 @@ h3:first-of-type { display: -webkit-flex; } -.center.one-third, -.center-1.one-fourth, -.center-2.one-fourth { +.center.one-third, .center-1.one-fourth, .center-2.one-fourth { display: flex; display: -ms-flexbox; display: -webkit-flex; @@ -881,96 +1557,67 @@ h3:first-of-type { @media only screen and (max-width: 75rem) { - .info-block { - padding: 3rem 2rem; - } +.info-block { + padding: 3rem 2rem; +} - .full > .info-block.text-adapt { - padding: 4rem 10rem; - } +.full>.info-block.text-adapt { + padding: 4rem 10rem; +} } @media only screen and (max-width: 62rem) { - .container.full { - margin-left: 1rem; - margin-right: 1rem; - } +.container.full { + margin-left: 1rem; + margin-right: 1rem; +} - .info-block { - padding: 2.5rem 1.8rem; - } +.info-block { + padding: 2.5rem 1.8rem; +} - .full > .info-block.text-adapt { - padding: 4rem; - } +.full>.info-block.text-adapt { + padding: 4rem; +} - .center.one-fourth, - .right.three-fourths, - .left.three-fourths, - .left.one-fourth.no-pad-sm, - .right.one-fourth.no-pad-sm, - .right.half, - .left.half, - .right.one-third, - .left.two-thirds, - .left.one-third, - .right.two-thirds, - .center.one-third { - padding-left: 0; - padding-right: 0; - } +.center.one-fourth, .right.three-fourths, .left.three-fourths, .left.one-fourth.no-pad-sm, .right.one-fourth.no-pad-sm, .right.half, .left.half, .right.one-third, .left.two-thirds, .left.one-third, .right.two-thirds, .center.one-third { + padding-left: 0; padding-right: 0; +} - .center-1.one-fourth { - padding-left: 0.5rem; - padding-right: 0; - } +.center-1.one-fourth {padding-left: 0.5rem; padding-right: 0;} - .center-2.one-fourth { - padding-right: 0.5rem; - padding-left: 0; - } +.center-2.one-fourth { + padding-right: 0.5rem; padding-left: 0; +} } @media only screen and (max-width: 48rem) { - .left.two-thirds, - .left.one-third, - .left.half, - .left.one-fourth, - .left.three-fourths, - .right.two-thirds, - .right.one-third, - .center.one-third, - .center-1.one-fourth, - .center-2.one-fourth, - .right.half, - .right.one-fourth, - .right.three-fourths { - padding-left: 0.5rem; - padding-right: 0.5rem; - } +.left.two-thirds, .left.one-third, .left.half, .left.one-fourth, .left.three-fourths, .right.two-thirds, .right.one-third, .center.one-third, .center-1.one-fourth, .center-2.one-fourth, .right.half, .right.one-fourth, .right.three-fourths { + padding-left: 0.5rem; + padding-right: 0.5rem; +} - .info-block { - margin-bottom: 1rem; - } +.info-block { + margin-bottom: 1rem; +} } @media only screen and (max-width: 30rem) { - .info-block { - padding: 2rem 1rem; - } +.info-block{ + padding: 2rem 1rem; +} } /*************************BUTTONS****************************/ -.btn-fixed, -.btn-auto { +.btn-fixed, .btn-auto { background: none; border: 1px solid #ff7519; text-decoration: none; @@ -990,61 +1637,106 @@ h3:first-of-type { display: inline-block; height: 2.6rem; line-height: 2.7rem; - -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); - -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); - box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); + -moz-box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); + -webkit-box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); + box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); } -a.btn-link:hover, -a.btn-link.active, -a.btn-link:focus { +a.btn-link:hover, a.btn-link.active, a.btn-link:focus { text-decoration: none; outline: 0; } +.btn-link span.icon-windows, .btn-link span.icon-linux, .btn-link span.icon-apple, .btn-link span.icon-blockchain { + height: 2rem; + width: 2rem; + display: inline-block; + margin-right: 0.5rem; + vertical-align: middle; +} + +.btn-link span.icon-windows { + background-image: url(../img/monero-spritesheet.png); + background-position: 0 0; +} + +a.btn-link:hover span.icon-windows, a.btn-link:focus span.icon-windows, a.btn-link.active span.icon-windows { + background-image: url(../img/monero-spritesheet.png); + background-position: -48px 0; +} + +.btn-link span.icon-linux, span.icon-linux { + background-image: url(../img/monero-spritesheet.png); + background-position: 0 -48px; +} + +a.btn-link:hover span.icon-linux, a.btn-link:focus span.icon-linux, a.btn-link.active span.icon-linux { + background-image: url(../img/monero-spritesheet.png); + background-position: -48px -48px; +} + +.btn-link span.icon-apple { + background-image: url(../img/monero-spritesheet.png); + background-position: 0 -96px; +} + +a.btn-link:hover span.icon-apple, a.btn-link:focus span.icon-apple, a.btn-link.active span.icon-apple { + background-image: url(../img/monero-spritesheet.png); + background-position: -48px -96px; +} + +.btn-link span.icon-blockchain { + background-image: url(../img/monero-spritesheet.png); + background-position: 0 -144px; +} + +a.btn-link:hover span.icon-blockchain, a.btn-link:focus span.icon-blockchain, a.btn-link.active span.icon-blockchain { + background-image: url(../img/monero-spritesheet.png); + background-position: -48px -144px; +} + .btn-fixed { width: 15rem; display: block; } -.btn-fixed:hover, -.btn-fixed:active, -.btn-fixed:focus, -.btn-auto:hover, -.btn-auto:active, -.btn-auto:focus { +.btn-fixed:hover, .btn-fixed:active, .btn-fixed:focus, .btn-auto:hover, .btn-auto:active, .btn-auto:focus { background-color: #ff7519; - color: #fff !important; + color: #fff!important; text-decoration: none; } @media only screen and (max-width: 62rem) { - .btn-fixed, - .btn-auto { - font-size: 0.875rem; - } +.btn-fixed, .btn-auto { + font-size: 0.875rem; +} } @media only screen and (max-width: 48rem) { - .btn-fixed, - .btn-auto { - font-size: 1rem; - } +.btn-fixed, .btn-auto { + font-size: 1rem; +} } +@media only screen and (max-width: 30rem) { +.btn-link span#icon-windows, .btn-link span#icon-linux, .btn-link span#icon-apple, .btn-link span#icon-blockchain { + display: none; +} +} + /************************NAVIGATION*************************/ /*DESKTOP NAVIGATION*/ .desktop-nav { background-color: #fff; - -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, .1); - -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, .1); - box-shadow: 0 2px 2px rgba(0, 0, 0, .1); + -moz-box-shadow: 0 2px 2px rgba(0,0,0,.1); + -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.1); + box-shadow: 0 2px 2px rgba(0,0,0,.1); margin-bottom: 4rem; } @@ -1071,9 +1763,7 @@ img.monero-logo { margin-right: -1rem; } -.desktop-nav .items a:hover, -.topnav .topnav-list a:focus, -.topnav .topnav-list a:active { +.desktop-nav .items a:hover, .topnav .topnav-list a:focus, .topnav .topnav-list a:active { color: #a1aabb; text-decoration: none; } @@ -1083,44 +1773,41 @@ img.monero-logo { line-height: 1; } -.burger-check, -.burger-checkdropdown { +.burger-check, .burger-checkdropdown { display: none; } -.white-nav > .nav-items > .nav-item.mob { - display: none; -} +.white-nav>.nav-items>.nav-item.mob {display: none;} @media only screen and (max-width: 75rem) { - .desktop-nav .items a { - font-size: 0.85rem; - padding: 0.8rem 0.5rem; - } +.desktop-nav .items a { + font-size: 0.85rem; + padding: 0.8rem 0.5rem; +} - .desktop-nav .items a:last-of-type { - margin-right: -0.5rem; - } +.desktop-nav .items a:last-of-type { + margin-right: -0.5rem; +} - img.monero-logo { - width: 10rem; - } +img.monero-logo { + width: 10rem; +} } @media only screen and (max-width: 62rem) { - .desktop-nav { - display: none; - } +.desktop-nav { + display: none; +} } /*MOBILE NAVIGATION*/ .mob-nav { - display: none; + display:none; } .mob.bot-nav { @@ -1129,261 +1816,377 @@ img.monero-logo { @media only screen and (max-width: 62rem) { - img.monero-logo { - position: inherit; - width: 10rem; - padding: 0.39rem 0 0.39rem 1rem; - } +img.monero-logo { + position: inherit; + width: 10rem; + padding: 0.39rem 0 0.39rem 1rem; +} - .white-nav { - line-height: 0.5; - display: -ms-flexbox; - display: -webkit-box; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - border-top: none; - border-right: none; - border-left: none; - } +.white-nav { + line-height: 0.5; + display: -ms-flexbox; + display: -webkit-box; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + border-top: none; + border-right: none; + border-left: none; +} + +.white-nav .nav-items { + line-height: 1; +} - .white-nav .nav-items { - line-height: 1; - } +.white-nav>.nav-items>.nav-item.mob {display: initial;} - .white-nav > .nav-items > .nav-item.mob { - display: initial; - } +.nav-items { + display: none; +} - .nav-items { - display: none; - } +.dropdown-content { + display: none; +} - .burger { - display: block; - border: 0; - background: none; - outline: 0; - padding: 0; - cursor: pointer; - border-bottom: 2px solid #4c4c4c; - width: 1.5rem; - align-self: flex-end; - } +.burger { + display: block; + border: 0; + background: none; + outline: 0; + padding: 0; + cursor: pointer; + border-bottom: 2px solid #4c4c4c; + width: 1.5rem; + align-self: flex-end; +} + +.burger::-moz-focus-inner { + border: 0; + padding: 0; +} + +.burger:before { + content: ""; + display: block; + border-bottom: 2px solid #4c4c4c; + width: 100%; + margin-bottom: 5px; + transition: -webkit-transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; + -webkit-transition: -webkit-transform 0.5s ease-in-out; +} + +.burger:after { + content: ""; + display: block; + border-bottom: 2px solid #4c4c4c; + width: 100%; + margin-bottom: 5px; + transition: -webkit-transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; + -webkit-transition: -webkit-transform 0.5s ease-in-out; +} + +.burger-check:checked ~ .burger { + border-bottom: 4px solid transparent; + transition: border-bottom 0.5s ease-in-out; + -webkit-transition: border-bottom 0.5s ease-in-out; +} + +.burger-check:checked ~ .burger:before { + transform: rotate(-405deg) translateY(6px) translateX(-5px); + -webkit-transform: rotate(-405deg) translateY(6px) translateX(-5px); + transition: -webkit-transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; + -webkit-transition: -webkit-transform 0.5s ease-in-out; +} + +.burger-check:checked ~ .burger:after { + transform: rotate(405deg) translateY(0px) translateX(1.3px); + -webkit-transform: rotate(405deg) translateY(0px) translateX(1.3px); + transition: -webkit-transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out; + transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; + -webkit-transition: -webkit-transform 0.5s ease-in-out; +} + +.burger-check:checked ~ .nav-items{ + display: block; +} + +#drop1:checked ~ .dropdown-content, #drop2:checked ~ .dropdown-content, #drop3:checked ~ .dropdown-content, #drop4:checked ~ .dropdown-content { + display: block; + position: inherit; + opacity: 1; + visibility: visible; + box-shadow: none; +} +.burger-check:checked + label { + position: fixed; +} + +.mob-nav { + display: -ms-flexbox; + display: -webkit-box; + display: flex; +} + +.white-nav { + -moz-box-shadow: 0 2px 2px rgba(0,0,0,.1); + -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.1); + box-shadow: 0 2px 2px rgba(0,0,0,.1); +} + +.slide-in-nav { + position: absolute; + top: 0; right: 0; bottom: 0; left: 0; + display: flex; + right: -100%; + left: 200%; + display: -ms-flexbox; + display: -webkit-box; + display: flex; + top: 0; + bottom: 0; + width: 50vw; + background-color: #fff; + -moz-transition: left 0.5s, right 0.5s; + -webkit-transition: left 0.5s, right 0.5s; + transition: left 0.5s, right 0.5s; + overflow: scroll; + z-index: 90; +} + +.slide-in-nav::-webkit-scrollbar { + display: none; +} + +.mob.bot-nav { + display: block; + position: fixed; + width: 100%; + left: 0; + top: 0; + min-height: 3.5rem; + z-index: 100; +} + +label[for="mobile-burger"] { + position: fixed; + top: 1.3rem; + right: 1rem; + z-index: 110; +} + +#mobile-burger:checked ~ .slide-in-nav { + position: fixed; + -moz-box-shadow: 0 0 900px 900px rgba(0,0,0,0.5); + -webkit-box-shadow: 0 0 900px 900px rgba(0,0,0,0.5); + box-shadow: 0 0 900px 900px rgba(0,0,0,0.5); + right: 0; + left: 50%; +} + +#mobile-burger:checked ~ body { + overflow: none; +} + +.slide-in { + padding-top: 3.5rem; + width: 100%; +} + +.mob-nav .nav-item { + position: relative; + text-align: left; + font-family: 'Hind', sans-serif; + font-weight: 500; + font-size: 1.125rem; + cursor: pointer; +} + +.mob-nav .nav-item:checked, .mob-nav .nav-item:focus, .mob-nav .nav-item:active { + -webkit-tap-highlight-color: rgba(0,0,0,0); + -webkit-tap-highlight-color: transparent; +} - .burger::-moz-focus-inner { - border: 0; - padding: 0; - } +.mob-nav .nav-item .arrow-down { + margin-top: 0.8rem; + margin-left: 0.2rem; +} - .burger:before { - content: ""; - display: block; - border-bottom: 2px solid #4c4c4c; - width: 100%; - margin-bottom: 5px; - transition: -webkit-transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; - -webkit-transition: -webkit-transform 0.5s ease-in-out; - } +.mob-nav .nav-item a { + padding: 1rem 0 1rem 2rem; +} - .burger:after { - content: ""; - display: block; - border-bottom: 2px solid #4c4c4c; - width: 100%; - margin-bottom: 5px; - transition: -webkit-transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; - -webkit-transition: -webkit-transform 0.5s ease-in-out; - } +.mob-nav .nav-item a { + -webkit-transition: all ease-out .2s; + -moz-transition: all ease-out .2s; + -o-transition: all ease-out .2s; + transition: all ease-out .2s; + display: block; +} - .burger-check:checked ~ .burger { - border-bottom: 4px solid transparent; - transition: border-bottom 0.5s ease-in-out; - -webkit-transition: border-bottom 0.5s ease-in-out; - } +.mob-nav .nav-item:last-of-type a { + border-top: 3px solid #edeef0; + color: #a1aabb; +} - .burger-check:checked ~ .burger:before { - transform: rotate(-405deg) translateY(6px) translateX(-5px); - -webkit-transform: rotate(-405deg) translateY(6px) translateX(-5px); - transition: -webkit-transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; - -webkit-transition: -webkit-transform 0.5s ease-in-out; - } +.mob-nav .nav-item a:hover .arrow-down, .mob-nav .nav-item a.active .arrow-down, .mob-nav .nav-item a:focus .arrow-down, .mob-nav .nav-item label:hover .arrow-down, .mob-nav .nav-item label:focus .arrow-down, .mob-nav .nav-item label.active .arrow-down { + border-top: 3px solid #ff7519; +} - .burger-check:checked ~ .burger:after { - transform: rotate(405deg) translateY(0px) translateX(1.3px); - -webkit-transform: rotate(405deg) translateY(0px) translateX(1.3px); - transition: -webkit-transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out; - transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out; - -webkit-transition: -webkit-transform 0.5s ease-in-out; - } +.mob-nav .nav-item label, .mob-nav .nav-item>a { + text-decoration: none; + color: #393939; + cursor: pointer; + height: 1.9rem; + line-height: 2.1rem; +} - .burger-check:checked ~ .nav-items { - display: block; - } +.mob-nav .nav-item>a:hover, .mob-nav .nav-item>a:focus, .mob-nav .nav-item>a:active { + color: #a1aabb; +} - .burger-check:checked + label { - position: fixed; - } - .mob-nav { - display: -ms-flexbox; - display: -webkit-box; - display: flex; - } +.mob-nav .nav-item .dropdown-content>a { + text-align: left; + padding: 0.8rem 0rem 0.8rem 3rem; + text-transform: none; + line-height: 1.5rem; + height: 1.5rem; + text-decoration: none; + color: #393939; + cursor: pointer; +} - .white-nav { - -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, .1); - -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, .1); - box-shadow: 0 2px 2px rgba(0, 0, 0, .1); - } - .slide-in-nav { - position: absolute; - right: 0; - bottom: 0; - left: 0; - right: 200%; - left: -100%; - top: -100%; - bottom: 0; - width: 50vw; - background-color: #fff; - overflow: scroll; - z-index: 90; - display: -ms-flexbox; - display: -webkit-box; - display: flex; - } +.mob-nav .nav-item>.dropdown-content>a:hover, .mob-nav .nav-item .dropdown-content>a:focus, .mob-nav .nav-item .dropdown-content>a.active { + color: #ff7519; + background-color: #f5f5f5; +} - .slide-in-nav::-webkit-scrollbar { - display: none; - } +#drop1:checked ~ .dropdown-content, #drop2:checked ~ .dropdown-content, #drop3:checked ~ .dropdown-content, #drop4:checked ~ .dropdown-content { + background-color: #fcfcfc; +} - .mob.bot-nav { - display: block; - position: fixed; - width: 100%; - left: 0; - top: 0; - min-height: 3.5rem; - z-index: 100; - } +.mob-language-change, .mob-language-change label { + cursor: pointer; +} - label[for="mobile-burger"] { - position: fixed; - top: 1.3rem; - right: 1rem; - z-index: 110; - } +.mob-language-change img.icon-language{ + width: 1.5rem; +} - #mobile-burger:checked ~ .slide-in-nav { - position: fixed; - -moz-box-shadow: 0 0 900px 900px rgba(0, 0, 0, 0.5); - -webkit-box-shadow: 0 0 900px 900px rgba(0, 0, 0, 0.5); - box-shadow: 0 0 900px 900px rgba(0, 0, 0, 0.5); - right: 0; - left: 50%; - top: 0; - } +#moblangdrop:checked ~ .dropdown-content { + display: block; + position: inherit; + opacity: 1; + visibility: visible; + box-shadow: none; + top: 2.92rem; + left: 0; + right: 0; + text-align: center; + width: inherit; + margin-top: 0.6rem; + background-color: #fff; +} +label[for="moblangdrop"] { + display: block; + margin-right: 0.5rem; + padding: 0.5rem; +} - #mobile-burger:checked ~ body { - overflow: none; - } +label[for="moblangdrop"], label[for="moblangdrop"]:checked, #moblangdrop, #moblangdrop:checked { + -webkit-tap-highlight-color: rgba(0,0,0,0); + -webkit-tap-highlight-color: transparent; +} - .slide-in { - padding-top: 3.5rem; - width: 100%; - } +#moblangdrop:checked ~ label { + background-color: transparent; +} - .mob-nav .nav-item { - position: relative; - text-align: left; - font-family: 'Hind', sans-serif; - font-weight: 500; - font-size: 1.125rem; - cursor: pointer; - } +#moblangdrop ~ label .arrow-down { + display: inline-block; + margin-left: 0.2rem; + margin-bottom: 0.6rem; + border-top: 3px solid #393939; +} - .mob-nav .nav-item:checked, - .mob-nav .nav-item:focus, - .mob-nav .nav-item:active { - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); - -webkit-tap-highlight-color: transparent; - } +#moblangdrop:checked ~ label .arrow-down { + border-bottom: 3px solid #393939; + border-top: 0; +} - .mob-nav .nav-item a { - padding: 1rem 0 1rem 2rem; - } +.burger-check:checked + label { + position: fixed; +} - .mob-nav .nav-item a { - -webkit-transition: all ease-out .2s; - -moz-transition: all ease-out .2s; - -o-transition: all ease-out .2s; - transition: all ease-out .2s; - display: block; - } +.nav-item > label { + display: flex; +} - .mob-nav .nav-item:last-of-type a { - border-top: 3px solid #edeef0; - color: #a1aabb; - } +.white-nav .mob-language-change { + position: fixed; + right: 0; + align-self: center; + font-family: 'Open Sans', sans-serif; +} - .mob-nav .nav-item label, - .mob-nav .nav-item > a { - text-decoration: none; - color: #393939; - cursor: pointer; - height: 1.9rem; - line-height: 2.1rem; - } +.white-nav .mob-language-change label { + color: #393939; +} - .mob-nav .nav-item > a:hover, - .mob-nav .nav-item > a:focus, - .mob-nav .nav-item > a:active { - color: #a1aabb; - } +p.mob-lang-change { + padding: 0.8rem; + color: #d7d7d7; + border-bottom: 1px solid #d7d7d7; + border-top: 1px solid #d7d7d7; + cursor: default; +} - .burger-check:checked + label { - position: fixed; - } +a.mob-lang-change { + padding: 0.8rem; + color: #393939; + border-bottom: 1px solid #e8ebef; + line-height: 1.7; +} - .nav-item > label { - display: flex; - } +a.mob-lang-change:hover, a.mob-lang-change.active, a.mob-lang-change:focus { + color: #ff7519; + text-decoration: none; +} } @media only screen and (max-width: 48rem) { - .white-nav { - margin-bottom: 0; - } +.white-nav { + margin-bottom: 0; +} - .burger-check:checked ~ .nav-items { - display: block; - height: 100vh; - } +.burger-check:checked ~ .nav-items{ + display: block; + height: 100vh; +} } @media only screen and (max-width: 30rem) { - img.monero-logo { - width: 9rem; - padding-top: 0.527rem; - } +img.monero-logo { + width: 9rem; + padding-top: 0.527rem; +} - #mobile-burger:checked ~ .slide-in-nav { - width: 100vw; - left: 0; - } +#mobile-burger:checked ~ .slide-in-nav { + width: 100vw; + left: 0; +} } @@ -1417,8 +2220,7 @@ footer a.white { font-size: 0.9375rem; } -footer a.white:hover, -a.white:focus { +footer a.white:hover, a.white:focus { color: #ff7519; text-decoration: underline; } @@ -1440,62 +2242,65 @@ a.white:focus { padding: 0 1rem; } +@media only screen and (max-width: 75rem) { + +} @media only screen and (max-width: 62rem) { - .page-wrapper { - position: relative; - min-height: 100vh; - } +.page-wrapper { + position: relative; + min-height: 100vh; +} - footer { - width: 100%; - background-color: #4c4c4c; - color: #efefef; - z-index: 1; - } +footer { + width: 100%; + background-color: #4c4c4c; + color: #efefef; + z-index: 1; +} } @media only screen and (max-width: 48rem) { - .page-wrapper { - position: initial; - min-height: 100vh; - } +.page-wrapper { + position: initial; + min-height: 100vh; +} - footer { - position: initial; - width: 100%; - height: auto; - background-color: #4c4c4c; - color: #efefef; - z-index: 1; - } +footer { + position: initial; + width: 100%; + height: auto; + background-color: #4c4c4c; + color: #efefef; + z-index: 1; +} - .footer-wrapper { - padding: 2.5rem; - } +.footer-wrapper { + padding: 2.5rem; +} - .footer-wrapper div.col-xs-6 { - margin-bottom: 1.5rem; - padding-right: 1rem; - } +.footer-wrapper div.col-xs-6 { + margin-bottom: 1.5rem; + padding-right: 1rem; +} } @media only screen and (max-width: 30rem) { - .footer-wrapper { - padding: 2rem 2rem 0 2rem; - } +.footer-wrapper { + padding: 2rem 2rem 0 2rem; +} - .footer-wrapper div.col-xs-6 { - -ms-flex-preferred-size: 100%; - max-width: 100%; - flex-basis: 100%; - padding-right: 0; - } +.footer-wrapper div.col-xs-6 { + -ms-flex-preferred-size: 100%; + max-width: 100%; + flex-basis: 100%; + padding-right: 0; +} } @@ -1512,22 +2317,12 @@ a.white:focus { border-radius: 2px; } -.ffs a, -.ffs-proposal a, -.ffs-main a { +.ffs a, .ffs-proposal a, .ffs-main a { color: #000; border-bottom: 2px dotted #a1aabb; } -.ffs a:hover, -.ffs-proposal a:hover, -.ffs a:focus, -.ffs-proposal a:focus, -.ffs a:active, -.ffs-proposal a:active, -.ffs-main a:hover, -.ffs-main a:focus, -.ffs-main a:active { +.ffs a:hover, .ffs-proposal a:hover, .ffs a:focus, .ffs-proposal a:focus, .ffs a:active, .ffs-proposal a:active, .ffs-main a:hover, .ffs-main a:focus, .ffs-main a:active { border-bottom: 2px solid #a1aabb; text-decoration: none; } @@ -1574,9 +2369,9 @@ a.white:focus { border: 3px dotted #dbdfe1; border: none; border-radius: 6px; - -moz-box-shadow: 0 0 20px rgba(50, 50, 93, .4); - -webkit-box-shadow: 0 0 20px rgba(50, 50, 93, .4); - box-shadow: 0 0 20px rgba(50, 50, 93, .4); + -moz-box-shadow: 0 0 20px rgba(50,50,93,.4); + -webkit-box-shadow: 0 0 20px rgba(50,50,93,.4); + box-shadow: 0 0 20px rgba(50,50,93,.4); margin-bottom: 1rem; flex: 1; -webkit-flex: 1; @@ -1593,12 +2388,10 @@ a.white:focus { align-items: center; } -.ffs-main a.ffs-cat:hover, -.ffs-main a.ffs-cat:active, -.ffs-main a.ffs-cat:focus { - -moz-box-shadow: 0 0 40px rgba(50, 50, 93, .4); - -webkit-box-shadow: 0 0 40px rgba(50, 50, 93, .4); - box-shadow: 0 0 40px rgba(50, 50, 93, .4); +.ffs-main a.ffs-cat:hover, .ffs-main a.ffs-cat:active, .ffs-main a.ffs-cat:focus { + -moz-box-shadow: 0 0 40px rgba(50,50,93,.4); + -webkit-box-shadow: 0 0 40px rgba(50,50,93,.4); + box-shadow: 0 0 40px rgba(50,50,93,.4); } .ffs-main .half:nth-of-type(1) a { @@ -1635,112 +2428,112 @@ a.white:focus { @media only screen and (max-width: 62rem) { - .ffs-main h1 { - margin: 1.5rem 0 1.3rem 0; - } +.ffs-main h1 { + margin: 1.5rem 0 1.3rem 0; +} - .ffs-main .container { - margin-left: 1rem; - margin-right: 1rem; - } +.ffs-main .container { + margin-left: 1rem; + margin-right: 1rem; +} - .ffs-main a.ffs-cat { - padding: 1.5rem; - } +.ffs-main a.ffs-cat { + padding: 1.5rem; +} - .ffs-main a.ffs-cat h2 { - font-size: 1.3rem; - } +.ffs-main a.ffs-cat h2 { + font-size: 1.3rem; +} - .ffs-main a.ffs-cat p { - font-size: 0.9rem; - } +.ffs-main a.ffs-cat p { + font-size: 0.9rem; +} - .container.description p { - margin-bottom: 2rem; - } +.container.description p { + margin-bottom: 2rem; +} } @media only screen and (max-width: 48rem) { - .ffs-main h1 { - margin-top: 1rem; - font-size: 1.8rem; - } +.ffs-main h1 { + margin-top: 1rem; + font-size: 1.8rem; +} - .ffs-main .half:nth-child(even) { - padding-left: 0; - } +.ffs-main .half:nth-child(even) { + padding-left: 0; +} - .ffs-main .half:nth-child(odd) { - padding-right: 0; - } +.ffs-main .half:nth-child(odd) { + padding-right: 0; +} } @media only screen and (max-width: 41rem) { - .ffs-main h1 { - font-size: 1.6rem; - margin-bottom: 1rem; - } +.ffs-main h1 { + font-size: 1.6rem; + margin-bottom: 1rem; +} - .container.description p { - padding: 0 1.5rem; - font-size: 0.9rem; - margin-bottom: 2rem; - text-align: left; - } +.container.description p { + padding: 0 1.5rem; + font-size: 0.9rem; + margin-bottom: 2rem; + text-align: left; +} } @media only screen and (max-width: 30rem) { - h1 { - padding: 0 2.5rem; - font-size: 1.5rem; - line-height: 1.3; - } +h1 { + padding: 0 2.5rem; + font-size: 1.5rem; + line-height: 1.3; +} - .container.description p { - padding: 0; - text-align: left; - font-size: 0.9rem; - margin-bottom: 2rem; - } +.container.description p { + padding: 0; + text-align: left; + font-size: 0.9rem; + margin-bottom: 2rem; +} - .ffs-main .ffs-cat .col-xs-4 { - display: none; - } +.ffs-main .ffs-cat .col-xs-4 { + display: none; +} - .ffs-main .ffs-cat .col-xs-8 { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - padding-left: 0; - } +.ffs-main .ffs-cat .col-xs-8 { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + padding-left: 0; +} - .ffs-main a.ffs-cat { - border: none; - border-radius: 6px; - } +.ffs-main a.ffs-cat { + border: none; + border-radius: 6px; +} - .ffs-main .half:nth-of-type(1) a.ffs-cat { - border-top: 6px solid #e8c24f; - } +.ffs-main .half:nth-of-type(1) a.ffs-cat { + border-top: 6px solid #e8c24f; +} - .ffs-main .half:nth-of-type(2) a.ffs-cat { - border-top: 6px solid #f28080; - } +.ffs-main .half:nth-of-type(2) a.ffs-cat { + border-top: 6px solid #f28080; +} - .ffs-main .half:nth-of-type(3) a.ffs-cat { - border-top: 6px solid #3a72aa; - } +.ffs-main .half:nth-of-type(3) a.ffs-cat { + border-top: 6px solid #3a72aa; +} - .ffs-main .half:nth-of-type(4) a.ffs-cat { - border-top: 6px solid #70af71; - } +.ffs-main .half:nth-of-type(4) a.ffs-cat { + border-top: 6px solid #70af71; +} } @@ -1762,23 +2555,20 @@ a.white:focus { font-family: 'Open Sans', sans-serif; font-weight: 700; font-size: 0.8rem; - -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); - -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); - box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); + -moz-box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); + -webkit-box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); + box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); -webkit-transition: background .15s ease, box-shadow .15s ease; -moz-transition: background .15s ease, box-shadow .15s ease; -o-transition: background .15s ease, box-shadow .15s ease; transition: background .15s ease, box-shadow .15s ease; } -.ffs-breadcrumbs p.submit-idea a:hover, -.ffs-breadcrumbs p.submit-idea a:focus, -.ffs-breadcrumbs p.submit-idea a:active { +.ffs-breadcrumbs p.submit-idea a:hover, .ffs-breadcrumbs p.submit-idea a:focus, .ffs-breadcrumbs p.submit-idea a:active { background-color: #ce5e14; } -.ffs-breadcrumbs p.submit-idea a:after, -.ffs-breadcrumbs p.submit-idea a:before { +.ffs-breadcrumbs p.submit-idea a:after, .ffs-breadcrumbs p.submit-idea a:before { display: none; } @@ -1790,9 +2580,9 @@ a.white:focus { background-color: #ffffff; padding: 2.5rem; border-radius: 6px; - -moz-box-shadow: 0 0 20px rgba(50, 50, 93, .4); - -webkit-box-shadow: 0 0 20px rgba(50, 50, 93, .4); - box-shadow: 0 0 20px rgba(50, 50, 93, .4); + -moz-box-shadow: 0 0 20px rgba(50,50,93,.4); + -webkit-box-shadow: 0 0 20px rgba(50,50,93,.4); + box-shadow: 0 0 20px rgba(50,50,93,.4); margin-bottom: 1rem; flex: 1; -webkit-flex: 1; @@ -1807,30 +2597,21 @@ a.white:focus { border-bottom: none; } -.ffs a.ffs-idea:hover, -.ffs a.ffs-idea:focus, -.ffs a.ffs-idea:active { - -moz-box-shadow: 0 0 40px rgba(50, 50, 93, .4); - -webkit-box-shadow: 0 0 40px rgba(50, 50, 93, .4); - box-shadow: 0 0 40px rgba(50, 50, 93, .4); +.ffs a.ffs-idea:hover, .ffs a.ffs-idea:focus, .ffs a.ffs-idea:active { + -moz-box-shadow: 0 0 40px rgba(50,50,93,.4); + -webkit-box-shadow: 0 0 40px rgba(50,50,93,.4); + box-shadow: 0 0 40px rgba(50,50,93,.4); border-bottom: none; } -.ffs p.author-list span img, -.ffs p.date-list span img, -.ffs-proposal p.author-list span img, -.ffs-proposal p.date-list span img, -.ffs-proposal p.progress-number-goal span img { +.ffs p.author-list span img, .ffs p.date-list span img, .ffs-proposal p.author-list span img, .ffs-proposal p.date-list span img, .ffs-proposal p.progress-number-goal span img { height: 0.8rem; width: 0.8rem; margin-right: 0.3rem; vertical-align: baseline; } -.ffs p.author-list, -.ffs p.date-list, -.ffs-proposal p.author-list, -.ffs-proposal p.date-list { +.ffs p.author-list, .ffs p.date-list, .ffs-proposal p.author-list, .ffs-proposal p.date-list { padding-top: 0; font-size: 1.1rem; color: #9ca1ac; @@ -1839,20 +2620,14 @@ a.white:focus { vertical-align: middle; } -p.author-list, -p.date-list, -p.progress-number-goal, -p.bar-work-status { +p.author-list, p.date-list, p.progress-number-goal, p.bar-work-status { box-sizing: border-box; -ms-flex: 0 0 auto; -webkit-box-flex: 0; flex: 0 0 auto; } -.ideas p.author-list, -.ideas p.date-list, -.complete-proposal p.author-list, -.complete-proposal p.date-list { +.ideas p.author-list, .ideas p.date-list, .complete-proposal p.author-list, .complete-proposal p.date-list { -ms-flex-preferred-size: 30%; flex-basis: 30%; max-width: 30%; @@ -1862,115 +2637,92 @@ p.bar-work-status { padding-top: 1.5rem; } -.ffs .ideas p.list-button, -.ffs .fund-required p.list-button, -.ffs .in-progress p.list-button, -.ffs .complete-proposal p.list-button { +.ffs .ideas p.list-button, .ffs .fund-required p.list-button, .ffs .in-progress p.list-button, .ffs .complete-proposal p.list-button { padding-top: 0; text-align: right; } -.ideas h1, -.fund-required h1, -.in-progress h1, -.complete-proposal h1 { +.ideas h1, .fund-required h1, .in-progress h1, .complete-proposal h1 { display: none; } +@media only screen and (max-width: 75rem) { + +} + @media only screen and (max-width: 62rem) { - .ideas h1, - .fund-required h1, - .in-progress h1, - .complete-proposal h1 { - display: initial; - display: block; - text-align: left; - margin: 1.5rem 1rem 1.3rem 3.5rem; - font-size: 2rem; - padding: 0; - } +.ideas h1, .fund-required h1, .in-progress h1, .complete-proposal h1 { + display: initial; + display: block; + text-align: left; + margin: 1.5rem 1rem 1.3rem 3.5rem; + font-size: 2rem; + padding: 0; +} - .ffs a.ffs-idea { - margin-left: 1rem; - margin-right: 1rem; - } +.ffs a.ffs-idea { + margin-left: 1rem; + margin-right: 1rem; +} - .ideas p.author-list, - .ideas p.date-list, - .complete-proposal p.author-list, - .complete-proposal p.date-list { - -ms-flex-preferred-size: 40%; - flex-basis: 40%; - max-width: 40%; - font-size: 1rem; - } +.ideas p.author-list, .ideas p.date-list, .complete-proposal p.author-list, .complete-proposal p.date-list { + -ms-flex-preferred-size: 40%; + flex-basis: 40%; + max-width: 40%; + font-size: 1rem; +} } @media only screen and (max-width: 48rem) { - .ideas h1, - .fund-required h1, - .in-progress h1, - .complete-proposal h1 { - font-size: 1.8rem; - margin-top: 1rem; - } +.ideas h1, .fund-required h1, .in-progress h1, .complete-proposal h1 { + font-size: 1.8rem; + margin-top: 1rem; +} - .ffs .ffs-idea { - margin-left: 1rem; - margin-right: 1rem; - } +.ffs .ffs-idea { + margin-left: 1rem; + margin-right: 1rem; +} - .ideas p.author-list, - .ideas p.date-list, - .complete-proposal p.author-list, - .complete-proposal p.date-list { - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50%; - font-size: 0.9rem; - padding-top: 0.3rem; - } +.ideas p.author-list, .ideas p.date-list, .complete-proposal p.author-list, .complete-proposal p.date-list { + -ms-flex-preferred-size: 50%; + flex-basis: 50%; + max-width: 50%; + font-size: 0.9rem; + padding-top: 0.3rem; +} } @media only screen and (max-width: 41rem) { - .ideas h1, - .fund-required h1, - .in-progress h1, - .complete-proposal h1 { - margin-left: 2.5rem; - margin-bottom: 0.5rem; - font-size: 1.6rem; - } +.ideas h1, .fund-required h1, .in-progress h1, .complete-proposal h1 { + margin-left: 2.5rem; + margin-bottom: 0.5rem; + font-size: 1.6rem; +} } @media only screen and (max-width: 30rem) { - .ideas h1, - .fund-required h1, - .in-progress h1, - .complete-proposal h1 { - margin-top: 0.5rem; - } +.ideas h1, .fund-required h1, .in-progress h1, .complete-proposal h1 { + margin-top: 0.5rem; +} } @media only screen and (max-width: 28rem) { - .ideas p.author-list, - .ideas p.date-list, - .complete-proposal p.author-list, - .complete-proposal p.date-list { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - padding-top: 0.7rem; - } +.ideas p.author-list, .ideas p.date-list, .complete-proposal p.author-list, .complete-proposal p.date-list { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + padding-top: 0.7rem; +} } @@ -1989,22 +2741,13 @@ p.bar-work-status { margin-top: 1.5rem; } -.fund-required p.author-list, -.fund-required p.date-list, -.ffs-fr p.author-list, -.ffs-fr p.date-list, -.ffs-con p.author-list, -.ffs-con p.date-list { +.fund-required p.author-list, .fund-required p.date-list, .ffs-fr p.author-list, .ffs-fr p.date-list, .ffs-con p.author-list, .ffs-con p.date-list { -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } -.fund-required p.bar-fund-status, -.ffs-fr p.bar-fund-status, -.ffs-con p.bar-fund-status, -.ffs-con p.bar-fund-status, -.ffs-con p.bar-fund-status { +.fund-required p.bar-fund-status, .ffs-fr p.bar-fund-status, .ffs-con p.bar-fund-status, .ffs-con p.bar-fund-status, .ffs-con p.bar-fund-status { -ms-flex-preferred-size: 40%; flex-basis: 40%; max-width: 40%; @@ -2014,11 +2757,7 @@ p.bar-work-status { padding-top: 0.5rem; } -.fund-required p.bar-fund-status, -.ffs-proposal p.bar-fund-status, -.in-progress p.bar-work-status, -.ffs-proposal p.bar-work-status, -.ffs-con p.bar-fund-status { +.fund-required p.bar-fund-status, .ffs-proposal p.bar-fund-status, .in-progress p.bar-work-status, .ffs-proposal p.bar-work-status, .ffs-con p.bar-fund-status { padding-top: 0; font-weight: bold; font-family: 'Open Sans', sans-serif; @@ -2037,111 +2776,85 @@ p.bar-work-status { @media only screen and (max-width: 62rem) { - .fund-required p.author-list, - .fund-required p.date-list, - .ffs-fr p.author-list, - .ffs-fr p.date-list, - .ffs-con p.author-list, - .ffs-con p.date-list { - -ms-flex-preferred-size: 29%; - flex-basis: 29%; - max-width: 29%; - font-size: 1rem; - } +.fund-required p.author-list, .fund-required p.date-list, .ffs-fr p.author-list, .ffs-fr p.date-list, .ffs-con p.author-list, .ffs-con p.date-list { + -ms-flex-preferred-size: 29%; + flex-basis: 29%; + max-width: 29%; + font-size: 1rem; +} - .fund-required p.bar-fund-status, - .ffs-fr p.bar-fund-status, - .ffs-con p.bar-fund-status { - -ms-flex-preferred-size: 40%; - flex-basis: 40%; - max-width: 40%; - font-size: 1rem; - } +.fund-required p.bar-fund-status, .ffs-fr p.bar-fund-status, .ffs-con p.bar-fund-status { + -ms-flex-preferred-size: 40%; + flex-basis: 40%; + max-width: 40%; + font-size: 1rem; +} } @media only screen and (max-width: 48rem) { - .fund-required p.author-list, - .ffs-fr p.author-list, - .ffs-con p.author-list, - .ffs-con p.date-list { - -ms-flex-preferred-size: 40%; - flex-basis: 40%; - max-width: 40%; - font-size: 0.9rem; - padding-top: 0; - } +.fund-required p.author-list, .ffs-fr p.author-list, .ffs-con p.author-list, .ffs-con p.date-list { + -ms-flex-preferred-size: 40%; + flex-basis: 40%; + max-width: 40%; + font-size: 0.9rem; + padding-top: 0; +} - .fund-required p.date-list, - .ffs-fr p.date-list { - -ms-flex-preferred-size: 20%; - flex-basis: 20%; - max-width: 20%; - font-size: 0.9rem; - padding-top: 0; - } +.fund-required p.date-list, .ffs-fr p.date-list { + -ms-flex-preferred-size: 20%; + flex-basis: 20%; + max-width: 20%; + font-size: 0.9rem; + padding-top: 0; +} - .fund-required p.bar-fund-status, - .ffs-fr p.bar-fund-status, - .ffs-con p.bar-fund-status { - -ms-flex-preferred-size: 40%; - flex-basis: 40%; - max-width: 40%; - text-align: right; - font-size: 0.9rem; - padding-top: 0; - } +.fund-required p.bar-fund-status, .ffs-fr p.bar-fund-status, .ffs-con p.bar-fund-status { + -ms-flex-preferred-size: 40%; + flex-basis: 40%; + max-width: 40%; + text-align: right; + font-size: 0.9rem; + padding-top: 0; +} } @media only screen and (max-width: 41rem) { - .fund-required .between-xs, - .ffs-fr .between-xs { - -ms-flex-pack: start; - -webkit-box-pack: start; - justify-content: flex-start; - text-align: start; - } +.fund-required .between-xs, .ffs-fr .between-xs { + -ms-flex-pack: start; + -webkit-box-pack: start; + justify-content: flex-start; + text-align: start; +} - .fund-required p.author-list, - .fund-required p.date-list, - .ffs-fr p.author-list, - .ffs-fr p.date-list, - .ffs-con p.author-list, - .ffs-con p.date-list { - padding-top: 0.3rem; - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50%; - } +.fund-required p.author-list, .fund-required p.date-list, .ffs-fr p.author-list, .ffs-fr p.date-list, .ffs-con p.author-list, .ffs-con p.date-list { + padding-top: 0.3rem; + -ms-flex-preferred-size: 50%; + flex-basis: 50%; + max-width: 50%; +} - .fund-required p.bar-fund-status, - .ffs-fr p.bar-fund-status, - .ffs-con p.bar-fund-status { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - text-align: left; - margin-top: 1rem; - } +.fund-required p.bar-fund-status, .ffs-fr p.bar-fund-status, .ffs-con p.bar-fund-status { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + text-align: left; + margin-top: 1rem; +} } @media only screen and (max-width: 30rem) { - .fund-required p.author-list, - .fund-required p.date-list, - .ffs-fr p.author-list, - .ffs-fr p.date-list, - .ffs-con p.author-list, - .ffs-con p.date-list { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - padding-top: 0.7rem; - } +.fund-required p.author-list, .fund-required p.date-list, .ffs-fr p.author-list, .ffs-fr p.date-list, .ffs-con p.author-list, .ffs-con p.date-list { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + padding-top: 0.7rem; +} } /* FFS FUNDING REQUIRED SINGLE */ @@ -2175,9 +2888,9 @@ p.bar-work-status { white-space: nowrap; padding: 0 1rem; cursor: pointer; - -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); - -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); - box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .07), 0 7px 17px 0 rgba(0, 0, 0, .1); + -moz-box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); + -webkit-box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); + box-shadow: 0 1px 5px 0 rgba(0,0,0,.07), 0 7px 17px 0 rgba(0,0,0,.1); border: none; display: block; -webkit-transition: background .15s ease, box-shadow .15s ease; @@ -2192,9 +2905,7 @@ p.bar-work-status { color: #ffffff; } -.ffs-proposal .btn-primary:hover, -.ffs-proposal .btn-primary:active, -.ffs-proposal .btn-primary:focus { +.ffs-proposal .btn-primary:hover, .ffs-proposal .btn-primary:active, .ffs-proposal .btn-primary:focus { background-color: #ce5e14; color: #ffffff; border: none !important; @@ -2204,80 +2915,80 @@ p.bar-work-status { } .tabs { - display: flex; - flex-wrap: wrap; + display: flex; + flex-wrap: wrap; } .input { - position: absolute; - opacity: 0; + position: absolute; + opacity: 0; } .label { - width: 33.333%; - padding: 1rem 0; - text-align: center; - background: #c6ccd6; - cursor: pointer; - font-weight: bold; - font-size: 18px; - color: #4c4c4c; - transition: background 0.1s, color 0.1s; - font-family: 'Hind', sans-serif; - -moz-box-shadow: 0 0 4px rgba(50, 50, 93, .1); - -webkit-box-shadow: 0 0 4px rgba(50, 50, 93, .1); - box-shadow: 0 0 4px rgba(50, 50, 93, .1); -} - -.ffs-fr .label { + width: 33.333%; + padding: 1rem 0; + text-align: center; + background: #c6ccd6; + cursor: pointer; + font-weight: bold; + font-size: 18px; + color: #4c4c4c; + transition: background 0.1s, color 0.1s; + font-family: 'Hind', sans-serif; + -moz-box-shadow: 0 0 4px rgba(50,50,93,.1); + -webkit-box-shadow: 0 0 4px rgba(50,50,93,.1); + box-shadow: 0 0 4px rgba(50,50,93,.1); +} + +.ffs-fr .label, .ffs-con .label { width: 50%; } .label:hover { - background: #a1aabb; + background: #a1aabb; } .label:active { - background: #a1aabb; + background: #a1aabb; } .input:focus + .label { - z-index: 1; + z-index: 1; } .input:checked + .label { - background: #fff; - color: #4c4c4c; + background: #fff; + color: #4c4c4c; } @media (max-width: 600px) { - .label { - width: 100%; - margin-bottom: 1rem; - } - - .input:checked + .label { - margin-bottom: 0; - } + .label { + width: 100%; + margin-bottom: 1rem; + } + + .input:checked + .label { + margin-bottom: 0; +} - .ffs-fr .label { - width: 100%; - } +.ffs-fr .label, .ffs-con .label { + width: 100%; +} } .panel { - display: none; - order: 99; - z-index: 10; + display: none; + order: 99; + z-index: 10; } .panel-segment { - padding: 4rem 4rem; - background-color: #ffffff; - -moz-box-shadow: 0 2px 4px rgba(50, 50, 93, .1); - -webkit-box-shadow: 0 2px 4px rgba(50, 50, 93, .1); - box-shadow: 0 2px 4px rgba(50, 50, 93, .1); - margin-top: 0; + padding: 4rem 4rem; + background-color: #ffffff; + -moz-box-shadow: 0 2px 4px rgba(50,50,93,.1); + -webkit-box-shadow: 0 2px 4px rgba(50,50,93,.1); + box-shadow: 0 2px 4px rgba(50,50,93,.1); + margin-top: 0; } .panel-segment:last-child { @@ -2302,16 +3013,14 @@ p.bar-work-status { line-height: 1.7; } -.panel-segment ul, -.panel-segment ol { +.panel-segment ul, .panel-segment ol { padding-top: 0; padding-bottom: 0; margin-top: 0; margin-bottom: 0; } -.panel-segment ul li, -.panel-segment ol li { +.panel-segment ul li, .panel-segment ol li { font-size: 1.1rem; line-height: 1.7; padding-top: 1rem; @@ -2347,97 +3056,97 @@ p.bar-work-status { } .input:checked + .label + .panel { - display: block; + display: block; } @media only screen and (max-width: 75rem) { + +.ffs-proposal .info-block { + padding: 3rem; +} - .ffs-proposal .info-block { - padding: 3rem; - } - - .panel-segment { - padding: 3rem; - } - - .milestone.panel-segment { - padding: 0 3rem 3rem 3rem; - } - - .milestone.panel-segment:first-of-type, - .milestone.panel-segment:after { - padding-top: 3rem; - } - - .panel-segment h3 { - font-size: 1.3rem; - margin-top: 2rem; - } - - .panel-segment p, - .panel-segment ul li, - .panel-segment ol li { - padding-top: 0.5rem; - } - +.panel-segment { + padding: 3rem; } -@media only screen and (max-width: 62rem) {} +.milestone.panel-segment { + padding: 0 3rem 3rem 3rem; +} -@media only screen and (max-width: 48rem) { +.milestone.panel-segment:first-of-type, .milestone.panel-segment:after { + padding-top: 3rem; +} - .ffs-proposal .info-block, - .panel-segment { - padding: 2rem; - } +.panel-segment h3 { + font-size: 1.3rem; + margin-top: 2rem; +} - .milestone.panel-segment { - padding: 0 2rem 2rem 2rem; - } +.panel-segment p, .panel-segment ul li, .panel-segment ol li { + padding-top: 0.5rem; +} + +} - .milestone.panel-segment:first-of-type, - .milestone.panel-segment:after { - padding-top: 2rem; - } +@media only screen and (max-width: 62rem) { - .panel-segment p { - font-size: 1rem; - } - .panel-segment h3 { - font-size: 1.3rem; - margin-top: 1.5rem; - } } -@media (max-width: 600px) { - .panel { - order: 0; - } +@media only screen and (max-width: 48rem) { + +.ffs-proposal .info-block, .panel-segment { + padding: 2rem; +} - .panel-segment:first-of-type, - .milestone.panel-segment:first-of-type {} +.milestone.panel-segment { + padding: 0 2rem 2rem 2rem; +} - .input:checked + .label { - padding-bottom: 0; - } +.milestone.panel-segment:first-of-type, .milestone.panel-segment:after { + padding-top: 2rem; +} - .input:checked + .label:after { - content: ''; - width: 100%; - display: block; - border-bottom: 1.5px solid #edeef0; - padding-bottom: 1rem; - } +.panel-segment p { + font-size: 1rem; +} - .panel-segment ol { - padding-left: 1rem; - } +.panel-segment h3 { + font-size: 1.3rem; + margin-top: 1.5rem; +} + +} - .panel-segment ul { - padding-left: 0; - } +@media (max-width: 600px) { + .panel { + order: 0; + } + + .panel-segment:first-of-type, .milestone.panel-segment:first-of-type { + + } + + .input:checked + .label { + padding-bottom: 0; + } + + .input:checked + .label:after { + content: ''; + width: 100%; + display: block; + border-bottom: 1.5px solid #edeef0; + padding-bottom: 1rem; + } + + .panel-segment ol { + padding-left: 1rem; + } + + .panel-segment ul { + padding-left: 0; + } } /* FFS CONTRIBUTE PAGE */ @@ -2454,16 +3163,13 @@ p.bar-work-status { font-weight: 700; } -.ffs-con .qr, -.ffs-con .qr:hover, -.ffs-con .qr:focus, -.ffs-con .qr:active { +.ffs-con .qr, .ffs-con .qr:hover, .ffs-con .qr:focus, .ffs-con .qr:active { border: none; border-radius: 10px; display: inline-block; - -moz-box-shadow: 0 0 20px rgba(50, 50, 93, .4); - -webkit-box-shadow: 0 0 20px rgba(50, 50, 93, .4); - box-shadow: 0 0 20px rgba(50, 50, 93, .4); + -moz-box-shadow: 0 0 20px rgba(50,50,93,.4); + -webkit-box-shadow: 0 0 20px rgba(50,50,93,.4); + box-shadow: 0 0 20px rgba(50,50,93,.4); margin-bottom: 1rem; margin-top: 1rem; } @@ -2476,21 +3182,21 @@ p.bar-work-status { @media (max-width: 600px) { - .ffs-con .panel { - display: initial; - } +.ffs-con .panel { + display: initial; +} - .ffs-con .input:checked + .label, - .ffs-con .input + .label { - display: none; - } +.ffs-con .input:checked + .label, .ffs-con .input + .label { + display: none; +} - .ffs-con .qr img { - max-width: 100%; - } +.ffs-con .qr img { + max-width: 100%; +} } + /* FFS WORK IN PROGRESS LIST */ .ffs .in-progress a.ffs-idea { @@ -2508,8 +3214,7 @@ p.bar-work-status { font-family: 'Open Sans', sans-serif; } -.in-progress p.author-list, -.in-progress p.date-list { +.in-progress p.author-list, .in-progress p.date-list { -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; @@ -2523,197 +3228,152 @@ p.bar-work-status { @media only screen and (max-width: 62rem) { - .in-progress p.author-list, - .in-progress p.date-list { - -ms-flex-preferred-size: 29%; - flex-basis: 29%; - max-width: 29%; - font-size: 1rem; - } +.in-progress p.author-list, .in-progress p.date-list { + -ms-flex-preferred-size: 29%; + flex-basis: 29%; + max-width: 29%; + font-size: 1rem; +} - .in-progress p.bar-work-status { - -ms-flex-preferred-size: 40%; - flex-basis: 40%; - max-width: 40%; - font-size: 1rem; - } +.in-progress p.bar-work-status { + -ms-flex-preferred-size: 40%; + flex-basis: 40%; + max-width: 40%; + font-size: 1rem; +} } @media only screen and (max-width: 48rem) { - .in-progress p.author-list { - -ms-flex-preferred-size: 35%; - flex-basis: 35%; - max-width: 35%; - font-size: 0.9rem; - padding-top: 0; - } +.in-progress p.author-list { + -ms-flex-preferred-size: 35%; + flex-basis: 35%; + max-width: 35%; + font-size: 0.9rem; + padding-top: 0; +} - .in-progress p.date-list { - -ms-flex-preferred-size: 20%; - flex-basis: 20%; - max-width: 20%; - font-size: 0.9rem; - padding-top: 0; - } +.in-progress p.date-list { + -ms-flex-preferred-size: 20%; + flex-basis: 20%; + max-width: 20%; + font-size: 0.9rem; + padding-top: 0; +} - .in-progress p.bar-work-status, - .ffs-cp p.bar-work-status { - -ms-flex-preferred-size: 45%; - flex-basis: 45%; - max-width: 45%; - text-align: right; - font-size: 0.9rem; - padding-top: 0; - } +.in-progress p.bar-work-status, .ffs-cp p.bar-work-status { + -ms-flex-preferred-size: 45%; + flex-basis: 45%; + max-width: 45%; + text-align: right; + font-size: 0.9rem; + padding-top: 0; +} } @media only screen and (max-width: 41rem) { - .in-progress .between-xs { - -ms-flex-pack: start; - -webkit-box-pack: start; - justify-content: flex-start; - text-align: start; - } +.in-progress .between-xs { + -ms-flex-pack: start; + -webkit-box-pack: start; + justify-content: flex-start; + text-align: start; +} - .in-progress p.author-list, - .in-progress p.date-list { - padding-top: 0.3rem; - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50%; - } +.in-progress p.author-list, .in-progress p.date-list { + padding-top: 0.3rem; + -ms-flex-preferred-size: 50%; + flex-basis: 50%; + max-width: 50%; +} - .in-progress p.bar-work-status { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - text-align: left; - margin-top: 1rem; - } +.in-progress p.bar-work-status { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + text-align: left; + margin-top: 1rem; +} } @media only screen and (max-width: 30rem) { - .in-progress p.author-list, - .in-progress p.date-list { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100%; - padding-top: 0.7rem; - } +.in-progress p.author-list, .in-progress p.date-list { + -ms-flex-preferred-size: 100%; + flex-basis: 100%; + max-width: 100%; + padding-top: 0.7rem; +} } /* FFS WORK IN PROGRESS SINGLE */ -.ffs-wip p.author-list, -.ffs-cp p.author-list, -.ffs-wip p.date-list, -.ffs-wip p.progress-number-goal, -.ffs-cp p.date-list, -.ffs-cp p.progress-number-goal, -.ffs-wip p.bar-work-status, -.ffs-cp p.bar-work-status { +.ffs-wip p.author-list, .ffs-cp p.author-list, .ffs-wip p.date-list, .ffs-wip p.progress-number-goal, .ffs-cp p.date-list, .ffs-cp p.progress-number-goal, .ffs-wip p.bar-work-status, .ffs-cp p.bar-work-status { display: inline; } -.ffs-wip p.date-list, -.ffs-wip p.progress-number-goal, -.ffs-cp p.date-list, -.ffs-cp p.progress-number-goal { +.ffs-wip p.date-list, .ffs-wip p.progress-number-goal, .ffs-cp p.date-list, .ffs-cp p.progress-number-goal { margin-left: 2rem; } -.ffs-wip p.bar-work-status, -.ffs-cp p.bar-work-status { +.ffs-wip p.bar-work-status, .ffs-cp p.bar-work-status { text-align: right; float: right; } -.ffs-wip p.bar-work-status:after, -.ffs-cp p.bar-work-status:after { +.ffs-wip p.bar-work-status:after, .ffs-cp p.bar-work-status:after { clear: both; } @media only screen and (max-width: 62rem) { - .ffs-wip p.author-list, - .ffs-cp p.author-list, - .ffs-wip p.date-list, - .ffs-wip p.progress-number-goal, - .ffs-cp p.date-list, - .ffs-cp p.progress-number-goal, - .ffs-wip p.bar-work-status, - .ffs-cp p.bar-work-status { - font-size: 1rem; - } - +.ffs-wip p.author-list, .ffs-cp p.author-list, .ffs-wip p.date-list, .ffs-wip p.progress-number-goal, .ffs-cp p.date-list, .ffs-cp p.progress-number-goal, .ffs-wip p.bar-work-status, .ffs-cp p.bar-work-status { + font-size: 1rem; +} + } @media only screen and (max-width: 48rem) { - .ffs-wip p.bar-work-status, - .ffs-cp p.bar-work-status { - text-align: left; - float: none; - display: block; - margin-top: 1rem; - } +.ffs-wip p.bar-work-status, .ffs-cp p.bar-work-status { + text-align: left; + float: none; + display: block; + margin-top: 1rem; +} - .ffs-wip p.author-list, - .ffs-cp p.author-list, - .ffs-wip p.date-list, - .ffs-wip p.progress-number-goal, - .ffs-cp p.date-list, - .ffs-cp p.progress-number-goal, - .ffs-wip p.bar-work-status, - .ffs-cp p.bar-work-status { - font-size: 0.9rem; - } +.ffs-wip p.author-list, .ffs-cp p.author-list, .ffs-wip p.date-list, .ffs-wip p.progress-number-goal, .ffs-cp p.date-list, .ffs-cp p.progress-number-goal, .ffs-wip p.bar-work-status, .ffs-cp p.bar-work-status { + font-size: 0.9rem; +} - .ffs-wip p.date-list, - .ffs-wip p.progress-number-goal, - .ffs-cp p.date-list, - .ffs-cp p.progress-number-goal { - margin-left: 1rem; - } +.ffs-wip p.date-list, .ffs-wip p.progress-number-goal, .ffs-cp p.date-list, .ffs-cp p.progress-number-goal { + margin-left: 1rem; +} } @media only screen and (max-width: 37rem) { + +.ffs-wip p.author-list, .ffs-cp p.author-list, .ffs-wip p.date-list, .ffs-wip p.progress-number-goal, .ffs-cp p.date-list, .ffs-cp p.progress-number-goal { + padding-top: 0.7rem; +} - .ffs-wip p.author-list, - .ffs-cp p.author-list, - .ffs-wip p.date-list, - .ffs-wip p.progress-number-goal, - .ffs-cp p.date-list, - .ffs-cp p.progress-number-goal { - padding-top: 0.7rem; - } - - .ffs-wip .progress-bar, - .ffs-cp .progress-bar { - margin-top: 0.5rem; - } - +.ffs-wip .progress-bar, .ffs-cp .progress-bar { + margin-top: 0.5rem; +} + } @media only screen and (max-width: 30rem) { - .ffs-wip p.author-list, - .ffs-cp p.author-list, - .ffs-wip p.date-list, - .ffs-wip p.progress-number-goal, - .ffs-cp p.date-list, - .ffs-cp p.progress-number-goal { - display: block; - margin-left: 0; - } +.ffs-wip p.author-list, .ffs-cp p.author-list, .ffs-wip p.date-list, .ffs-wip p.progress-number-goal, .ffs-cp p.date-list, .ffs-cp p.progress-number-goal { + display: block; + margin-left: 0; +} } @@ -2736,8 +3396,7 @@ p.bar-work-status { padding: 0; } -.ffs-breadcrumbs p a, -.ffs-breadcrumbs p.bread-active { +.ffs-breadcrumbs p a, .ffs-breadcrumbs p.bread-active { display: inline-block; height: 16px; text-align: center; @@ -2750,21 +3409,17 @@ p.bar-work-status { border: none; line-height: 16px; min-width: 10rem; - -moz-box-shadow: 0 0 4px rgba(50, 50, 93, .1); - -webkit-box-shadow: 0 0 4px rgba(50, 50, 93, .1); - box-shadow: 0 0 4px rgba(50, 50, 93, .1); + -moz-box-shadow: 0 0 4px rgba(50,50,93,.1); + -webkit-box-shadow: 0 0 4px rgba(50,50,93,.1); + box-shadow: 0 0 4px rgba(50,50,93,.1); } -.ffs-breadcrumbs p a:hover, -.ffs-breadcrumbs p a:active, -.ffs-breadcrumbs p a:focus { +.ffs-breadcrumbs p a:hover, .ffs-breadcrumbs p a:active, .ffs-breadcrumbs p a:focus { border: none; background-color: #a1aabb; } -.ffs-breadcrumbs p a:hover:after, -.ffs-breadcrumbs p a:active:after, -.ffs-breadcrumbs p a:focus:after { +.ffs-breadcrumbs p a:hover:after, .ffs-breadcrumbs p a:active:after, .ffs-breadcrumbs p a:focus:after { border-left: 16px solid #a1aabb; } @@ -2776,8 +3431,7 @@ p.bar-work-status { background-color: #fff; } -.ffs-breadcrumbs p a:before, -.ffs-breadcrumbs p.bread-active:before { +.ffs-breadcrumbs p a:before, .ffs-breadcrumbs p.bread-active:before { content: ""; border-top: 16px solid transparent; border-bottom: 16px solid transparent; @@ -2788,15 +3442,14 @@ p.bar-work-status { } .ffs-breadcrumbs p:first-of-type a:before { - display: none; + display: none; } .ffs-breadcrumbs p:first-of-type a { - padding-left: 0.8rem; + padding-left: 0.8rem; } -.ffs-breadcrumbs p a:after, -.ffs-breadcrumbs p.bread-active:after { +.ffs-breadcrumbs p a:after, .ffs-breadcrumbs p.bread-active:after { content: ""; border-top: 16px solid transparent; border-bottom: 16px solid transparent; @@ -2808,7 +3461,7 @@ p.bar-work-status { .ffs-breadcrumbs p a:after { border-left: 16px solid #c6ccd6; -} +} .ffs-breadcrumbs p.bread-active:after { border-left: 16px solid #fff; @@ -2816,13 +3469,16 @@ p.bar-work-status { @media only screen and (max-width: 62rem) { - .ffs-breadcrumbs { - display: none; - } +.ffs-breadcrumbs { + display: none; +} } -@media only screen and (max-width: 48rem) {} +@media only screen and (max-width: 48rem) { + + +} .ffs-backlink p { text-align: left; @@ -2863,14 +3519,13 @@ p.bar-work-status { border: 1.5px solid #d0d4dd; } -.progress-bar span.fund-progress, -.progress-bar span.work-progress { +.progress-bar span.fund-progress, .progress-bar span.work-progress { display: block; height: 0.8rem; border-radius: 20px; box-shadow: - inset 0 2px 9px rgba(255, 255, 255, 0.3), - inset 0 -2px 6px rgba(0, 0, 0, .07); + inset 0 2px 9px rgba(255,255,255,0.3), + inset 0 -2px 6px rgba(0,0,0,.07); position: relative; overflow: hidden; } @@ -2883,48 +3538,65 @@ p.bar-work-status { background-color: #498fd5; } +@media only screen and (max-width: 75rem) { + +} + +@media only screen and (max-width: 62rem) { + +} + @media only screen and (max-width: 48rem) { - .progress-bar { - margin-top: 0.2rem; - } +.progress-bar { + margin-top: 0.2rem; +} } @media only screen and (max-width: 41rem) { - .ffs a.ffs-idea { - padding: 1.5rem; - } +.ffs a.ffs-idea { + padding: 1.5rem; +} - .ffs-idea h3 { - margin-bottom: 0.1rem; - font-size: 1.2rem; - } +.ffs-idea h3 { + margin-bottom: 0.1rem; + font-size: 1.2rem; +} + +.in-progress .progress-bar, .fund-required .progress-bar { + margin-top: 0.3rem; +} + +.progress-bar { + padding: 0.2rem; +} + +} + +@media only screen and (max-width: 30rem) { - .in-progress .progress-bar, - .fund-required .progress-bar { - margin-top: 0.3rem; - } - .progress-bar { - padding: 0.2rem; - } } @media only screen and (max-width: 23rem) { - .ffs p.author-list, - .ffs p.date-list, - .ffs-proposal p.author-list, - .ffs-proposal p.date-list { - display: block; - } +.ffs p.author-list, .ffs p.date-list, .ffs-proposal p.author-list, .ffs-proposal p.date-list { + display: block; +} - .ffs p.date-list, - .ffs-proposal p.date-list { - margin-left: 0; - } +.ffs p.date-list, .ffs-proposal p.date-list { + margin-left: 0; +} } + + + + + + + + diff --git a/forum-funding-system/donate/index.html b/forum-funding-system/donate/index.html index aa9489a7dc423bfce6fd9169dba46a7120c8a55a..1e603ce22508059b1e8e0963032669ebe13c9709 100644 --- a/forum-funding-system/donate/index.html +++ b/forum-funding-system/donate/index.html @@ -131,33 +131,22 @@ <p>1. Choose the amount of XMR you wish to contribute to this proposal</p> <p>2. Scan this QR code or tap to open in your Monero wallet app:</p> <p> - <a href="[MONERO LINK HERE]" class="qr"><img src="[PATH TO QR CODE HERE]"/></a> + <a href="[MONERO URL HERE]" class="qr"><img src="[QR CODE IMAGE HERE]"/></a> </p> <p>3. Send! Thank you! You are amazing!</p> </div> </div> <input class="input" name="tabs" type="radio" id="tab-2"/> - <label class="label" for="tab-2">Integrated Address</label> + <label class="label" for="tab-2">Address</label> <div class="panel col-xs-12"> <div class="panel-segment"> - <h3>Contribute using an integrated address</h3> + <h3>Contribute using an address</h3> <p>1. Choose the amount of XMR you wish to contribute to this proposal</p> - <p>2. Enter the following XMR address:</p> <p class="string">[INTEGRATED ADDRESS HERE]</p> + <p>2. Enter the following XMR address:</p> <p class="string">[SUBADDRESS HERE]</p> <p>3. Send! Thank you! You are amazing!</p> </div> </div> - <input class="input" name="tabs" type="radio" id="tab-3"/> - <label class="label" for="tab-3">Payment ID</label> - <div class="panel col-xs-12"> - <div class="panel-segment"> - <h3>Contribute using a payment ID</h3> - <p>1. Choose the amount of XMR you wish to contribute to this proposal</p> - <p>2. Enter the following XMR address:</p> <p class="string">45ttEikQEZWN1m7VxaVN9rjQkpSdmpGZ82GwUps66neQ1PqbQMno4wMY8F5jiDt2GoHzCtMwa7PDPJUJYb1GYrMP4CwAwNp</p> - <p>3. Enter the following payment ID that is unique to this proposal:</p> <p class="string">[PAYMENT ID HERE]</p> - <p>4. Send! Thank you! You're amazing!</p> - </div> - </div> - </div> + </div> </div> </div> </section>