Difference between revisions of "Template:NUDT CHINA"
| (177 intermediate revisions by the same user not shown) | |||
| Line 13: | Line 13: | ||
menu_functionality(); | menu_functionality(); | ||
hide_show_menu(); | hide_show_menu(); | ||
| − | + | $(".igem_2017_menu_wrapper").hide(); | |
| − | + | ||
//this function controls the expand and collapse buttons of the menu and changes the +/- symbols | //this function controls the expand and collapse buttons of the menu and changes the +/- symbols | ||
| Line 84: | Line 83: | ||
</script> | </script> | ||
| − | |||
| − | |||
| − | |||
| − | |||
<style> | <style> | ||
| − | |||
| Line 103: | Line 97: | ||
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | ||
| − | |||
| − | |||
/**************************************************************** MENU ***************************************************************/ | /**************************************************************** MENU ***************************************************************/ | ||
/* Wrapper for the menu */ | /* Wrapper for the menu */ | ||
.igem_2017_menu_wrapper { | .igem_2017_menu_wrapper { | ||
| + | z-index:4; | ||
width: 15%; | width: 15%; | ||
height:100vh; | height:100vh; | ||
| Line 214: | Line 207: | ||
display:none; | display:none; | ||
text-align:center; | text-align:center; | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
| Line 451: | Line 373: | ||
<!--- THIS IS WHERE THE HTML BEGINS ---> | <!--- THIS IS WHERE THE HTML BEGINS ---> | ||
| + | <style> | ||
| + | h1, h2, h3, h4, h5, h6{line-height:normal;} | ||
| + | p {line-height: 40px; | ||
| + | font-family: Georgia, Times, "Times New Roman", serif; | ||
| + | font-variant: stacked-fractions; | ||
| + | font-size: 18px; | ||
| + | text-align: justify; | ||
| + | text-indent:40px; | ||
| + | } | ||
| + | table p {text-indent:0;line-height: normal; | ||
| + | margin: -6px; | ||
| + | font-size: large; | ||
| + | font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif; | ||
| + | } | ||
| + | @font-face { | ||
| + | font-family: 'Monad'; | ||
| + | src: url('https://static.igem.org/mediawiki/2017/d/de/Team-NUDT_CHINA_Monad2.eot'); | ||
| + | src: url('https://static.igem.org/mediawiki/2017/d/de/Team-NUDT_CHINA_Monad2.eot') format('embedded-opentype'), | ||
| + | url('https://static.igem.org/mediawiki/2017/2/2a/Team-NUDT_CHINMonad.woff') format('woff'), | ||
| + | url('https://static.igem.org/mediawiki/2017/0/0a/Team-NUDT_CHINA_Monad.ttf') format('truetype'), | ||
| + | url('https://static.igem.org/mediawiki/2017/d/d0/Team-NUDT_CHINMonad.svg#Monad') format('svg'); | ||
| + | } | ||
| + | @font-face { | ||
| + | font-family: 'BigF'; | ||
| + | src: url('https://static.igem.org/mediawiki/2017/6/69/T-NUDT_CHINA-BigF2.eot'); | ||
| + | src: url('https://static.igem.org/mediawiki/2017/6/69/T-NUDT_CHINA-BigF2.eot') format('embedded-opentype'), | ||
| + | url('https://static.igem.org/mediawiki/2017/4/41/T-NUDT_CHINA-BigF.woff') format('woff'), | ||
| + | url('https://static.igem.org/mediawiki/2017/e/e0/T-NUDT_CHINA-BigF.ttf') format('truetype'); | ||
| + | } | ||
| + | .pure-g{ | ||
| + | letter-spacing:-.31em;text-rendering:optimizespeed; | ||
| + | font-family:FreeSans,Arimo,"Droid Sans",Helvetica,Arial,sans-serif; | ||
| + | display:-webkit-box; | ||
| + | display:-webkit-flex; | ||
| + | display:-ms-flexbox; | ||
| + | display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-align-content:flex-start;-ms-flex-line-pack:start; | ||
| + | align-content:flex-start} | ||
| + | @media all and (-ms-high-contrast:none),(-ms-high-contrast:active){table .pure-g{display:block}} | ||
| + | .opera-only :-o-prefocus,.pure-g{word-spacing:-.43em} | ||
| + | .pure-u,.pure-u-1,.pure-u-1-1,.pure-u-1-12,.pure-u-1-2,.pure-u-1-24,.pure-u-1-3,.pure-u-1-4,.pure-u-1-5,.pure-u-1-6,.pure-u-1-8,.pure-u-10-24,.pure-u-11-12,.pure-u-11-24,.pure-u-12-24,.pure-u-13-24,.pure-u-14-24,.pure-u-15-24,.pure-u-16-24,.pure-u-17-24,.pure-u-18-24,.pure-u-19-24,.pure-u-2-24,.pure-u-2-3,.pure-u-2-5,.pure-u-20-24,.pure-u-21-24,.pure-u-22-24,.pure-u-23-24,.pure-u-24-24,.pure-u-3-24,.pure-u-3-4,.pure-u-3-5,.pure-u-3-8,.pure-u-4-24,.pure-u-4-5,.pure-u-5-12,.pure-u-5-24,.pure-u-5-5,.pure-u-5-6,.pure-u-5-8,.pure-u-6-24,.pure-u-7-12,.pure-u-7-24,.pure-u-7-8,.pure-u-8-24,.pure-u-9-24{display:inline-block;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto} | ||
| + | .pure-u-1-24{width:4.1667%} | ||
| + | .pure-u-1-12,.pure-u-2-24{width:8.3333%} | ||
| + | .pure-u-1-8,.pure-u-3-24{width:12.5%} | ||
| + | .pure-u-1-6,.pure-u-4-24{width:16.6667%} | ||
| + | .pure-u-1-5{width:20%} | ||
| + | .pure-u-5-24{width:20.8333%} | ||
| + | .pure-u-1-4,.pure-u-6-24{width:25%} | ||
| + | .pure-u-7-24{width:29.1667%} | ||
| + | .pure-u-1-3,.pure-u-8-24{width:33.3333%} | ||
| + | .pure-u-3-8,.pure-u-9-24{width:37.5%} | ||
| + | .pure-u-2-5{width:40%} | ||
| + | .pure-u-10-24,.pure-u-5-12{width:41.6667%} | ||
| + | .pure-u-11-24{width:45.8333%} | ||
| + | .pure-u-1-2,.pure-u-12-24{width:50%} | ||
| + | .pure-u-13-24{width:54.1667%} | ||
| + | .pure-u-14-24,.pure-u-7-12{width:58.3333%} | ||
| + | .pure-u-3-5{width:60%} | ||
| + | .pure-u-15-24,.pure-u-5-8{width:62.5%} | ||
| + | .pure-u-16-24,.pure-u-2-3{width:66.6667%} | ||
| + | .pure-u-17-24{width:70.8333%} | ||
| + | .pure-u-18-24,.pure-u-3-4{width:75%} | ||
| + | .pure-u-19-24{width:79.1667%} | ||
| + | .pure-u-4-5{width:80%} | ||
| + | .pure-u-20-24,.pure-u-5-6{width:83.3333%} | ||
| + | .pure-u-21-24,.pure-u-7-8{width:87.5%} | ||
| + | .pure-u-11-12,.pure-u-22-24{width:91.6667%} | ||
| + | .pure-u-23-24{width:95.8333%} | ||
| + | .pure-u-1,.pure-u-1-1,.pure-u-24-24,.pure-u-5-5{width:100%} | ||
| + | @media screen and (min-width:0em){.pure-u-sm-1,.pure-u-sm-1-1,.pure-u-sm-1-12,.pure-u-sm-1-2,.pure-u-sm-1-24,.pure-u-sm-1-3,.pure-u-sm-1-4,.pure-u-sm-1-5,.pure-u-sm-1-6,.pure-u-sm-1-8,.pure-u-sm-10-24,.pure-u-sm-11-12,.pure-u-sm-11-24,.pure-u-sm-12-24,.pure-u-sm-13-24,.pure-u-sm-14-24,.pure-u-sm-15-24,.pure-u-sm-16-24,.pure-u-sm-17-24,.pure-u-sm-18-24,.pure-u-sm-19-24,.pure-u-sm-2-24,.pure-u-sm-2-3,.pure-u-sm-2-5,.pure-u-sm-20-24,.pure-u-sm-21-24,.pure-u-sm-22-24,.pure-u-sm-23-24,.pure-u-sm-24-24,.pure-u-sm-3-24,.pure-u-sm-3-4,.pure-u-sm-3-5,.pure-u-sm-3-8,.pure-u-sm-4-24,.pure-u-sm-4-5,.pure-u-sm-5-12,.pure-u-sm-5-24,.pure-u-sm-5-5,.pure-u-sm-5-6,.pure-u-sm-5-8,.pure-u-sm-6-24,.pure-u-sm-7-12,.pure-u-sm-7-24,.pure-u-sm-7-8,.pure-u-sm-8-24,.pure-u-sm-9-24{display:inline-block;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto} | ||
| + | .pure-u-sm-1-24{width:4.1667%} | ||
| + | .pure-u-sm-1-12,.pure-u-sm-2-24{width:8.3333%} | ||
| + | .pure-u-sm-1-8,.pure-u-sm-3-24{width:12.5%} | ||
| + | .pure-u-sm-1-6,.pure-u-sm-4-24{width:16.6667%} | ||
| + | .pure-u-sm-1-5{width:20%} | ||
| + | .pure-u-sm-5-24{width:20.8333%} | ||
| + | .pure-u-sm-1-4,.pure-u-sm-6-24{width:25%} | ||
| + | .pure-u-sm-7-24{width:29.1667%} | ||
| + | .pure-u-sm-1-3,.pure-u-sm-8-24{width:33.3333%} | ||
| + | .pure-u-sm-3-8,.pure-u-sm-9-24{width:37.5%} | ||
| + | .pure-u-sm-2-5{width:40%} | ||
| + | .pure-u-sm-10-24,.pure-u-sm-5-12{width:41.6667%} | ||
| + | .pure-u-sm-11-24{width:45.8333%} | ||
| + | .pure-u-sm-1-2,.pure-u-sm-12-24{width:50%} | ||
| + | .pure-u-sm-13-24{width:54.1667%} | ||
| + | .pure-u-sm-14-24,.pure-u-sm-7-12{width:58.3333%} | ||
| + | .pure-u-sm-3-5{width:60%} | ||
| + | .pure-u-sm-15-24,.pure-u-sm-5-8{width:62.5%} | ||
| + | .pure-u-sm-16-24,.pure-u-sm-2-3{width:66.6667%} | ||
| + | .pure-u-sm-17-24{width:70.8333%} | ||
| + | .pure-u-sm-18-24,.pure-u-sm-3-4{width:75%} | ||
| + | .pure-u-sm-19-24{width:79.1667%} | ||
| + | .pure-u-sm-4-5{width:80%} | ||
| + | .pure-u-sm-20-24,.pure-u-sm-5-6{width:83.3333%} | ||
| + | .pure-u-sm-21-24,.pure-u-sm-7-8{width:87.5%} | ||
| + | .pure-u-sm-11-12,.pure-u-sm-22-24{width:91.6667%} | ||
| + | .pure-u-sm-23-24{width:95.8333%} | ||
| + | .pure-u-sm-1,.pure-u-sm-1-1,.pure-u-sm-24-24,.pure-u-sm-5-5{width:100%}} | ||
| + | @media screen and (min-width:48em){.pure-u-md-1,.pure-u-md-1-1,.pure-u-md-1-12,.pure-u-md-1-2,.pure-u-md-1-24,.pure-u-md-1-3,.pure-u-md-1-4,.pure-u-md-1-5,.pure-u-md-1-6,.pure-u-md-1-8,.pure-u-md-10-24,.pure-u-md-11-12,.pure-u-md-11-24,.pure-u-md-12-24,.pure-u-md-13-24,.pure-u-md-14-24,.pure-u-md-15-24,.pure-u-md-16-24,.pure-u-md-17-24,.pure-u-md-18-24,.pure-u-md-19-24,.pure-u-md-2-24,.pure-u-md-2-3,.pure-u-md-2-5,.pure-u-md-20-24,.pure-u-md-21-24,.pure-u-md-22-24,.pure-u-md-23-24,.pure-u-md-24-24,.pure-u-md-3-24,.pure-u-md-3-4,.pure-u-md-3-5,.pure-u-md-3-8,.pure-u-md-4-24,.pure-u-md-4-5,.pure-u-md-5-12,.pure-u-md-5-24,.pure-u-md-5-5,.pure-u-md-5-6,.pure-u-md-5-8,.pure-u-md-6-24,.pure-u-md-7-12,.pure-u-md-7-24,.pure-u-md-7-8,.pure-u-md-8-24,.pure-u-md-9-24{display:inline-block;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}.pure-u-md-1-24{width:4.1667%} | ||
| + | .pure-u-md-1-12,.pure-u-md-2-24{width:8.3333%} | ||
| + | .pure-u-md-1-8,.pure-u-md-3-24{width:12.5%} | ||
| + | .pure-u-md-1-6,.pure-u-md-4-24{width:16.6667%} | ||
| + | .pure-u-md-1-5{width:20%} | ||
| + | .pure-u-md-5-24{width:20.8333%} | ||
| + | .pure-u-md-1-4,.pure-u-md-6-24{width:25%} | ||
| + | .pure-u-md-7-24{width:29.1667%} | ||
| + | .pure-u-md-1-3,.pure-u-md-8-24{width:33.3333%} | ||
| + | .pure-u-md-3-8,.pure-u-md-9-24{width:37.5%} | ||
| + | .pure-u-md-2-5{width:40%} | ||
| + | .pure-u-md-10-24,.pure-u-md-5-12{width:41.6667%} | ||
| + | .pure-u-md-11-24{width:45.8333%} | ||
| + | .pure-u-md-1-2,.pure-u-md-12-24{width:50%} | ||
| + | .pure-u-md-13-24{width:54.1667%} | ||
| + | .pure-u-md-14-24,.pure-u-md-7-12{width:58.3333%} | ||
| + | .pure-u-md-3-5{width:60%} | ||
| + | .pure-u-md-15-24,.pure-u-md-5-8{width:62.5%} | ||
| + | .pure-u-md-16-24,.pure-u-md-2-3{width:66.6667%} | ||
| + | .pure-u-md-17-24{width:70.8333%}.pure-u-md-18-24,.pure-u-md-3-4{width:75%}.pure-u-md-19-24{width:79.1667%}.pure-u-md-4-5{width:80%}.pure-u-md-20-24,.pure-u-md-5-6{width:83.3333%}.pure-u-md-21-24,.pure-u-md-7-8{width:87.5%}.pure-u-md-11-12,.pure-u-md-22-24{width:91.6667%}.pure-u-md-23-24{width:95.8333%}.pure-u-md-1,.pure-u-md-1-1,.pure-u-md-24-24,.pure-u-md-5-5{width:100%}} | ||
| + | |||
| + | |||
| + | .pure-menu { | ||
| + | box-sizing: border-box; | ||
| + | } | ||
| + | .pure-menu-fixed { | ||
| + | position: fixed; | ||
| + | left: 0; | ||
| + | top: 0; | ||
| + | z-index: 3; | ||
| + | } | ||
| + | .pure-menu-list, | ||
| + | .pure-menu-item { | ||
| + | position: relative; | ||
| + | } | ||
| + | |||
| + | .pure-menu-list { | ||
| + | list-style: none; | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | } | ||
| + | |||
| + | .pure-menu-item { | ||
| + | padding: 0; | ||
| + | margin: 0; | ||
| + | height: 100%; | ||
| + | } | ||
| + | |||
| + | .pure-menu-link, | ||
| + | .pure-menu-heading { | ||
| + | display: block; | ||
| + | text-decoration: none; | ||
| + | white-space: nowrap; | ||
| + | } | ||
| + | .pure-menu-item .pure-menu-item { | ||
| + | display: block; | ||
| + | } | ||
| + | .pure-menu-heading { | ||
| + | text-transform: uppercase; | ||
| + | color: #565d64; | ||
| + | } | ||
| + | .pure-menu-link, { | ||
| + | color: #777; | ||
| + | } | ||
| + | |||
| + | .pure-menu-link, | ||
| + | .pure-menu-heading { | ||
| + | padding: .5em 1em; | ||
| + | } | ||
| + | .pure-menu-active > .pure-menu-link, | ||
| + | .pure-menu-link:hover, | ||
| + | .pure-menu-link:focus { | ||
| + | background-color: #eee; | ||
| + | } | ||
| + | .pure-menu-selected .pure-menu-link, | ||
| + | .pure-menu-selected .pure-menu-link:visited { | ||
| + | color: #000; | ||
| + | } | ||
| + | |||
| + | body { | ||
| + | color: #777; | ||
| + | } | ||
| + | |||
| + | .pure-img-responsive { | ||
| + | max-width: 100%; | ||
| + | height: auto; | ||
| + | } | ||
| + | |||
| + | #layout, | ||
| + | #menu, | ||
| + | .menu-link { | ||
| + | -webkit-transition: all 0.2s ease-out; | ||
| + | -moz-transition: all 0.2s ease-out; | ||
| + | -ms-transition: all 0.2s ease-out; | ||
| + | -o-transition: all 0.2s ease-out; | ||
| + | transition: all 0.2s ease-out; | ||
| + | } | ||
| + | |||
| + | #layout { | ||
| + | margin-top:-10px; | ||
| + | position: relative; | ||
| + | left: 0; | ||
| + | padding-left: 0; | ||
| + | } | ||
| + | #layout.active #menu { | ||
| + | left: 240px; | ||
| + | width: 240px; | ||
| + | } | ||
| + | |||
| + | #layout.active .menu-link { | ||
| + | left: 240px; | ||
| + | } | ||
| + | |||
| + | .content { | ||
| + | margin: 0 auto; | ||
| + | padding: 0 2em; | ||
| + | margin-bottom: 50px; | ||
| + | line-height: 1.6em; | ||
| + | } | ||
| + | |||
| + | .Myheader { | ||
| + | align-self: center; | ||
| + | margin: 0; | ||
| + | color: #333; | ||
| + | text-align: center; | ||
| + | padding: 2.5em 2em 0; | ||
| + | border-bottom: 2px solid #eee; | ||
| + | } | ||
| + | .Myheader h1 { | ||
| + | margin: 0.5em 0; | ||
| + | font-size: 3.8em; | ||
| + | font-weight: 300; | ||
| + | border-bottom:none; | ||
| + | } | ||
| + | .Myheader h2 { | ||
| + | font-weight: 300; | ||
| + | color: #ccc; | ||
| + | padding: 0; | ||
| + | margin-top: 0; | ||
| + | } | ||
| + | .Myheader h5 { | ||
| + | font-family:Monad; | ||
| + | margin: 0.5em 0; | ||
| + | font-size: 4.6em; | ||
| + | font-weight: 300; | ||
| + | border-bottom:none; | ||
| + | padding-bottom:50px; | ||
| + | } | ||
| + | .Myheader h6 { | ||
| + | font-size: 2em; | ||
| + | color: grey; | ||
| + | font-weight: 300; | ||
| + | margin: 0; | ||
| + | padding-top:1px; | ||
| + | } | ||
| + | |||
| + | .content-subhead { | ||
| + | margin: 50px 0 20px 0; | ||
| + | font-weight: 300; | ||
| + | text-indent:0; | ||
| + | color: #888; | ||
| + | font-size: 40px; | ||
| + | border-bottom: 1px solid #eee; | ||
| + | } | ||
| + | .content-subsub { | ||
| + | text-indent:0; | ||
| + | margin: 25px 0 10px 0; | ||
| + | font-weight: 300; | ||
| + | color: #888; | ||
| + | font-size:30px; | ||
| + | } | ||
| + | .content-subsubsub { | ||
| + | text-indent:0; | ||
| + | margin: 10px 0 6px 0; | ||
| + | font-weight: 300; | ||
| + | color: #888; | ||
| + | font-size:25px; | ||
| + | } | ||
| + | |||
| + | #menu { | ||
| + | font-weight:10px; | ||
| + | font-family: Monad; | ||
| + | font-size: 19px; | ||
| + | margin-left: -240px; /* "#menu" width */ | ||
| + | width: 240px; | ||
| + | position: fixed; | ||
| + | top: 18px; | ||
| + | left: 0; | ||
| + | bottom: 0; | ||
| + | z-index: 8; /* so the menu or its navicon stays above all content */ | ||
| + | background: #000000; | ||
| + | overflow-y: auto; | ||
| + | -webkit-overflow-scrolling: touch; | ||
| + | } | ||
| + | #menu a { | ||
| + | color: #999; | ||
| + | border: none; | ||
| + | padding: 0.6em 0 0.6em 0.6em; | ||
| + | } | ||
| + | #menu .pure-menu, | ||
| + | #menu .pure-menu ul { | ||
| + | border: none; | ||
| + | background: transparent; | ||
| + | } | ||
| + | |||
| + | #menu .pure-menu ul, | ||
| + | #menu .pure-menu .menu-item-divided { | ||
| + | border-top: 1px solid #333; | ||
| + | } | ||
| + | /* | ||
| + | Change color of the anchor links on hover/focus. | ||
| + | */ | ||
| + | #menu .pure-menu li a:hover, | ||
| + | #menu .pure-menu li a:focus { | ||
| + | background: #333; | ||
| + | } | ||
| + | |||
| + | #menu .pure-menu-selected, | ||
| + | #menu .pure-menu-heading { | ||
| + | background: #1f8dd6; | ||
| + | } | ||
| + | #menu .pure-menu-selected a { | ||
| + | color: #fff; | ||
| + | } | ||
| + | |||
| + | #menu .pure-menu-heading { | ||
| + | color: #fff; | ||
| + | } | ||
| + | |||
| + | .menu-link { | ||
| + | position: fixed; | ||
| + | display: block; /* show this only on small screens */ | ||
| + | top: 18px; | ||
| + | left: 0; /* "#menu width" */ | ||
| + | background: #000; | ||
| + | background: rgba(0,0,0,0.7); | ||
| + | font-size: 10px; /* change this value to increase/decrease button size */ | ||
| + | z-index: 10; | ||
| + | width: 2em; | ||
| + | height: auto; | ||
| + | padding: 2.1em 1.6em; | ||
| + | } | ||
| + | |||
| + | .menu-link:hover, | ||
| + | .menu-link:focus { | ||
| + | background: #000; | ||
| + | } | ||
| + | |||
| + | .menu-link span { | ||
| + | position: relative; | ||
| + | display: block; | ||
| + | } | ||
| + | |||
| + | .menu-link span, | ||
| + | .menu-link span:before, | ||
| + | .menu-link span:after { | ||
| + | background-color: #fff; | ||
| + | width: 100%; | ||
| + | height: 0.2em; | ||
| + | } | ||
| + | |||
| + | .menu-link span:before, | ||
| + | .menu-link span:after { | ||
| + | position: absolute; | ||
| + | margin-top: -0.6em; | ||
| + | content: " "; | ||
| + | } | ||
| + | |||
| + | .menu-link span:after { | ||
| + | margin-top: 0.6em; | ||
| + | } | ||
| + | @media (min-width: 94em) { | ||
| + | .phone{height:700px;} | ||
| + | .Myheader, | ||
| + | .content { | ||
| + | padding-left: 2em; | ||
| + | padding-right: 2em; | ||
| + | } | ||
| + | |||
| + | #layout { | ||
| + | padding-left: 240px; /* left col width "#menu" */ | ||
| + | left: 0; | ||
| + | } | ||
| + | #menu { | ||
| + | left: 240px; | ||
| + | } | ||
| + | |||
| + | .menu-link { | ||
| + | position: fixed; | ||
| + | left: 240px; | ||
| + | display: none; | ||
| + | } | ||
| + | |||
| + | #layout.active .menu-link { | ||
| + | left: 240px; | ||
| + | } | ||
| + | .home-btn { | ||
| + | top: 5px; | ||
| + | height: 46px; | ||
| + | width: 46px;} | ||
| + | } | ||
| + | |||
| + | @media (max-width: 94em) { | ||
| + | .phone{height:600px;} | ||
| + | #layout.active { | ||
| + | position: relative; | ||
| + | left: 240px; | ||
| + | } | ||
| + | .home-btn { | ||
| + | top: 5px; | ||
| + | height: 46px; | ||
| + | width: 46px;} | ||
| + | |||
| + | } | ||
| + | @media (max-width: 60em) { | ||
| + | .home-btn { | ||
| + | top: -16px; | ||
| + | height: 23px; | ||
| + | width: 23px;} | ||
| + | .phone{height:360px;}} | ||
| + | .pure-menu ul{margin: 0;} | ||
| + | .pure-menu-item .pure-menu-item{display:block;background-color:#cccccc} | ||
| + | .pure-menu-children{display:none;position:relative;top:0;margin:0;padding:0;z-index:3} | ||
| + | .pure-menu-active>.pure-menu-children,.pure-menu-allow-hover:hover>.pure-menu-children{display:block;position:relative} | ||
| + | .pure-menu-has-children>.pure-menu-link:after{padding-left:.5em;content:"\25B8";font-size:small} | ||
| + | .large-header { | ||
| + | position: relative; | ||
| + | width: 100%; | ||
| + | background: #333; | ||
| + | overflow: hidden; | ||
| + | background-size: cover; | ||
| + | background-position: center center; | ||
| + | z-index: 1; | ||
| + | background-position: center bottom; | ||
| + | } | ||
| + | .main-title { | ||
| + | max-width:100%; | ||
| + | position: absolute; | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | color: #f9f1e9; | ||
| + | text-align: center; | ||
| + | top: 50%; | ||
| + | left: 50%; | ||
| + | -webkit-transform: translate3d(-50%,-50%,0); | ||
| + | transform: translate3d(-50%,-50%,0); | ||
| + | font-family: "Comic Sans MS", cursive; | ||
| + | font-weight: normal; | ||
| + | font-size: 7.5em; | ||
| + | padding-left: 10px; | ||
| + | text-shadow: 2px 2px 4px rgba(0,0,0,0.4); | ||
| + | } | ||
| + | p a{text-decoration: underline;color: blue;font-style:italic; } | ||
| + | p a:visited{color:blue;} | ||
| + | p a:hover{color:blue;} | ||
| + | .tooltip | ||
| + | { | ||
| + | text-decoration:none; | ||
| + | position:relative; | ||
| + | font-weight: bold; | ||
| + | } | ||
| + | |||
| + | |||
| + | .tooltip span | ||
| + | {font-size: medium; | ||
| + | display:none; | ||
| + | -moz-border-radius:6px; | ||
| + | -webkit-border-radius:6px; | ||
| + | border-radius:6px; | ||
| + | color:black; | ||
| + | background:white;font-weight: 100; | ||
| + | line-height: normal; | ||
| + | } | ||
| + | |||
| + | |||
| + | .tooltip span img | ||
| + | { | ||
| + | float:left; | ||
| + | margin:0px 8px 8px 0; | ||
| + | width:50%; | ||
| + | } | ||
| + | |||
| + | |||
| + | .tooltip:hover span | ||
| + | { | ||
| + | display:block; | ||
| + | position:absolute; | ||
| + | top:0; | ||
| + | left:0; | ||
| + | z-index:1000; | ||
| + | width:300px; | ||
| + | min-height:128px; | ||
| + | border:1px solid black; | ||
| + | margin-top:12px; | ||
| + | margin-left:15px; | ||
| + | overflow:visible; | ||
| + | padding:8px; | ||
| + | } | ||
| + | |||
| + | |||
| + | </style> | ||
<head> | <head> | ||
| Line 463: | Line 883: | ||
<div class="igem_2017_menu_wrapper" > | <div class="igem_2017_menu_wrapper" > | ||
| + | |||
<a href="https://2017.igem.org/Team:NUDT_CHINA"> | <a href="https://2017.igem.org/Team:NUDT_CHINA"> | ||
| − | <img src=" | + | <img src="https://static.igem.org/mediawiki/2017/4/4f/T-NUDT_CHINA-icon01.png"> |
</a> | </a> | ||
Latest revision as of 03:28, 2 November 2017
