Difference between revisions of "Template:Macquarie Australia/PascalTestCSS"
Line 19: | Line 19: | ||
{ | { | ||
border-bottom:none; | border-bottom:none; | ||
+ | } | ||
+ | /* Main elements of the page */ | ||
+ | |||
+ | body | ||
+ | { | ||
+ | background-color: green; | ||
+ | font-family: 'Trebuchet MS', Arial, sans-serif; | ||
+ | color: #181818; | ||
+ | } | ||
+ | |||
+ | #main_wrapper | ||
+ | { | ||
+ | width: 900px; | ||
+ | margin: auto; | ||
+ | background-color: white; | ||
+ | box-shadow: 0px 5px 10px #1c1a19; | ||
+ | } | ||
+ | |||
+ | section h1, footer h1, nav a | ||
+ | { | ||
+ | font-family: Impact, "Arial Black", Arial, Verdana, sans-serif; | ||
+ | font-weight: normal; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | |||
+ | /* Header */ | ||
+ | |||
+ | /*header | ||
+ | { | ||
+ | background: url('images/line.png') repeat-x bottom; | ||
+ | }*/ | ||
+ | |||
+ | #main_title | ||
+ | { | ||
+ | display: inline-block; | ||
+ | /*border: solid blue;*/ | ||
+ | } | ||
+ | |||
+ | header h1 | ||
+ | { | ||
+ | font-family: Impact, "Arial Black", Arial, Verdana, sans-serif; | ||
+ | font-size: 2.5em; | ||
+ | font-weight: normal; | ||
+ | } | ||
+ | |||
+ | #logo, header h1 | ||
+ | { | ||
+ | display: inline-block; | ||
+ | margin-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | header h2 | ||
+ | { | ||
+ | font-family: Impact, "Arial Black", Arial, Verdana, sans-serif; | ||
+ | font-size: 1.1em; | ||
+ | margin-top: 0px; | ||
+ | font-weight: normal; | ||
+ | } | ||
+ | |||
+ | /* Navigation */ | ||
+ | |||
+ | nav | ||
+ | { | ||
+ | display: inline-block; | ||
+ | width: 540px; | ||
+ | vertical-align: 30px; | ||
+ | text-align: right; | ||
+ | /*border: solid black;*/ | ||
+ | } | ||
+ | |||
+ | nav ul | ||
+ | { | ||
+ | list-style-type: none; | ||
+ | } | ||
+ | |||
+ | nav li | ||
+ | { | ||
+ | display: inline-block; | ||
+ | margin-right: 15px; | ||
+ | } | ||
+ | |||
+ | nav a | ||
+ | { | ||
+ | font-size: 1.3em; | ||
+ | color: #181818; | ||
+ | padding-bottom: 3px; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | nav a:hover | ||
+ | { | ||
+ | color: #760001; | ||
+ | border-bottom: 3px solid #760001; | ||
+ | } | ||
+ | |||
+ | /* Body */ | ||
+ | |||
+ | #band section | ||
+ | { | ||
+ | background: white; | ||
+ | margin: 2px; | ||
+ | } | ||
+ | |||
+ | article, aside | ||
+ | { | ||
+ | display: inline-block; | ||
+ | vertical-align: top; | ||
+ | text-align: justify; | ||
+ | } | ||
+ | |||
+ | article | ||
+ | { | ||
+ | width: 620px; | ||
+ | margin-right: 15px; | ||
+ | } | ||
+ | |||
+ | #photosystem | ||
+ | { | ||
+ | float:left; | ||
+ | margin-right: 5px; | ||
+ | margin-left: 5px; | ||
+ | } | ||
+ | |||
+ | .cat_icon | ||
+ | { | ||
+ | vertical-align: middle; | ||
+ | margin-right: 8px; | ||
+ | } | ||
+ | |||
+ | article p | ||
+ | { | ||
+ | font-size: 1.2em; | ||
+ | } | ||
+ | |||
+ | #overview aside | ||
+ | { | ||
+ | position: relative; | ||
+ | height: 370px; | ||
+ | width: 235px; | ||
+ | background-color: #706b64; | ||
+ | box-shadow: 0px 2px 5px #1c1a19; | ||
+ | border-radius: 5px; | ||
+ | padding: 10px; | ||
+ | color: white; | ||
+ | font-size: 0.9em; | ||
+ | } | ||
+ | |||
+ | #arrow | ||
+ | { | ||
+ | position: absolute; | ||
+ | top: 100px; | ||
+ | left: -12px; | ||
+ | } | ||
+ | |||
+ | #zozor_picture | ||
+ | { | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | #zozor_picture img | ||
+ | { | ||
+ | border: 1px solid #181818; | ||
+ | } | ||
+ | |||
+ | aside img | ||
+ | { | ||
+ | margin-right: 5px; | ||
+ | } | ||
+ | |||
+ | /* Banner */ | ||
+ | |||
+ | #banner_image | ||
+ | { | ||
+ | margin-top: 15px; | ||
+ | margin-left: 180px; | ||
+ | height: 170px; | ||
+ | width: 500px; | ||
+ | border-radius: 5px; | ||
+ | background: url('images/photosynthesis.jpg') no-repeat; | ||
+ | position: relative; | ||
+ | box-shadow: 0px 4px 4px #1c1a19; | ||
+ | margin-bottom: 25px; | ||
+ | } | ||
+ | |||
+ | #banner_description | ||
+ | { | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | border-radius: 0px 0px 5px 5px; | ||
+ | width: 99.5%; | ||
+ | height: 33px; | ||
+ | padding-top: 15px; | ||
+ | padding-left: 4px; | ||
+ | background-color: rgb(24,24,24); /* Old browsers will read this */ | ||
+ | background-color: rgba(24,24,24,0.8); /* New browsers will read this */ | ||
+ | color: white; | ||
+ | font-size: 0.8em; | ||
+ | } | ||
+ | |||
+ | .red_button | ||
+ | { | ||
+ | display: inline-block; | ||
+ | height: 25px; | ||
+ | position: absolute; | ||
+ | right: 5px; | ||
+ | bottom: 5px; | ||
+ | background: url('images/red_background.png') repeat-x; | ||
+ | border: 1px solid #760001; | ||
+ | border-radius: 5px; | ||
+ | font-size: 1.2em; | ||
+ | text-align: center; | ||
+ | padding: 3px 8px 0px 8px; | ||
+ | color: white; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .red_button img | ||
+ | { | ||
+ | border: 0; | ||
+ | } | ||
+ | |||
+ | /*Menu*/ | ||
+ | |||
+ | #menu | ||
+ | { | ||
+ | background: none; | ||
+ | } | ||
+ | |||
+ | #menu aside | ||
+ | { | ||
+ | position: relative; | ||
+ | width: 420px; | ||
+ | background-color: rgb(17,214,47); | ||
+ | box-shadow: 0px 2px 5px #1c1a19; | ||
+ | border-radius: 5px; | ||
+ | padding: 10px; | ||
+ | color: white; | ||
+ | font-size: 0.9em; | ||
+ | } | ||
+ | |||
+ | #menu img | ||
+ | { | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | /* Footer */ | ||
+ | |||
+ | /*footer | ||
+ | { | ||
+ | background: url('images/top.png') no-repeat top center, url('images/line.png') repeat-x top, url('images/shadow.png') repeat-x top; | ||
+ | padding-top: 25px; | ||
+ | }*/ | ||
+ | |||
+ | footer p, footer ul | ||
+ | { | ||
+ | font-size: 0.8em; | ||
+ | } | ||
+ | |||
+ | footer h1 | ||
+ | { | ||
+ | font-size: 1.1em; | ||
+ | } | ||
+ | |||
+ | #tweet, #my_pictures, #my_friends | ||
+ | { | ||
+ | display: inline-block; | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | |||
+ | #tweet | ||
+ | { | ||
+ | width: 28%; | ||
+ | } | ||
+ | |||
+ | #my_pictures | ||
+ | { | ||
+ | width: 35%; | ||
+ | } | ||
+ | |||
+ | #my_friends | ||
+ | { | ||
+ | width: 31%; | ||
+ | } | ||
+ | |||
+ | #my_pictures img | ||
+ | { | ||
+ | border: 1px solid #181818; | ||
+ | margin-right: 2px; | ||
+ | } | ||
+ | |||
+ | #my_friends ul | ||
+ | { | ||
+ | display: inline-block; | ||
+ | vertical-align: top; | ||
+ | margin-top: 0; | ||
+ | width: 48%; | ||
+ | list-style-image: url('images/external_link.png'); | ||
+ | padding-left: 2px; | ||
+ | } | ||
+ | |||
+ | #my_friends a | ||
+ | { | ||
+ | text-decoration: none; | ||
+ | color: #760001; | ||
} | } | ||
</style> | </style> | ||
</html> | </html> |
Revision as of 05:25, 16 July 2015