From ea3aa21318e916260f1c2f7925afc94d9d71dd05 Mon Sep 17 00:00:00 2001 From: Krzysztof Date: Sun, 10 Mar 2019 15:42:55 +0100 Subject: [PATCH] Create StyleSheet.css --- aukcje/2019/01/27/StyleSheet.css | 283 +++++++++++++++++++++++++++++++ 1 file changed, 283 insertions(+) create mode 100644 aukcje/2019/01/27/StyleSheet.css diff --git a/aukcje/2019/01/27/StyleSheet.css b/aukcje/2019/01/27/StyleSheet.css new file mode 100644 index 0000000..6a902c1 --- /dev/null +++ b/aukcje/2019/01/27/StyleSheet.css @@ -0,0 +1,283 @@ +* { + box-sizing: border-box; +} + +body { + font-family: 'GidoleRegular'; +} + +nav { + background-color: #333; +} + + nav a { + color: white; + text-decoration: none; + font-size: 12px; + padding: 10px; + margin: 10px 10px; + } + + nav a:hover { + background-color: orangered; + } + +.toppart { + margin-left: -8px; + margin-top: -8px; + margin-right: -8px; +} + +header { + text-align: left; + background-image: url(https://c.pxhere.com/photos/ae/c4/blackandwhite_monochrome_background_turntable_minimalist_publicdomain-500196.jpg!d); + background-size: cover; + background-position: center; + padding: 10px; + height: 256px; + color: white; + float:left; + width:75%; +} + header h1 { + font-family: 'NemoyMedium'; + font-size: 48px; + margin: 0px; + padding-left: 48px; + padding-top: 48px; + font-style: oblique; + background-color: transparent; + } + + header h3{ + padding-left:48px; + color: black; + } + +.cardcolumn { + float: left; + width: 25%; + text-align: right; + background-color: white; + padding: 20px; + height: 256px; +} + + .cardcolumn p{ + font-size: 21px; + } + + .cardcolumn a{ + text-decoration: none; + color: black; + font-size: 28px; + } + + .cardcolumn a:hover{ + color: orangered; + } + +.wyszukiwarka { + width: 512px; + margin: 10px; + padding: 5px; + border-radius: 25px; +} + +.fa { + padding: 20px; + font-size: 30px; + width: 64px; + text-align: center; + text-decoration: none; + margin: 5px 2px; +} + + .fa:hover { + opacity: 0.7; + } + +.fa-facebook { + background: #3B5998; + color: white; +} + +.fa-github { + background: #24292e; + color: white; +} + +.fa-instagram { + background: #3B5998; + color: white; +} + +.menu { + list-style-type: none; + margin: 0; + padding: 0; + overflow: hidden; + background-color: #333; +} + +li { + float: left; +} + + li.dropdown { + display: inline-block; + } + + li p { + margin: 14px 16px; + display: block; + color: white; + } + + li a, .dropbtn { + display: block; + color: white; + text-align: center; + padding: 14px 16px; + text-decoration: none; + } + + li a:hover, .dropdown:hover .dropbtn { + background-color: #111; + } + + +.active { + background-color: orangered; +} + +/* Left column */ +.leftcolumn { + float: left; + margin-left: -8px; + width: 25%; +} + +/* Right column */ +.rightcolumn { + float: left; + width: 75%; + padding-left: 20px; + margin-right: -8px; +} + +.seemore { + width: 100%; + padding: 10px; + background-color: darkorange; + display: block; + text-align: center; + text-decoration: none; + color: black; + font-size: 24px; +} + + .seemore:hover { + background-color: orangered; + color: white; + } + +.weatherwidget-io { + margin-top: 20px; +} + +.card, .cardleft, .cardlist { + background-color: white; + padding: 20px; + margin-top: 20px; +} + + .cardlist a { + background-color: darkorange; + padding: 14px 25px; + margin: 5px 2px; + color: black; + text-decoration: none; + display: inline-block; + text-align: center; + } + + .cardlist a:hover { + background-color: orangered; + color: white; + } + + .cardleft a { + display: block; + margin: 5px; + font-size: 24px; + text-decoration: none; + text-align: left; + } + + .cardleft a:link { + color: black; + } + + .cardleft a:visited { + color: grey; + } + + .cardleft a:hover { + color: orangered; + } + + .cardleft a:active { + color: darkorange; + } + +.dropdown { + position: relative; + display: inline-block; +} + +.dropdown-content { + display: none; + position: absolute; + background-color: #f9f9f9; + min-width: 160px; + box-shadow: 8px 16px rgba(0,0,0,0.2); + z-index: 1; +} + + .dropdown-content a { + color: black; + padding: 12px 16px; + text-decoration: none; + display: block; + text-align: left; + } + + .dropdown-content a:hover { + background-color: #f1f1f1 + } + +.dropdown:hover .dropdown-content { + display: block; +} + +footer { + background-color: #1e1e1e; + text-align: center; + padding: 30px; + margin: 20px -8px; + color: white; +} + +.row:after { + content: ""; + display: table; + clear: both; +} + +@media screen and (max-width: 800px) { + .leftcolumn, .rightcolumn { + width: 100%; + padding: 0; + } +}