|
|
| Line 1: |
Line 1: |
| | {{SMMU-China}} | | {{SMMU-China}} |
| | <html> | | <html> |
| | + | |
| | + | <link rel="stylesheet" href="https://2019.igem.org/wiki/index.php?title=Template:SMMU-China/CSS_main&action=raw&ctype=text/css" /> |
| | | | |
| | <style type="text/css"> | | <style type="text/css"> |
| − | /*nav*/ | + | |
| − | nav {
| + | |
| − | margin: auto;
| + | |
| − | margin-top: 40px;
| + | |
| − | position: relative;
| + | |
| − | width: 320px;
| + | |
| − | min-width: 320px;
| + | |
| − | height: 200px;
| + | |
| − | }
| + | |
| − | | + | |
| − | nav h2 {
| + | |
| − | border-radius: 2px;
| + | |
| − | position: relative;
| + | |
| − | background: tomato;
| + | |
| − | height: 40px;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: ivory;
| + | |
| − | font-weight: 200;
| + | |
| − | display: flex;
| + | |
| − | flex: 1;
| + | |
| − | justify-content: center;
| + | |
| − | align-items: center;
| + | |
| − | box-shadow: 4px 4px 20px -2px rgba(0,0,0,.35);
| + | |
| − | transition: all .4s;
| + | |
| − | }
| + | |
| − | | + | |
| − | nav:hover h2{
| + | |
| − | transform: translateY(-2px);
| + | |
| − | box-shadow: 2px 2px 5px -1px rgba(0,0,0,.35);
| + | |
| − | }
| + | |
| − | nav:hover:active h2{
| + | |
| − | transform: translateY(10px);
| + | |
| − | box-shadow: 0px -1px 2px 0px rgba(0,0,0,.35);
| + | |
| − | }
| + | |
| − | | + | |
| − | input {
| + | |
| − | position: absolute;
| + | |
| − | left: 0;
| + | |
| − | top: 0;
| + | |
| − | width: 100%;
| + | |
| − | z-index: 1;
| + | |
| − | opacity: 0;
| + | |
| − | cursor: pointer;
| + | |
| − | height: 40px;
| + | |
| − | }
| + | |
| − | | + | |
| − | #toggle:checked ~ul {
| + | |
| − | height: 0%;
| + | |
| − | }
| + | |
| − | | + | |
| − | nav ul {
| + | |
| − | padding-left: 0;
| + | |
| − | padding-top: 0;
| + | |
| − | margin-top: 0;
| + | |
| − | list-style: none;
| + | |
| − | overflow: hidden;
| + | |
| − | text-align: right;
| + | |
| − | margin-bottom: 22px;
| + | |
| − | text-align: center;
| + | |
| − | transition: all .4s ease-out;
| + | |
| − | height: 100%;
| + | |
| − |
| + | |
| − | }
| + | |
| − | nav ul li {
| + | |
| − | border-radius: 2px;
| + | |
| − | position: relative;
| + | |
| − | display: inline-block;
| + | |
| − | margin-left: 35px;
| + | |
| − | line-height: 1.5;
| + | |
| − | width: 100%;
| + | |
| − | margin: 0;
| + | |
| − | margin-bottom: 5px;
| + | |
| − | background: tomato;
| + | |
| − | transition: background 3s;
| + | |
| − | box-shadow: 2px 2px 10px -2px rgba(0,0,0,.35);
| + | |
| − | }
| + | |
| − | | + | |
| − | nav ul li:hover {
| + | |
| − | background: mediumorchid;
| + | |
| − | transition: background .45s;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* nav ul li:hover a:active, li {
| + | |
| − | color: tomato;
| + | |
| − | } */
| + | |
| − | | + | |
| − | nav ul a {
| + | |
| − | display: block;
| + | |
| − | color: ivory;
| + | |
| − | text-transform: lowercase;
| + | |
| − | font-size: 18px;
| + | |
| − | font-weight: 200;
| + | |
| − | text-decoration: none;
| + | |
| − | transition: color .3s;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | .big_framework {
| + | |
| − | background-color:white;
| + | |
| − | display:block;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | .big_framework .medium_framework {
| + | |
| − | margin:auto;
| + | |
| − | max-width: 1400px;
| + | |
| − | width:90%;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| | </style> | | </style> |
| | | | |
