margin: 0;
padding: 0;
}
+
body {
margin: 0;
padding: 0;
font-family: Dosis;
+
color: #363a3b;
- background-color: white;
+ background-color: #e8e8e8;
+ background-repeat:no-repeat;
+ background-position: 100% 120px;
+}
+
+#body {
+ max-width: 48em;
+ margin: 0 auto;
+ spadding: 0 .5rem;
}
a {
text-decoration: none;
- color: #ea5b0b;
+ color: black;
&:hover {
text-decoration: underline;
}
}
+#home-link {
+ padding: .5em;
+ display: block;
+ float:left;
+
+ &:hover {
+ text-decoration: none;
+ background: rgba(255,255,255,.9);
+ }
+}
+
+#top-logo {
+ float: right;
+ margin: 0 1rem 0 1rem;
+}
+
header {
- padding: 2rem 20%;
- text-align: right;
+ background-image: url("{{ media_url('images/okladka.jpg') }}");
+ background-position: 50% 76%;
+ background-size: auto 100%;
+
+ @media screen and (min-width: 20em) {
+ padding-top: 8rem;
+ }
+
+ @media screen and (min-width: 24em) {
+ background-size: 100% auto;
+ }
h1 {
margin: 0;
- padding: 0;
- padding-left: 84px;
- .author {
- font-size: 1rem;
- font-weight: normal;
+ padding: 2em .5em 1em;
+ background: rgba(255,255,255,.7);
+ clear: both;
+
+ @media screen and (min-width: 20em) {
+ padding: 1em;
+ float: right;
+ text-align: right;
}
}
- img {
- float: left;
- width: 74px;
- height: 74px;
+
+ nav {
+ margin-top: 0;
}
}
text-align: right;
}
-section.intro, section.outro {
+section.home-section {
font-size: 1.3rem;
- background: #edede6;
+
+ h2 {
+ padding: 1rem;
+ margin: 0;
+ }
a {
display: block;
- padding: .7em 20%;
- color: black;
+
&:hover {
- background: white;
+ background: #f4f4f4;
text-decoration: none;
}
- .author {
- display: block;
- font-size: 1rem;
- }
}
-}
-section.main {
- padding: 0 20%;
+ .link-list {
+ list-style: none;
+ margin: 0;
+ padding: 0;
- div.roza {
- position: relative;
-
- a {
- position: absolute;
- &#roza-1 {
- top: 0;
- left: 33%;
- right: 33%;
- bottom: 55%;
- &:hover {
- background: url({{ media_url('images/roza-select-1.png') }});
- background-size: 294%;
- background-position: 50% 0;
- }
- }
- &#roza-2 {
- top: 33%;
- left: 55%;
- right: 0;
- bottom: 33%;
- &:hover {
- background: url({{ media_url('images/roza-select-2.png') }});
- background-size: 222%;
- background-position: 100% 50%;
- }
- }
- &#roza-3 {
- top: 55%;
- left: 33%;
- right: 33%;
- bottom: 0;
-
- &:hover {
- background: url({{ media_url('images/roza-select-3.png') }});
- background-size: 294%;
- background-position: 50% 100%;
- }
- }
- &#roza-4 {
- top: 33%;
- left: 0;
- right: 55%;
- bottom: 33%;
-
- &:hover {
- background: url({{ media_url('images/roza-select-4.png') }});
- background-size: 222%;
- background-position: 0 50%;
+ li {
+ margin: 0;
+ padding: 0;
+
+ a {
+ padding: .25em .5em .25em .5em;
+ position:relative;
+ font-size: 1.2rem;
+
+ @media screen and (min-width: 20em) {
+ padding-left: 2.7rem;
+ font-size: 1.3rem;
+
+ &:before {
+ content: '\bb';
+ position: absolute;
+ left: 1rem;
+ }
}
}
}
}
}
+#tools {
+ background: #eee;
+ padding-bottom: 1em;
-a.download {
- padding: 0 20%;
+ @media screen and (min-width: 36em) {
+ float: right;
+ z-index: 1000;
+ margin: 0 0 1em 1em;
+ width: 14em;
+ position: relative;
+ border-color: #ddd;
+ border-style: solid;
+ border-width: 0 0 1px 1px;
+ }
}
footer {
- border-top: 1px solid #edede6;
- padding: 1em 20%;
- margin-top: 3em;
+ border-top: 1px solid #fff;
+ padding: 1rem 0;
+ margin-top: 0;
+ font-size: .75rem;
+
+ .footer-item {
+ padding: .5rem;
+
+ @media screen and (min-width: 24em) {
+ display: inline-block;
+ vertical-align: top;
+ width: 15rem;
+ }
+ }
}
-.ocena img {
- vertical-align: middle;
+nav {
+ clear: both;
+ margin-top: 3em;
+
+ a:hover {
+ text-decoration: none;
+ background: rgba(255,255,255,.9);
+ }
+
+ .link-prev {
+ float: left;
+ padding: 1em;
+ &:before {
+ content: '\25c4';
+ margin-right: .4em;
+ }
+ }
+ .link-next {
+ float: right;
+ text-align:right;
+ padding: 1em;
+ &:after {
+ content: '\25ba';
+ margin-left: .4em;
+ }
+ }
}
-blockquote {
+
+#logos {
margin: 0;
- padding: 0;
- font-style: italic;
+ padding: .5rem 0 .5rem;
+ text-align: left;
+ section {
+ display: inline-block;
+ h1 {
+ text-align: left;
+ font-size: .8rem;
+ font-weight: normal;
+ margin: 0 0 .5rem 1rem;
+
+ @media screen and (min-width: 42em) {
+ margin-left: 2rem;
+ }
+ @media screen and (min-width: 48em) {
+ margin-left: 3rem;
+ }
+ }
+ a {
+ display: inline-block;
+ margin-left: 1rem;
+ margin-bottom: .5rem;
+
+ @media screen and (min-width: 42em) {
+ margin-left: 2rem;
+ }
+ @media screen and (min-width: 48em) {
+ margin-left: 3rem;
+ }
+ }
+ img {
+ width: 6rem;
+ vertical-align: middle;
+ }
+ }
}
-.twocol {
- -moz-column-count: 2;
- -webkit-column-count: 2;
- -o-column-count: 2;
- -ms-column-count: 2;
- column-count: 2;
- -moz-column-break-inside: avoid;
- -webkit-column-break-inside: avoid;
- -o-column-break-inside: avoid;
- -ms-column-break-inside: avoid;
- column-break-inside: avoid;
-
- p {
- margin: 0 0 1em;
+#toc {
+ margin-bottom: 3rem;
+}
+
+body#index {
+ #body {
+ @media screen and (min-width: 36em) {
+ display: -webkit-box;
+ display: -moz-box;
+ display: -ms-flexbox;
+ display: -webkit-flex;
+ display: flex;
+
+ -webkit-box-orient: vertical;
+ -moz-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -moz-box-direction: normal;
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+ flex-direction: column;
+
+ #logos {
+ -webkit-box-ordinal-group: 1;
+ -moz-box-ordinal-group: 1;
+ -ms-flex-order: 1;
+ -webkit-order: 1;
+ order: 1;
+ }
+ header {
+ -webkit-box-ordinal-group: 2;
+ -moz-box-ordinal-group: 2;
+ -ms-flex-order: 2;
+ -webkit-order: 2;
+ order: 2;
+ }
+ #toc {
+ -webkit-box-ordinal-group: 3;
+ -moz-box-ordinal-group: 3;
+ -ms-flex-order: 3;
+ -webkit-order: 3;
+ order: 3;
+ }
+ footer {
+ -webkit-box-ordinal-group: 100;
+ -moz-box-ordinal-group: 100;
+ -ms-flex-order: 100;
+ -webkit-order: 100;
+ order: 100;
+ }
+ }
}
}
\ No newline at end of file
fnp / static.git / blobdiff