@media screen {
/***** *Font Styles *****/ #FudanTSIBody h1, #FudanTSIBody h2, #FudanTSIBody h3, #FudanTSIBody h4, #FudanTSIBody h5, #FudanTSIBody h6, #nav-mobile { font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; }
#FudanTSIBody h3, #FudanTSIBody h4, #FudanTSIBody h5, #FudanTSIBody h6, #nav-mobile { color: rgba(255, 255, 255, 0.86); }
#FudanTSIBody p, #FudanTSIBody div, #FudanTSIBody table, #FudanTSIBody ol, #FudanTSIBody ul { font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; color: rgba(255, 255, 255, 0.86); } #FudanTSIBody table {background:transparent;}
#FudanTSIBody .slides h3 { color: #F78E41; /* @@@@ font-size: 40px;*/ }
#FudanTSIBody .slides h5 { color: #F78E41; /* @@@@ font-size: 20px;*/ }
#FudanTSIBody nav ul a { color: #16283f; }
/*#FudanTSIBody .dropdown-content li a { color: #16283f; } */
- FudanTSIBody ul.dropdown-content { background-color: rgba(0,0,0,0.87); }
- FudanTSIBody ul.dropdown-content>li { text-align: left; width: 0; }
- FudanTSIBody ul.dropdown-content>li>a, #FudanTSIBody a.dropdown-trigger { font-size: 14px; }
#FudanTSIBody a { text-decoration: none; outline: none; color: #47998e; }
#FudanTSIBody .floatingBtn .btn { position: fixed; bottom: 40px; width: 50px; height: 50px; padding: 0; text-align: center; color: white; opacity: 0.8; z-index: 998; }
#FudanTSIBody .floatingBtn .btn:first-child { right: 100px; background: #e5e6e7; }
#FudanTSIBody .floatingBtn .btn:last-child { right: 40px; background: #47998e; }
#FudanTSIBody #nav-mobile li a { color: rgba(255, 255, 255, 0.86); text-align: center; }
#FudanTSIBody #nav-mobile > li > a { /* @@@@ font-size: 18px;*/ font-weight: 400; letter-spacing: 1px; }
- FudanTSIBody #nav-mobile li:hover {
background: transparent; color: cyan;
}
#FudanTSIBody #nav-mobile > li > ul a { /* @@@@ font-size: 14px;*/ font-weight: 300; }
#contentBanner div.col { color: white; padding: 0; }
#contentBanner div.col > h1 { /* @@@@ font-size: 40px;*/ text-align: center; font-weight: 900; border: none; color: #FFF; }
#contentBanner div.col > span { /* @@@@ font-size: 18px;*/ margin-right: 20%; text-align: justify; color: #FFF; }
#contentBanner div.col > h1, #contentBanner div.col > span { z-index: 10; }
#figureBannerTitle h1, #figureBannerTitle span { color: #fff; }
#figureBannerTitle h1 { border: none; /* @@@@ font-size: 80px;*/ /* @@@@ line-height: 100px;*/ font-weight: 900; margin-bottom: 10%; }
#figureBannerTitle span { font-size: 2rem; line-height: 3rem; }
@media only screen and (max-width: 991px) { #figureBannerTitle h1 { /* @@@@ font-size: 40px;*/ font-weight: 900; /*line-height: 60px;*/ margin-bottom: 4%; }
#figureBannerTitle span { font-size: 1.5rem; line-height: 2rem; } } #contentBanner div.col:first-child { height: 40%; vertical-align: bottom; padding: 10% 10% 0 10%; }
#contentBanner div.col:last-child { height: 60%; vertical-align: top; padding: 5% 10%; }
#pageContent .section:first-child h2 { margin: 40px 0 30px 0; }
#pageContent h2 { color: #47998e; /* @@@@ font-size: 36px;*/ margin: 30px 0 40px 0; text-align: center; }
#pageContent h3 { /*font-size: 28px;*/ margin: 50px 0 10px 0; }
#pageContent .section > h3:before { content: "▪ "; }
#pageContent #FudanTSIfooter h3:before { content: normal; }
#pageContent h4 { /* @@@@ font-size: 24px;*/ margin: 50px 0 0 10px; }
#pageContent p, #pageContent .section ul { /*font-size: 18px;*/ margin: 23px 0 0 0; /* @@@@ line-height: 35px;*/ }
/* @@@@ #pageContent .section div { font-size: 18px; line-height: 35px; }*/
#pageContent p { text-align: justify; text-indent: 30px; }
- FudanTSIBody #contentBanner p {
text-indent: 0; }
#pageContent #FudanTSIfooter h3 { margin: 10px 0 10px 0; }
#acknowledgementPhoto span { position: absolute; bottom: 5%; z-index: 10; display: none; color: #fff; background: rgba(255, 255, 255, 0.86); /* @@@@ font-size: 20px;*/ /* @@@@ line-height: 24px;*/ }
- FudanTSIfooter #footerNavList {
color: #b0bec5; /* blue-grey lighten-3 */ padding-left: 1rem;
}
- FudanTSIfooter #footerNavList ul {
font-size: 13px; line-height: 14px; border-top: solid 2px; color: inherit; text-decoration: none; padding-top: 5px;
}
- FudanTSIfooter #footerNavList div {
color: #b0bec5; /* blue-grey lighten-3 */
}
- FudanTSIfooter #footerNavList div:hover {
color: white;
}
- FudanTSIfooter #footerNavList a {
color: inherit;
}
- FudanTSIfooter #footerNavList a:hover {
text-decoration: underline;
}
- FudanTSIfooter #footerNavList div.active,
- FudanTSIfooter #footerNavList div.active a {
color: white;
}
- FudanTSIfooter #footerNavList div.active ul {
border-top: solid white 2px;
}
- FudanTSIfooter #footerNavList li {
padding: 3px 0 6px 3px;
}
- footerNavList span {
font-size: 20px;
}
- footerNavList > div > div {
padding-left: 1.2rem;
}
- FudanTSIfooter div.footer-copyright {
font-size: 13px; line-height: 15px;
}
#FudanTSIBody .tableHolder caption { /* @@@@ font-size: 18px;*/ margin-bottom: 2px; }
/* @@@@ #FudanTSIBody #pageContent .tableHolder { /*font-size: 15px; line-height: 25px; }*/
#pageContent .section ul li { list-style-type: disc; margin: 0 0 0 16px; /*font-size: 18px;*/ text-align: justify; }
#pageContent .section ul { /*font-size: 18px;*/ margin-top: 23px; }
/* 2019-9-16 ht @media only screen and (max-width: 600px) { #pageContent h2 { font-size: 26px; margin: 20px 0 30px 0; }
#pageContent h3 { font-size: 20px; margin: 30px 0 5px 0; }
#pageContent h4 { font-size: 17px; margin: 17px 0 0 10px; }
#pageContent p, #pageContent .section ul { font-size: 16px; margin: 20px 0 0 0; line-height: 25px; }
#pageContent .section div { font-size: 16px; line-height: 25px; }
#pageContent .section ul li { font-size: 16px; }
#pageContent .section ul { font-size: 16px; margin-top: 20px; } }*/
#FudanTSIBody .nameCard h3 { margin-top: 0; }
#bodyContent #FudanTSIBody a[href^="https://"] { padding-right: 0; }
#pageContent h2 > a { text-decoration: underline; }
#FudanTSIBody ol#ref li { /*font-size: 14px;*/ /* @@@@ line-height: 20px;*/ margin-top: 15px; list-style-type: none; }
#FudanTSIBody ol#ref { list-style-type: none; /* counter-reset: sectioncounter; */ }
/* #FudanTSIBody ol#ref li:before {
content: "[" counter(sectioncounter) "] "; counter-increment: sectioncounter; }*/ #FudanTSIBody .expFigureHolder p{ font-size: 0.9rem; line-height: 1.5rem; text-indent: 0; margin-top: 0; } #FudanTSIBody #pageContent .expFigureHolder{ padding: 2%; margin-top: 23px; }
/***** *Structure Styles *****/
/* #FudanTSIBody img {
background: rgba(0, 0, 0, 0); } #FudanTSIBody .section img[src$=".svg"] { background: #fff; }*/
#content { z-index: auto; /* #slide-out is not on the top of all elements when using default z-index number(2) */ }
div { box-sizing: content-box; /* Solve the conflict between Materialize(inherit) and igem.org default setting */ }
#FudanTSIBody div { box-sizing: border-box; }
#top_menu_14 { z-index: 996; }
#globalWrapper { /* Solve the overflow of login */ overflow: hidden; padding: 0; }
#FudanTSIdivWrapper { position: relative; width: 100%; }
#FudanTSIBody { position: relative; width: 100%; overflow: hidden; background-color: #121f33; }
#FudanTSIBody ul { margin: 0; line-height: inherit; }
#FudanTSIBody img { vertical-align: inherit; }
#FudanTSIBody .fa { height: inherit; line-height: inherit; /*font-size: inherit;*/ }
#FudanTSIBody .container { width: 90%; }
@media only screen and (max-width: 600px) { #emptyBar { height: 6px; // 2018igem 56 } } @media only screen and (min-width: 601px) { #emptyBar { height: 10px; // 2018igem 75 } } #topNav { position: fixed; z-index: 995; top: 18px; }
/*@media only screen and (min-width: 992px) { #FudanTSIBody #nav-mobile { border-top: solid 13px #16283f; margin-right: 20px; } } #nav-mobile > li > a { cursor: default; width: 50px; } */
#FudanTSIBody #nav-mobile > li:last-child > a { width: 50px; }
#nav-mobile li ul { top: 1px; }
/* @@@@ @media only screen and (min-width: 600px) { #nav-mobile li:last-child { line-height: 75px; } }*/ #teamLogo { padding: 0 40px 0 40px; }
#teamLogo img { height: 100%; }
#teamLogo { margin: 5px 0; height: 46px; } /* LC 2019-9-17 @media only screen and (min-width: 601px) { #teamLogo { margin: 5px 0; height: 65px; } }*/
#navList { line-height: inherit; }
#navList.sidenav-trigger { margin: 0 10px; }
#FudanTSIBody .slider .indicators { bottom: 60px; z-index: 100; }
#homepageDivider { width: 100%; height: 20px; position: relative; top: -40px; }
#homepageContent { position: relative; top: -20px; }
#contentBanner { position: relative; min-height: 300px; background: #16283f; width: 100%; }
#contentBanner div.row { height: 100%; }
#contentBanner #figureBannerTitle { position: absolute; left: 4%; bottom: 15%; right: 37%; z-index: 10; padding: 3%; } #contentBanner .hide-on-small-only{ background: #000; } @media only screen and (min-width: 601px) { #contentBanner.figureBanner { min-height: 0; }
#contentBanner.figureBanner > div:last-child { position: absolute; width: 100%; height: 100%; top: 0; right: 0; overflow: hidden; z-index: 9; }
#contentBanner.figureBanner > div:last-child img { width: 100%; }
#contentBanner div.col { height: 100%; } }
#FudanTSIfooter .contactUS { display: block; }
#FudanTSIfooter .contactUS > div { margin: 5px 0; color: rgba(255,255,255, 0.51); /* 0.86 */ }
#pageContentNav, #FudanTSIBody .sidenav { overflow-y: auto; }
#FudanTSIBody .sidenav { height: auto; bottom: 0; }
ul#pageContentNav { border: 0; position: fixed; width: 190px; left: 10%; }
#pageContentNav li, #FudanTSIBody .sidenav li { float: none; /* @@@@ line-height: 34px;*/ /* @@@@ font-size: 18px;*/ padding: 0 10px; }
#FudanTSIBody .sidenav .collapsible-header, #FudanTSIBody .sidenav .collapsible-body, #FudanTSIBody .sidenav .collapsible-body li a { height: auto; /* @@@@ line-height: 28px;*/ }
#FudanTSIBody .sidenav li.active .collapsible-header { background: #e5e6e7; }
#FudanTSIBody #pageContent li.onThisPageNav>a, #FudanTSIBody .sidenav li.onThisPageNav>a { /* @@@@ font-size: 15px;*/ padding: 0 10px; /* @@@@ line-height: 24px;*/ height: auto; }
/* #FudanTSIBody #nav-mobile li > a.thisPageLink,
#FudanTSIBody .sidenav li > a.thisPageLink { background-color: #e5e6e7; }*/
#pageContentNav li > a { display: block; } #FudanTSIBody .sidenav li > a { color: #16283f; display: block; /* @@@@ font-size: 18px;*/ /* @@@@ line-height: 30px;*/ }
#pageContentNav li.onThisPageNav>a:hover { border-left: solid #e5e6e7 2px; transition-duration: 0ms; } #FudanTSIBody .sidenav li.onThisPageNav>a:hover { background-color: rgba(96,169,194, 0.05); border-left: solid #16283f 2px; transition-duration: 0ms; }
#pageContentNav li.onThisPageNav>a.active { border-left: solid #e5e6e7 4px; } #FudanTSIBody .sidenav li.onThisPageNav>a.active { background-color: rgba(96,169,194, 0.05); border-left: solid #16283f 4px; }
@media only screen and (min-width: 992px) { #pageContent main { margin: 0 0 0 270px; } } #pageContent { display: flex; min-height: 100vh; flex-direction: column; }
#FudanTSIBody main { flex: 1 0 auto; }
#FudanTSIBody .sidenavBanner { position: relative; padding: 32px 32px 0; margin-bottom: 8px; }
#FudanTSIBody .sidenavBanner > a { height: auto; padding: 0; display: block; /* @@@@ line-height: 48px;*/ }
#FudanTSIBody .sidenavBanner .background { overflow: hidden; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; }
#slide-out { overflow-y: scroll; }
#slide-out .background { background: #16283f; }
#figDescription { position: fixed; top: 64px; width: 100%; height: 600px; z-index: 900; display: none; background: white; }
#figDescription .card { position: fixed; top: 450px; left: 50px; width: 30%; border-radius: 10px; overflow: hidden; opacity: 0.95; }
#FudanTSIBody .section { margin-top: 70px; }
#FudanTSIBody .section:last-child { margin-bottom: 150px; }
#FudanTSIBody #abstractContent { width: 300px; height: 300px; position: fixed; background: #000; left: 50%; top: 50%; margin: -150px 0 0 -150px; overflow-y: scroll; border-radius: 10px; padding: 30px 0 20px 0; display: none; z-index: 998; }
#FudanTSIBody #abstractContent > a { height: 30px; width: 30px; position: absolute; right: 10px; top: 10px; }
@media only screen and (min-width: 601px) and (min-height: 501px) { #FudanTSIBody #abstractContent { width: 700px; height: 500px; margin: -250px 0 0 -350px; }
#FudanTSIBody #abstractContent > a { /* @@@@ font-size: 40px;*/ /* @@@@ line-height: 40px;*/ position: absolute; right: 20px; top: 20px; } } #acknowledgementPhoto { width: 100%; position: relative; }
#acknowledgementPhoto > div { width: 100%; position: relative; vertical-align: top; }
#acknowledgementPhoto div.row > div { position: relative; padding: 0 10px; margin: 10px 0; overflow: hidden; text-align: center; bottom: 0; }
#acknowledgementPhoto img { width: 100%; }
#FudanTSIBody .z-depth-0_5 { -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 0 -1px rgba(0, 0, 0, 0.16), 0 1px 3px 0 rgba(0, 0, 0, 0.22); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 0 -1px rgba(0, 0, 0, 0.16), 0 1px 3px 0 rgba(0, 0, 0, 0.22); }
#FudanTSIfooter img { margin: 5px 0; }
#FudanTSIfooter div.row { margin: 5px 0; padding: 0; }
#FudanTSIfooter div.row > img { padding: 0 2%; }
#FudanTSIfooter #sponsor { margin-top: 35px; }
#pageContent p > img { width: 100%; margin: 0; }
@media only screen and (min-width: 601px) { #pageContent .left-on-med-and-up { float: left; margin: 1% 3% 1% 0; }
#pageContent .right-on-med-and-up { float: right; margin: 1% 0 1% 3%; }
#pageContent .width20 { width: 20%; }
#pageContent .width30 { width: 30%; }
#pageContent .width40 { width: 40%; }
#pageContent .width45 { width: 45%; } #pageContent .width50 { width: 50%; } #pageContent .width60 { width: 60%; } #pageContent .width70 { width: 70%; } #pageContent .width80 { width: 80%; } } #pageContent .section .row { margin: 25px 0 0 0; }
#FudanTSIBody .FudanGallery { position: relative; width: 70%; }
#FudanTSIBody .FudanGallery > .galleryActive { width: 100%; }
#FudanTSIBody .FudanGallery > .galleryActive img { width: 100%; }
#FudanTSIBody .FudanGallery > .galleryThumbnail { position: relative; width: 100%; margin: 0; overflow-x: scroll; overflow-y: hidden; white-space: nowrap; }
#FudanTSIBody .FudanGallery > .galleryThumbnail::-webkit-scrollbar { display: none; }
#FudanTSIBody .FudanGallery > .galleryThumbnail img { width: 15%; display: inline-block; opacity: 0.7; cursor: pointer; }
@media only screen and (max-width: 991px) { #FudanTSIBody .FudanGallery > .galleryThumbnail img { width: 22%; } } #FudanTSIBody .FudanGallery > .galleryBtnLeft, #FudanTSIBody .FudanGallery > .galleryBtnRight { position: absolute; width: 40px; height: 40px; border-radius: 50%; color: white; /*font-size: 30px;*/ /* @@@@ line-height: 35px;*/ text-align: center; bottom: 3%; cursor: pointer; }
#FudanTSIBody .FudanGallery > .galleryBtnLeft { left: 2%; }
#FudanTSIBody .FudanGallery > .galleryBtnRight { right: 2%; }
#FudanTSIBody .tableHolder { width: 100%; margin: 20px 0 30px 0; }
@media only screen and (max-width: 991px) { #FudanTSIBody .tableHolder { overflow-x: scroll; overflow-y: hidden; } } #FudanTSIBody .tableHolder td, #FudanTSIBody .tableHolder th { padding: 0 10px; padding-right: 10px; }
#FudanTSIBody .tableHolder th { text-align: left; } div.tableHolder tr { border-bottom: 1px solid #b0bec5; } /* blue-grey lighten-3 */ div.tableHolder tr:first-child { border-top: 1px solid #b0bec5; }
#FudanTSIBody .figureHolder { margin: 20px auto 30px auto; } div.figureHolder p>b { font-size: 133%; color: white; }
#FudanTSIBody #pageContent .nameCard { margin-top: 80px; overflow: hidden; }
@media only screen and (min-width: 991px) { #FudanTSIBody #pageContent .nameCard { max-height: 300px; } } #FudanTSIBody #pageContent .nameCard h3, #FudanTSIBody #pageContent .nameCard p, #FudanTSIBody #pageContent .nameCard { }
#FudanTSIBody #pageContent .nameCard img { width: 100%; }
}
ul#pageContentNav li>a { font-size: 1.3rem; line-height: 2.4rem; } li.onThisPageNav>span, li.onThisPageNav>a, .pageSidebar { font-size: 1.3rem; line-height: 2.4rem;
color: #16283f; }
ul.expandable div.active {
border-left: solid #16283f 4px; background-color: rgba(96,169,194, 0.05); }
@media print {
/***** *print media *****/
#FudanTSIdivWrapper{page-break-inside: auto} #FudanTSIBody header{display: none} #FudanTSIBody img{width:100%;display: none} #FudanTSIBody .figureHolder img{display: inherit} #contentBanner>div:first-child{display: none} #contentBanner>div:last-child{display: none} #pageContentNav{display: none} #FudanTSIfooter{display: none} #pageContent{margin: 2cm} #pageContent div{width: 100%} #pageContent main{margin: 0} #top_menu_14{display: none} #emptyBar{display: none} #FudanTSIBody .floatingBtn{display: none} #abstractContent{display: none}
/***** *Font Styles *****/ #FudanTSIBody h1, #FudanTSIBody h2, #FudanTSIBody h3, #FudanTSIBody h4, #FudanTSIBody h5, #FudanTSIBody h6, #FudanTSIBody p, #FudanTSIBody div, #FudanTSIBody table, #FudanTSIBody ol, #FudanTSIBody ul, #FudanTSIBody a, #FudanTSIBody span{ font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; } #FudanTSIBody h1{ font-size: 60px; line-height: 80px; font-weight: 900; page-break-after: always; } #FudanTSIBody h2{ font-size: 30px; line-height: 40px; margin: 30px 0 40px 0; } #FudanTSIBody h3{ font-size: 24px; line-height: 30px; margin: 50px 0 10px 0; } #FudanTSIBody h4{ font-size: 20px; line-height: 30px; margin: 50px 0 0 10px; } #pageContent p, #pageContent .section ul{ font-size: 15px; margin: 23px 0 0 0; line-height: 25px; } #pageContent .section div{ font-size: 15px; line-height: 25px; } #pageContent p{ text-align: justify; text-indent: 30px; } #FudanTSIBody ol#ref li { font-size: 14px; line-height: 20px; margin-top: 15px; }
#FudanTSIBody ol#ref { list-style-type: none; counter-reset: sectioncounter; }
#FudanTSIBody ol#ref li:before { content: "[" counter(sectioncounter) "] "; counter-increment: sectioncounter; }
}