Chris.isaac (Talk | contribs) |
|||
(39 intermediate revisions by 5 users not shown) | |||
Line 1: | Line 1: | ||
− | <html> | + | {{Team:Lethbridge_HS/bootstrapcss}} |
+ | <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/1/19/T—lethbridgehs--hppracticescover_and.jpeg"); | ||
+ | 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; | ||
+ | line-height:20px; | ||
+ | |||
+ | } | ||
+ | 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 --> | <!-- 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--> | <!--Import materialize.css--> | ||
− | |||
<!--Let browser know website is optimized for mobile--> | <!--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/Prototype">PROTOTYPE</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> | ||
+ | <a href="https://2016.igem.org/Team:Lethbridge_HS/Achievements">ACHIEVEMENTS</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 class= "dropdown"> | |
− | + | <a href="#" class="dropdown-toggle" data-toggle = "dropdown">NOTEBOOK<b class="caret"></b></a> | |
− | + | <ul class="dropdown-menu"> | |
− | + | <li> | |
− | + | <a href="https://2016.igem.org/Team:Lethbridge_HS/Notebook">NOTEBOOK</a> | |
− | + | <a href="https://2016.igem.org/Team:Lethbridge_HS/Methods">METHODS</a> | |
− | + | ||
+ | </li> | ||
+ | </ul> | ||
+ | </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>HUMAN 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> | </div> | ||
− | + | ||
− | + | <div class="container-fluid" style="margin-left:5%; margin-right:5%;"> | |
− | + | <div class="row"> | |
+ | <div class="col-md-2" style="padding-right:10%; margin-right:10%;"> | ||
+ | <ul class="sidebar"> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
+ | <div class="col-md-10"> | ||
+ | <h3><b>Background</b></h3> | ||
+ | <a name="first"></a> | ||
+ | <p><font size="4"> Despite the science involved in iGEM, our team also recognized the human practices portion as well. Members of our team participated in a variety of activities to both gain awareness from our community by sharing about our project, and also to gain insight from various individuals. This information guided the next steps that were taken in our project. | ||
+ | |||
+ | </p> | ||
+ | <p><font size="4"> Members of our team worked in a variety of activities including public engagement, a survey, and conducting interviews. We also recognized that since our idea of increasing the efficiency of blood coagulation has never before been attempted by any other iGEM team before, to create a "Best Blood Practices" with the hopes of assisting future iGEM teams. The knowledge gained from working with the blood will be invaluable to future generations of iGEMers. | ||
+ | </p> | ||
+ | </div> | ||
+ | |||
− | < | + | </div> |
− | + | ||
− | + | </body> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</html> | </html> |
Latest revision as of 03:08, 20 October 2016
Background
Despite the science involved in iGEM, our team also recognized the human practices portion as well. Members of our team participated in a variety of activities to both gain awareness from our community by sharing about our project, and also to gain insight from various individuals. This information guided the next steps that were taken in our project.
Members of our team worked in a variety of activities including public engagement, a survey, and conducting interviews. We also recognized that since our idea of increasing the efficiency of blood coagulation has never before been attempted by any other iGEM team before, to create a "Best Blood Practices" with the hopes of assisting future iGEM teams. The knowledge gained from working with the blood will be invaluable to future generations of iGEMers.