Chris.isaac (Talk | contribs) |
18desilvni (Talk | contribs) |
||
(17 intermediate revisions by 5 users not shown) | |||
Line 1: | Line 1: | ||
− | {{Lethbridge_HS}} | + | {{Team:Lethbridge_HS/bootstrapcss}} |
− | <html> | + | <html lang="en"> |
+ | <head> | ||
+ | |||
+ | |||
+ | |||
+ | <!-- Wiki Style Reset (From U of C)--> | ||
+ | <style type="text/css"> | ||
+ | /* Reset the wiki style by overriding with a reset stylesheet. | ||
+ | The relevant wiki css rules are reset by using rules with higher priority. | ||
+ | (Written by Florian Albrecht) | ||
+ | Shoutout to the 2016 U of C wiki */ | ||
+ | /* Start general reset ================================================== */ | ||
+ | html body {font-size: inherit;font-family: inherit;background-color: transparent;color: inherit;padding: 0;} | ||
+ | div#globalWrapper {font-size: inherit;margin: 0;padding: 0;position: static;width: auto;} | ||
+ | /* Start top-section reset ============================================== */ | ||
+ | div#top-section {border: 0;height: auto;margin: 0;position: static;width: auto;} | ||
+ | div#p-logo {height: auto;position: static;width: auto;z-index: auto;} | ||
+ | div#p-logo a, div#p-logo a:hover {text-decoration: none; font-family: 'Roboto', sans-serif;} | ||
+ | div#menubar {font-family: inherit;font-size: inherit;line-height: inherit;position: static;top: 0px;white-space: normal;width: auto;z-index: auto;} | ||
+ | div.left-menu, div.left-menu a {color: inherit;left: 0;text-align: left;text-transform: none;font-family: 'Roboto', sans-serif;} | ||
+ | div#menubar ul {color: inherit;list-style: disc outside none;margin: 0;padding: 0; font-family: 'Roboto', sans-serif;} | ||
+ | div#menubar li {cursor: auto;display: list-item;padding: 0;margin: 0;position: static; font-family: 'Roboto', sans-serif;} | ||
+ | div.left-menu li a {padding: 0; font-family: 'Roboto', sans-serif;} | ||
+ | div.left-menu:hover {color: inherit;background-color: transparent;} | ||
+ | div.left-menu:hover a {color: inherit;font-family: 'Roboto', sans-serif;} | ||
+ | div.right-menu, div.right-menu a {color: inherit;right: 0;text-align: left;font-family: 'Roboto', sans-serif;} | ||
+ | div.right-menu li a {background-color: transparent;color: inherit;padding: 0;font-family: 'Roboto', sans-serif;} | ||
+ | div.right-menu li a:hover {color: inherit;text-decoration: none;font-family: 'Roboto', sans-serif;} | ||
+ | div#search-controls {background-color: transparent;height: auto;position: static;right: 0;text-align: left;top: 0;width: auto;z-index: auto;} | ||
+ | /* Start content reset ================================================== */ | ||
+ | div#content {background: transparent;border: 0;color: inherit;line-height: inherit;margin: 0;padding: 0;position: static;width: auto;z-index: auto;} | ||
+ | body li {margin: 0; font-family: 'Roboto', sans-serif;} | ||
+ | body h1, body h2, body h3, body h4, body h5, body h6 {background: transparent;border: 0;color: inherit;padding: 0; font-family: 'Roboto', sans-serif;} | ||
+ | body .firstHeading {margin: 0;} | ||
+ | div#contentSub {color: inherit;font-size: inherit;line-height: inherit;margin: 0;width: auto;} | ||
+ | div#catlinks {background-color: transparent;border: 0;clear: both;margin: 0;padding: 0;} | ||
+ | /* Start footer reset =================================================== */ | ||
+ | div#footer-box {background-color: transparent;border: 0;margin: 0;padding: 0;width: auto;} | ||
+ | div#footer {color: inherit;font-size: inherit;text-align: left;} | ||
+ | div#f-poweredbyico, div#f-copyrightico {float: none;} | ||
+ | div#footer li {margin: 0;display: list-item; font-family: 'Roboto', sans-serif;} | ||
+ | </style> | ||
+ | <!-- SideMenu for iGEM Stuff --> | ||
+ | <style type="text/css"> | ||
+ | #sideMenu{width: 200px;position: absolute;top: 20px;left: 1020px;z-index: 10;padding-top: 0px;padding-bottom: 15px;padding-left: 15px;padding-right: 15px;background-color: white;text-align: left;display: none;z-index: 9996;} | ||
+ | #content{width: 100%;padding: 0px;margin-left: 0px;} | ||
+ | #top_title{overflow: hidden;display: none;} | ||
+ | #top_menu_14{height: 20px;} | ||
+ | #top_menu_under{height: 0px;} | ||
+ | #globalWrapper{padding-bottom: 200px;} | ||
+ | </style> | ||
+ | <!-- Custom Styling --> | ||
+ | <style> | ||
+ | a {list-style-image: none;} | ||
+ | ul {list-style-image: none;} | ||
+ | ol {list-style-image: none;} | ||
+ | li {list-style-image: none;} | ||
+ | </style> | ||
− | |||
− | |||
+ | <style> | ||
+ | body{ | ||
+ | background-color: white; | ||
+ | font-family: 'Open Sans', sans-serif; | ||
+ | } | ||
+ | .jumbotron { | ||
+ | background-color: white; | ||
+ | position: relative; | ||
+ | } | ||
+ | .slide{ | ||
+ | width:100%; | ||
+ | |||
+ | margin: 0; | ||
+ | |||
+ | } | ||
+ | #slide0{ | ||
+ | background-image: url("https://static.igem.org/mediawiki/2016/9/9c/T—lethbridgehs--IMG_4553_cover_and.png"); | ||
+ | background-size:cover; | ||
+ | background-position: center center; | ||
+ | background-repeat: no-repeat; | ||
+ | height: 50vh; | ||
+ | overflow: hidden; | ||
+ | margin: 0; | ||
+ | padding-top: 5%; | ||
+ | background-color: #333333; | ||
+ | } | ||
+ | #firsttitle{ | ||
+ | vertical-align: center; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | text-align: left; | ||
+ | color: white; | ||
+ | vertical-align: center; | ||
+ | position:absolute; | ||
+ | bottom:0; | ||
− | + | ||
− | + | font-size: 8em; | |
− | + | } | |
− | + | #secondtitle{ | |
− | + | vertical-align: center; | |
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | text-align: center; | ||
+ | color: white; | ||
+ | vertical-align: middle; | ||
+ | top: 25%; | ||
+ | font-size: 2em; | ||
+ | } | ||
+ | .slidesecondlist{ | ||
+ | list-style-type: none; | ||
+ | margin-left: 15%; | ||
+ | } | ||
+ | .slidesecondlist ul{ | ||
+ | margin: 0; | ||
+ | padding: 20px; | ||
+ | background-color: none; | ||
+ | } | ||
+ | #slidesecond{ | ||
− | + | overflow: hidden; | |
+ | margin: 0; | ||
+ | padding-top: 0; | ||
+ | padding: 0; | ||
+ | background-color: #eee7dd; | ||
+ | } | ||
+ | #slide_project_0{ | ||
+ | background-image: url("images/funnyteamcover.png"); | ||
+ | background-size:cover; | ||
+ | background-position: center -10%; | ||
+ | background-repeat: no-repeat; | ||
+ | height: 90%; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | #slide_team_0{ | ||
+ | background-image: url("images/IMG_4553.jpg"); | ||
+ | background-size:cover; | ||
+ | background-position: center -10%; | ||
+ | background-repeat: no-repeat; | ||
+ | height: 90%; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | #slide_hp_0{ | ||
+ | background-image: url("images/funnyteamcover.png"); | ||
+ | background-size:cover; | ||
+ | background-position: center -10%; | ||
+ | background-repeat: no-repeat; | ||
+ | height: 90%; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | #slide0title{ | ||
+ | color: white; | ||
+ | display: block; | ||
+ | margin: auto; | ||
+ | text-align: center; | ||
+ | } | ||
+ | #blooddrop{ | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | margin: 0 auto; | ||
+ | z-index: 1; | ||
+ | -webkit-animation: fadeInOut 2s infinite; | ||
+ | -moz-animation: fadeInOut 2s infinite; | ||
+ | -o-animation: fadeInOut 2s infinite; | ||
+ | animation: fadeInOut 2s infinite; | ||
+ | } | ||
+ | #slide1{ | ||
+ | /*background-color:#eee7dd;*/ | ||
+ | background-color:white; | ||
+ | /* background-image: url("images/289680_1231091663_large.jpg"); | ||
+ | background | ||
+ | background-size:cover; | ||
+ | background-position: center center; | ||
+ | background-repeat: no-repeat;*/ | ||
+ | color: black; | ||
+ | |||
+ | } | ||
+ | #slide1Sub{ | ||
+ | margin-left: 10%; | ||
+ | margin-right: 10%; | ||
+ | |||
+ | } | ||
+ | #slide2{ | ||
+ | /* background-image: url("images/anotherteamcover.png");*/ | ||
+ | background-color: green; | ||
+ | background-size: cover; | ||
+ | background-position: center center; | ||
+ | background-repeat: no-repeat; | ||
+ | } | ||
+ | #slide6{ | ||
+ | |||
+ | } | ||
+ | #slide3{ | ||
+ | background-color: #cf4848; | ||
+ | height: 90%; | ||
+ | padding-top:2%; | ||
+ | }ding-top:1%; | ||
+ | #slide1title{ | ||
+ | color:red; | ||
+ | text-align: center; | ||
+ | font-size:60px; | ||
+ | margin-top:0%; | ||
+ | } | ||
+ | #slide12ndline{ | ||
+ | color:red; | ||
+ | text-align: center; | ||
+ | font-size:50px; | ||
+ | } | ||
+ | #slide1para{ | ||
+ | font-size: 1.1em; | ||
+ | color: black; | ||
+ | } | ||
+ | .logo{ | ||
+ | float:left; | ||
+ | margin-left:9%; | ||
+ | margin-top: 1%; | ||
+ | } | ||
+ | .navbar-header{ | ||
+ | margin-top:-20px; | ||
+ | } | ||
+ | .navbar-default{ | ||
+ | /** box-shadow: 0px 8px 6px -6px #999;**/ | ||
+ | |||
+ | } | ||
+ | .navbar-default .navbar-nav>li>a { | ||
+ | color: white; | ||
+ | font-size: 15px; | ||
+ | padding-top:2px; | ||
+ | padding-top:2px; | ||
+ | margin-top: 12px; | ||
+ | } | ||
+ | .navbar-collapse.collapse { | ||
+ | padding-bottom: 6px; | ||
+ | padding-top: 3px; | ||
+ | } | ||
+ | .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover { | ||
+ | color: white; | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | .removeNavBarColor{ | ||
+ | background-color: transparent; | ||
+ | |||
+ | } | ||
+ | .makeNavBarColor{ | ||
+ | /** background-color: #CC141C ;*/ | ||
+ | background-color: #dc4640 ; | ||
+ | |||
+ | |||
+ | } | ||
+ | .navbar-default .navbar-nav>li>a{ | ||
+ | padding-top: 30px; | ||
+ | margin-top: 0; | ||
+ | margin-bottom: 0%; | ||
+ | padding-bottom: 15px; | ||
+ | color:white; | ||
+ | } | ||
+ | .navbar-collapse.collapse{ | ||
+ | padding-top: 0; | ||
+ | padding-bottom: 0; | ||
+ | } | ||
+ | @-webkit-keyframes fadeInOut{ | ||
+ | 0% { opacity: 0;} | ||
+ | 50% { opacity: 1; } | ||
+ | 100% { opacity:0;} | ||
+ | } | ||
+ | @-moz-keyframes fadeInOut{ | ||
+ | 0% { opacity: 0;} | ||
+ | 50% { opacity: 1; } | ||
+ | 100% { opacity:0;} | ||
+ | } | ||
+ | @-o-keyframes fadeInOut{ | ||
+ | 0% { opacity: 0;} | ||
+ | 50% { opacity: 1; } | ||
+ | 100% { opacity:0;} | ||
+ | } | ||
+ | @keyframes fadeInOut{ | ||
+ | 0% { opacity: 0;} | ||
+ | 50% { opacity: 1; } | ||
+ | 100% { opacity:0;} | ||
+ | } | ||
+ | [class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after { | ||
+ | font-family: Flaticon; | ||
+ | font-size: 30px; | ||
+ | font-style: normal; | ||
+ | margin-left: 0px; | ||
+ | color: white; | ||
+ | |||
+ | } | ||
+ | .glyph { | ||
+ | display: inline-block; | ||
+ | width: 9em; | ||
+ | margin: 1em; | ||
+ | text-align: center; | ||
+ | vertical-align: top; | ||
+ | background: #FFF; | ||
+ | float: left; | ||
+ | } | ||
+ | .glyph .glyph-icon { | ||
+ | display:inline-block; | ||
+ | float: left; | ||
+ | |||
+ | font-family:"Flaticon"; | ||
+ | font-size: 64px; | ||
+ | } | ||
+ | .glyph .glyph-icon:before { | ||
+ | font-size: 64px; | ||
+ | color: white; | ||
+ | margin-left: 0; | ||
+ | } | ||
+ | |||
+ | .menuIcon{ | ||
+ | |||
+ | } | ||
+ | .active{ | ||
+ | background-color: red; | ||
+ | color: white !important; | ||
+ | } | ||
+ | [class^="active"]:before, [class*="active"]:before, [class^="active"]:after, [class*="active"]:after { | ||
+ | color: white; | ||
+ | } | ||
+ | .menuIcon:before, | ||
+ | .menuIcon:after { | ||
+ | |||
+ | font-size: 20px; | ||
+ | |||
+ | } | ||
+ | .menuIcon2:after { | ||
+ | |||
+ | font-size: 40px; | ||
+ | |||
+ | } | ||
+ | |||
+ | .coverCircle{ | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | .sidebar{ | ||
+ | list-style-type: none; | ||
+ | list-style-position: inside; | ||
+ | color: #cc141c; | ||
+ | font-size: 1em; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | } | ||
+ | .sidebar li{ | ||
+ | list-style-position: inside; | ||
+ | padding-top: 20px; | ||
+ | color: #cc141c; | ||
+ | font-size: 2em; | ||
+ | |||
+ | |||
+ | } | ||
+ | a:visited { | ||
+ | color: #cc141c; | ||
+ | |||
+ | } | ||
+ | |||
+ | .fixSideBar{ | ||
+ | position: fixed; | ||
+ | top: 8%; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | } | ||
+ | .removeFixSideBar{ | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | } | ||
+ | |||
+ | .outerBar{ | ||
+ | position: relative; | ||
+ | word-wrap:break-word; | ||
+ | } | ||
+ | .fixNoteBookSideBar{ | ||
+ | position: fixed; | ||
+ | top: 8%; | ||
+ | right: 0; | ||
+ | |||
+ | } | ||
+ | .removeFixNoteBookSideBar{ | ||
+ | |||
+ | } | ||
+ | .profilePicBox{ | ||
+ | width: 100%; | ||
+ | |||
+ | |||
+ | background-color: red; | ||
+ | margin-top: 10px; | ||
+ | padding: 0; | ||
+ | |||
+ | } | ||
+ | .profilePicBox img{ | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | |||
+ | } | ||
+ | .profileInfoBox{ | ||
+ | display: none; | ||
+ | background-color: white; | ||
+ | position: absolute; | ||
+ | z-index: 1000; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | padding-right: 2em; | ||
+ | } | ||
+ | .showInfoBox{ | ||
+ | display: block; | ||
+ | } | ||
+ | .makeGray{ | ||
+ | -webkit-filter: grayscale(100%); | ||
+ | filter: grayscale(100%); | ||
+ | } | ||
+ | .noteBookMonthLabels{ | ||
+ | margin: left:3%; | ||
+ | } | ||
+ | #datelist{ | ||
+ | display: none; | ||
+ | } | ||
+ | #dateList li{ | ||
+ | list-style-type: none; | ||
+ | font-size: 1em; | ||
+ | } | ||
+ | .notebookSidebar{ | ||
+ | width: inherit; | ||
+ | } | ||
+ | .notebookSideBar h1{ | ||
+ | padding-top:5px; | ||
+ | padding-bottom: 5px; | ||
+ | font-size: 2em; | ||
+ | } | ||
+ | .notebookIcon { | ||
+ | font-size: 0px; | ||
+ | cursor: pointer; | ||
+ | width: auto; | ||
+ | height: auto; | ||
+ | text-align: center; | ||
+ | position: relative; | ||
+ | z-index: 1; | ||
+ | color: #fff; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | .notebookIcon:before { | ||
+ | font-family: 'Flaticon'; | ||
+ | speak: none; | ||
+ | font-size: 35px; | ||
+ | line-height: 35xp; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | font-variant: normal; | ||
+ | text-transform: none; | ||
+ | color: white; | ||
+ | display: block; | ||
+ | -webkit-font-smoothing: antialiased; | ||
+ | text-align:center; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | vertical-align: center; | ||
+ | position: relative; | ||
+ | top:5%; | ||
+ | transform: translateY(-5%); | ||
+ | } | ||
+ | /*****************************************Time line*********************************/ | ||
+ | .timeline{ | ||
+ | list-style: none; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | .timeline li{ | ||
+ | position: relative; | ||
+ | } | ||
+ | .tl_month{ | ||
+ | width: 100%; | ||
+ | height: 50px; | ||
+ | background-color: #ee4d4d; | ||
+ | margin-bottom: 15px; | ||
+ | vertical-align: center; | ||
+ | padding-top: 0.75%; | ||
+ | padding-left: auto; | ||
+ | padding-right: auto; | ||
+ | color:white; | ||
+ | } | ||
+ | .tl_month h2{ | ||
+ | float:inherit; | ||
+ | margin-top: auto; | ||
+ | margin-bottom: auto; | ||
+ | color: white; | ||
+ | } | ||
+ | .tl_time { | ||
+ | display: block; | ||
+ | width: 25%; | ||
+ | margin-top:2%; | ||
+ | padding-right: 100px; | ||
+ | position: absolute; | ||
+ | font-size:20; | ||
+ | color:#ee4d4d; | ||
+ | } | ||
+ | /**************************How to make font size on notebook responsive*******/ | ||
+ | .tl_label{ | ||
+ | margin-bottom: 15px; | ||
+ | margin-left: 25%; | ||
+ | color: black; | ||
+ | border: 3px solid #ee4d4d; | ||
+ | position: relative; | ||
+ | border-radius: 5px; | ||
+ | background: white; | ||
+ | padding-left: 2%; | ||
+ | padding-right: 2%; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | .tl_label h2{ | ||
+ | margin-bottom: 15px; | ||
+ | font-size: 1.3em; | ||
+ | } | ||
+ | .tl_label:before{ | ||
+ | right: 100%; | ||
+ | border: solid transparent; | ||
+ | content: ''; | ||
+ | height: 0; | ||
+ | width: 0; | ||
+ | position: absolute; | ||
+ | pointer-events: none; | ||
+ | border-right-color: #ee4d4d; | ||
+ | border-width: 1vw; | ||
+ | /*top: 1vw;*/ | ||
+ | } | ||
+ | .dateContent{ | ||
+ | display: none; | ||
+ | padding: 10px; | ||
+ | } | ||
+ | .tl_icon{ | ||
+ | width: 40px; | ||
+ | height: 40px; | ||
+ | position: absolute; | ||
+ | background: #ee4d4d; | ||
+ | margin-top:1%; | ||
+ | border-radius: 50%; | ||
+ | box-shadow: 0 0 0 8px #ee4d4d; | ||
+ | top:0; | ||
+ | |||
+ | position: relative; | ||
+ | float: left; | ||
+ | left: auto; | ||
+ | left: 20%; | ||
+ | margin-left: -25px; | ||
+ | } | ||
+ | .tl_icon img{ | ||
+ | margin-top:4px; | ||
+ | margin-left: 2px; | ||
+ | } | ||
+ | .caption{ | ||
+ | text-align:center; | ||
+ | } | ||
+ | .topOfTimeLineEntry{ | ||
+ | |||
+ | } | ||
+ | .dropdown:hover .dropdown-menu { | ||
+ | display: block; | ||
+ | } | ||
+ | /*******************************************************************/ | ||
+ | .an-slide-title{ | ||
+ | text-align: center; | ||
+ | } | ||
+ | .an-slide-img{ | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | .animatedSlide{ | ||
+ | background-color: transparent; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | .carousel-indicators{ | ||
+ | bottom: -8%; | ||
+ | padding-bottom: 0; | ||
+ | margin-bottom: | ||
+ | |||
+ | } | ||
+ | .sidebar{ | ||
+ | padding-top: 10px; | ||
+ | } | ||
+ | #homepageslide5{ | ||
+ | background-color: #343838 ; | ||
+ | height: 30%; | ||
+ | } | ||
+ | .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { | ||
+ | color: white; | ||
+ | } | ||
+ | .containerForExploreTeam{ | ||
+ | height: 100%; | ||
+ | } | ||
+ | .exploreteam{ | ||
+ | display: inline-block; | ||
+ | float: left; | ||
+ | text-align: center; | ||
+ | color: white; | ||
+ | vertical-align: middle; | ||
+ | position: relative; | ||
+ | top: 25%; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | #homepageslide6{ | ||
+ | background-color: black; | ||
+ | } | ||
+ | #credits{ | ||
+ | color: white; | ||
+ | } | ||
+ | .button{ | ||
+ | float: left; | ||
+ | display: inline-block; | ||
+ | border-radius: 30px; | ||
+ | background-color: #ee4d4d; | ||
+ | padding: 1.5% 2%; | ||
+ | color: white; | ||
+ | position: relative; | ||
+ | text-align: center; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | .constantSidebar{ | ||
+ | background-color: red; | ||
+ | position: fixed; | ||
+ | |||
+ | } | ||
+ | .jumbotron { | ||
+ | padding: 0; | ||
+ | } | ||
+ | .menuitem{ | ||
+ | width: 100%; | ||
+ | padding-right: 20px; | ||
+ | padding-top: 8px; | ||
+ | } | ||
+ | .menuitem p{ | ||
+ | float: right; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | .subHeaderContainer{ | ||
+ | width: 100%; | ||
+ | background-color: red; | ||
+ | } | ||
+ | .doublepic1 h1{ | ||
+ | display: block; | ||
+ | text-align: center; | ||
+ | color: white; | ||
+ | vertical-align: middle; | ||
+ | font-size: 3em; | ||
+ | top: 25%; | ||
+ | } | ||
+ | .doublepic2 h1{ | ||
+ | display: block; | ||
+ | text-align: center; | ||
+ | color: white; | ||
+ | font-size: 3em; | ||
+ | vertical-align: middle; | ||
+ | top: 25%; | ||
+ | } | ||
+ | .doublepic1{ | ||
+ | float: left; | ||
+ | height: 50%; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | width: 50%; | ||
+ | background-image: url("images/Learning-More-About-The-Latest-Science-Research-1.jpg"); | ||
+ | background-size:cover; | ||
+ | background-repeat: no-repeat; | ||
+ | } | ||
+ | .doublepic2{ | ||
+ | float: left; | ||
+ | height: 50%; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | width: 50%; | ||
+ | background-image: url("images/LethHS_Group_Photo1.jpg"); | ||
+ | background-size:cover; | ||
+ | background-repeat: no-repeat; | ||
+ | } | ||
+ | .sidebarright{ | ||
+ | float:left; | ||
+ | width:20%; | ||
+ | |||
+ | } | ||
+ | |||
+ | .contentleft{ | ||
+ | float:left; | ||
+ | width:80%; | ||
+ | |||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!-- Import Google Icon Font --> | ||
+ | <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> | ||
+ | <!-- Roboto Font --> | ||
+ | <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> | ||
+ | <!--Import materialize.css--> | ||
+ | <!--Let browser know website is optimized for mobile--> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | ||
+ | <!-- Page Title --> | ||
+ | <title>Lethbridge HS iGEM 2016</title> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <meta charset="utf-8"> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
+ | |||
+ | <!--<link rel="stylesheet" href="https://2016.igem.org/Team:Lethbridge_HS/bootstrapcss?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" href="https://2016.igem.org/Team:Lethbridge_HS/maincss?action=raw&ctype=text/css"> --> | ||
+ | <link rel="stylesheet" href="flaticon.css"> | ||
+ | <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"> | ||
+ | <script src="https://2016.igem.org/Team:Lethbridge_HS/bootstrapmin?action=raw&ctype=text/javascript"></script> | ||
+ | <script src="https://2016.igem.org/Team:Lethbridge_HS/localscrollmin?action=raw&ctype=text/javascript" type="text/javascript"></script> | ||
+ | <script src="https://2016.igem.org/Team:Lethbridge_HS/scrolltomin?action=raw&ctype=text/javascript" type="text/javascript"></script> | ||
+ | |||
+ | |||
+ | |||
+ | <link rel="stylesheet" href="animations.css"> | ||
+ | |||
+ | <script type="text/javascript"> | ||
+ | $(document).ready(function(){ | ||
+ | $('#blooddrop').addClass('delay-2000 animated pulse'); | ||
+ | var s = $(".menu"); | ||
+ | s.addClass("removeNavBarColor"); | ||
+ | $(window).scroll(function(){ | ||
+ | var windowPos = $(window).scrollTop(); | ||
+ | |||
+ | if (windowPos >= 50){ | ||
+ | s.addClass("makeNavBarColor"); | ||
+ | s.removeClass("removeNavBarColor"); | ||
+ | |||
+ | } | ||
+ | else{ | ||
+ | s.addClass("removeNavBarColor"); | ||
+ | s.removeClass("makeNavBarColor"); | ||
+ | } | ||
+ | }) | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | </script> | ||
+ | </head> | ||
+ | |||
+ | <body> | ||
+ | <nav class="navbar navbar-default navbar-fixed-top menu" style="border:none;"> | ||
+ | <div class="container-fluid" style="padding-left:10%; padding-right:10%;"> | ||
+ | <div class="navbar-header"> | ||
+ | <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar1" aria-expanded="false"> | ||
+ | <span class="sr-only">Toggle navgiation</span> | ||
+ | <span class="icon-bar"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | </button> | ||
+ | <a class="navbar-brand" href="https://2016.igem.org/Team:Lethbridge_HS" style="color:#CC141C; margin-top:20%;"><img src="https://static.igem.org/mediawiki/2016/5/50/T—lethbridgehs--whitelogo_and.png" width="70"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="collapse navbar-collapse" id="navbar1"> | ||
+ | <ul class="nav navbar-nav navbar-right" > | ||
+ | |||
+ | |||
+ | <li class= "dropdown"> | ||
+ | <a href="#" class="dropdown-toggle" data-toggle = "dropdown">PROJECT<b class="caret"></b></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Description">DESCRIPTION</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Design">DESIGN</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Proof">PROOF OF CONCEPT</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Experiments">EXPERIMENTS</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Results">RESULTS</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li class= "dropdown"> | ||
+ | <a href="#" class="dropdown-toggle" data-toggle = "dropdown">PARTS<b class="caret"></b></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Basic_Part">BASIC PARTS</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Composite_Part">COMPOSITE PARTS</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | |||
+ | |||
+ | <li class= "dropdown"> | ||
+ | <a href="#" class="dropdown-toggle" data-toggle = "dropdown">HUMAN PRACTICES<b class="caret"></b></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Human_Practices">HUMAN PRACTICES</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/HP/Silver">SILVER</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/HP/Gold">GOLD</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Integrated_Practices">INTEGRATED HUMAN PRACTICES</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Engagement">ENGAGEMENT</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <li><a href="https://2016.igem.org/Team:Lethbridge_HS/Notebook" style="" class="menuitem" style="margin:0; padding:0;">NOTEBOOK</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:Lethbridge_HS/Safety" style="" class="menuitem" style="margin:0; padding:0; ">SAFETY</a></li> | ||
+ | |||
+ | <li class= "dropdown"> | ||
+ | <a href="#" class="dropdown-toggle" data-toggle = "dropdown">TEAM<b class="caret"></b></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Team#students">STUDENTS</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Team#students">ADVISORS</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Team#students">SPONSORS</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Attributions">ATTRIBUTIONS</a> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Collaborations">COLLABORATIONS</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li><a href="https://igem.org/Main_Page" style="" class="menuitem" style="margin:0; padding:0 ">IGEM</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | </nav> | ||
+ | |||
+ | <div class="jumbotron slide" id="slide0" style=""> | ||
+ | <div class="container-fluid" style="margin-left:10%;"> | ||
+ | <h1 id="firsttitle" style=""> <b>INTEGRATED PRACTICES</b></h1> | ||
+ | <!--<div style="position:relative;"> | ||
+ | <video width="100%" autoplay muted loop style="float:left; position:absolute; z-index:5;"> | ||
+ | <source src="Product%20Demonstration%20Video%20for%20Lumify%20USB%20Solar%20Fairy%20Lights.mp4" type="video/mp4"> | ||
+ | </video> | ||
+ | </div>--> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <div class="container-fluid" style="margin-left:10%; margin-right:10%;"> | ||
+ | <div class="row"> | ||
+ | <div class="col-md-2"> | ||
+ | <ul class="sidebar"> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
+ | <div class="col-md-11"> | ||
+ | <p><font="4"><font size="3.5">Members of our team conducted a number of interviews with professionals and experts involved with various aspects of our project, such as blood coagulation and medicine in general.</p> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
+ | </body> | ||
</html> | </html> |
Latest revision as of 03:52, 20 October 2016
Members of our team conducted a number of interviews with professionals and experts involved with various aspects of our project, such as blood coagulation and medicine in general.