(Blanked the page) |
|||
Line 1: | Line 1: | ||
+ | {{:Team:UNOTT/Template/NavBarTest}} | ||
+ | <html> | ||
+ | <head> | ||
+ | <style> | ||
+ | html { | ||
+ | font-size:62.5%; | ||
+ | } | ||
+ | body { | ||
+ | height: 100% | ||
+ | margin-top:100px; | ||
+ | font-size:1.4rem; | ||
+ | font-family:arial; | ||
+ | background-color:#dd; | ||
+ | } | ||
+ | |||
+ | #icons { | ||
+ | max-width:96rem; | ||
+ | width:100%; | ||
+ | min-height:200px; | ||
+ | height:auto; | ||
+ | margin:0 auto; | ||
+ | background-color:white; | ||
+ | box-sizing:border-box; | ||
+ | padding:0; | ||
+ | display:-webkit-flex; | ||
+ | display:flex; | ||
+ | -webkit-align-items:center; | ||
+ | align-items:center; | ||
+ | -webkit-justify-content:center; | ||
+ | justify-content:center; | ||
+ | -webkit-flex-direction:row; | ||
+ | flex-direction:row; | ||
+ | -webkit-flex-wrap:wrap; | ||
+ | flex-wrap:wrap; | ||
+ | -webkit-align-content:flex-end; | ||
+ | align-content:flex-end; | ||
+ | } | ||
+ | figure { | ||
+ | width:12.5rem; | ||
+ | height:12.5rem; | ||
+ | display:block; | ||
+ | margin:0.5rem 1rem 4rem 0.5rem; | ||
+ | padding:0; | ||
+ | box-sizing:content-box; | ||
+ | color:black; | ||
+ | } | ||
+ | figure img { | ||
+ | -webkit-border-radius:50%; | ||
+ | -moz-border-radius:50%; | ||
+ | border-radius:50%; | ||
+ | } | ||
+ | #icons figure img { | ||
+ | -webkit-transition:opacity 0.26s ease-out; | ||
+ | -moz-transition:opacity 0.26s ease-out; | ||
+ | -ms-transition:opacity 0.26s ease-out; | ||
+ | -o-transition:opacity 0.26s ease-out; | ||
+ | transition:opacity 0.26s ease-out; | ||
+ | } | ||
+ | #icons:hover img, #icons:active img { | ||
+ | opacity:0.3; | ||
+ | } | ||
+ | #icons:hover img:hover, #icons:active img:active { | ||
+ | opacity:1; | ||
+ | } | ||
+ | figcaption { | ||
+ | font-size:1.2rem; | ||
+ | text-align:center; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | |||
+ | <body> | ||
+ | <div id="icons"> | ||
+ | <figure><img src="https://www.iconexperience.com/_img/g_collection_png/standard/256x256/brain.png"><figcaption>Brainstorm</figcaption></figure> | ||
+ | <figure><img src="https://www.iconexperience.com/_img/g_collection_png/standard/256x256/dna.png"><figcaption>Plasmid Design</figcaption></figure> | ||
+ | <figure><img src="https://www.iconexperience.com/_img/g_collection_png/standard/128x128/key.png"><figcaption>Key. coli Design</figcaption></figure> | ||
+ | <figure><img src="https://www.iconexperience.com/_img/g_collection_png/standard/256x256/window_key.png"><figcaption>Key Transport Design</figcaption></figure> | ||
+ | |||
+ | </div> | ||
+ | </body> | ||
+ | |||
+ | |||
+ | </html> | ||
+ | |||
+ | {{:Team:UNOTT/Template/Footer}} |
Revision as of 15:25, 28 August 2017