|
|
| Line 1: |
Line 1: |
| − | /* @import 'base/igem'; */
| + | <html> |
| − | /***************************************************** DEFAULT WIKI SETTINGS ****************************************************/
| + | <!-- ####################################################### --> |
| − | /* Clear the default wiki settings */
| + | <!-- # This html was produced by the igemwiki generator # --> |
| − | @import url("https://fonts.googleapis.com/css?family=Lato:400,700,900|Inconsolata");
| + | <!-- # https://github.com/igemuoftATG/generator-igemwiki # --> |
| − | #home_logo, #sideMenu { | + | <!-- ####################################################### --> |
| − | display: none; }
| + | |
| | | | |
| − | #sideMenu, #top_title, .patrollink {
| + | <!-- repo for this wiki: https://github.com/igemuoftATG/wiki17 --> |
| − | display: none; }
| + | |
| | | | |
| − | #content {
| + | </html> |
| − | width: 100%;
| + | {{Toronto/head}} |
| − | padding: 0px;
| + | <html> |
| − | margin-top: -12px;
| + | |
| − | margin-left: 0px; }
| + | |
| | | | |
| − | html {
| + | <div class="section"> |
| − | font-size: 10px; } | + | <div class="container-home"> |
| | + | <div class="home-left lg-height"> |
| | + | <div class="container center-align text-center"> |
| | + | <img src="https://static.igem.org/mediawiki/2017/f/f1/T--Toronto--2017_igemTO2017-logo.svg" alt="logo" height='100'> |
| | + | <div id="navbarSearch"> |
| | + | <form> |
| | + | <input type="text" name="currency" id="autocomplete" placeholder='Find any page...'/> |
| | + | </form> |
| | + | <div id="search"> |
| | + | <ul id='auto-suggest'> |
| | + | </ul> |
| | + | </div> |
| | + | </div> |
| | + | <h3 class='text-dark-cyan'>Get started here:</h3> |
| | + | <div class="container-home"> |
| | + | <div class="center-align"> |
| | + | <ul> |
| | + | <li style='padding: 5px 0.75em 0 0.75em;'><span class='text-white'>• </span><a class='text-white' href="https://2017.igem.org/Team:Toronto">Home</a></li> |
| | + | <li style='padding: 5px 0.75em 0 0.75em;'><span class='text-grey'>• </span><a class='text-white' href="https://2017.igem.org/Team:Toronto/Team">Team</a></li> |
| | + | <li style='padding: 5px 0.75em 0 0.75em;'><span class='text-red'>• </span><a class='text-white' href="https://2017.igem.org/Team:Toronto/Wetlab">Wetlab</a></li> |
| | + | <li style='padding: 5px 0.75em 0 0.75em;'><span class='text-yellow'>• </span><a class='text-white' href="https://2017.igem.org/Team:Toronto/Drylab">Drylab</a></li> |
| | + | <li style='padding: 5px 0.75em 0 0.75em;'><span class='text-cyan'>• </span><a class='text-white' href="https://2017.igem.org/Team:Toronto/Human_Practices">Human Practices</a></li> |
| | + | </ul> |
| | + | </div> |
| | + | </div> |
| | + | </div> |
| | + | </div> |
| | | | |
| − | body {
| + | <div class="home-right lg-height bg-home"> |
| − | background-color: white; }
| + | <div class="container text-white center-align text-center"> |
| − | | + | <h1>LOV Is Lit</h1> |
| − | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5, #bodyContent p, #bodyContent a, #bodyContent li, #bodyContent pre, #HQ_page h1, #HQ_page h2, #HQ_page h3, #HQ_page h4, #HQ_page h5, #HQ_page p, #HQ_page a, #HQ_page li, #HQ_page pre, #mw-content-text h1, #mw-content-text h2, #mw-content-text h3, #mw-content-text h4, #mw-content-text h5, #mw-content-text p, #mw-content-text a, #mw-content-text li, #mw-content-text pre {
| + | </div> |
| − | padding: 0;
| + | </div> |
| − | border: none;
| + | </div> |
| − | text-align: unset;
| + | </div> |
| − | background: none; }
| + | </html> |
| − | | + | {{Toronto/footer}} |
| − | #HQ_page table {
| + | |
| − | border: none;
| + | |
| − | margin: 0; }
| + | |
| − | | + | |
| − | /* Grids */
| + | |
| − | .row {
| + | |
| − | margin: 0; }
| + | |
| − | | + | |
| − | #globalWrapper {
| + | |
| − | font-size: 100%; }
| + | |
| − | | + | |
| − | .mw-content-ltr ol, .mw-content-rtl .mw-content-ltr ol {
| + | |
| − | margin: 0; }
| + | |
| − | | + | |
| − | .mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul {
| + | |
| − | margin: 0; }
| + | |
| − | | + | |
| − | /**************************************************************** MENU ***************************************************************/
| + | |
| − | #top_menu_14 {
| + | |
| − | border-bottom: none; }
| + | |
| − | | + | |
| − | #top_menu_inside ul li a {
| + | |
| − | font-size: 1rem !important; }
| + | |
| − | #top_menu_inside ul li a:hover {
| + | |
| − | text-decoration: none; | + | |
| − | font-weight: 400; }
| + | |
| − | | + | |
| − | /* Wrapper for the menu */
| + | |
| − | .igem_2017_menu_wrapper {
| + | |
| − | width: 15%;
| + | |
| − | height: 100vh;
| + | |
| − | position: fixed;
| + | |
| − | right: 0%;
| + | |
| − | padding: 0px;
| + | |
| − | float: right;
| + | |
| − | border-left: 1px solid #d3d3d3;
| + | |
| − | background-color: #dddddd;
| + | |
| − | text-align: left;
| + | |
| − | font-family: Tahoma, Geneva, sans-serif;
| + | |
| − | overflow-y: auto;
| + | |
| − | overflow-x: hidden; }
| + | |
| − | | + | |
| − | /* this hides the scrollbar to keep view consistency */
| + | |
| − | .igem_2017_menu_wrappe::-webkit-scrollbar {
| + | |
| − | display: none; }
| + | |
| − | | + | |
| − | /* styling for links in the menu, removes the line under text */
| + | |
| − | .igem_2017_menu_wrapper a {
| + | |
| − | text-decoration: none; }
| + | |
| − | | + | |
| − | /* styling for the images in the menu */
| + | |
| − | .igem_2017_menu_wrapper img {
| + | |
| − | width: 100%; }
| + | |
| − | | + | |
| − | /* styling for the menu buttons */
| + | |
| − | .igem_2017_menu_wrapper .menu_button {
| + | |
| − | width: 100%;
| + | |
| − | padding: 10px 0px 10px 15px;
| + | |
| − | float: left;
| + | |
| − | border-bottom: 1px solid #d3d3d3;
| + | |
| − | font-size: 12px;
| + | |
| − | font-weight: bold;
| + | |
| − | color: #5e5f5f;
| + | |
| − | cursor: pointer; }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper .menu_bottom_padding {
| + | |
| − | width: 100%;
| + | |
| − | height: 30px;
| + | |
| − | float: left; }
| + | |
| − | | + | |
| − | .menu_button.direct_to_page {
| + | |
| − | padding-left: 36px; }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper .menu_button .expand_collapse_icon {
| + | |
| − | width: 10%;
| + | |
| − | float: left; }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper .menu_button .expand_collapse_icon::before {
| + | |
| − | content: "+"; }
| + | |
| − | | + | |
| − | .open::before {
| + | |
| − | content: "-" !important; }
| + | |
| − | | + | |
| − | /* styling for the menu buttons on hover */
| + | |
| − | .igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover, .submenu_button.current_page:hover {
| + | |
| − | background-color: #3399ff;
| + | |
| − | text-decoration: none;
| + | |
| − | color: #ffffff; }
| + | |
| − | | + | |
| − | /* styling for the menu button when it is the current page */
| + | |
| − | .current_page {
| + | |
| − | background-color: #7fc1f7 !important;
| + | |
| − | color: #5e5f5f !important; }
| + | |
| − | | + | |
| − | /* styling for the submenu buttons */
| + | |
| − | .igem_2017_menu_wrapper .submenu_button {
| + | |
| − | width: 100%;
| + | |
| − | padding: 10px 0px 10px 34px;
| + | |
| − | float: left;
| + | |
| − | background-color: #f2f2f2;
| + | |
| − | border-bottom: 1px solid #d3d3d3;
| + | |
| − | font-size: 12px;
| + | |
| − | color: #5e5f5f;
| + | |
| − | cursor: pointer; }
| + | |
| − | | + | |
| − | /* wrapper for the submenu items, they are hidden by default*/
| + | |
| − | .igem_2017_menu_wrapper .submenu_wrapper {
| + | |
| − | display: none; }
| + | |
| − | | + | |
| − | /* when the page size is bigger than 800px, this show/hide control is hidden by default */
| + | |
| − | .igem_2017_menu_wrapper #display_menu_control {
| + | |
| − | display: none;
| + | |
| − | text-align: center; }
| + | |
| − | | + | |
| − | /***************************************************** CONTENT OF THE PAGE ****************************************************/
| + | |
| − | /* Wrapper for the content */
| + | |
| − | .igem_2017_content_wrapper {
| + | |
| − | width: 81%;
| + | |
| − | margin: 2%;
| + | |
| − | display: block;
| + | |
| − | float: left;
| + | |
| − | background-color: white;
| + | |
| − | font-family: Tahoma, Geneva, sans-serif; }
| + | |
| − | | + | |
| − | /********************************* HTML STYLING *********************************/
| + | |
| − | /* styling for the titles h1 h2 */
| + | |
| − | .igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 {
| + | |
| − | padding: 5px 15px;
| + | |
| − | border-bottom: 0px;
| + | |
| − | color: #3399ff; }
| + | |
| − | | + | |
| − | /* styling for the titles h3 h4 h5 h6*/
| + | |
| − | .igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 {
| + | |
| − | padding: 5px 15px;
| + | |
| − | border-bottom: 0px;
| + | |
| − | color: #000000; }
| + | |
| − | | + | |
| − | /* font and text */
| + | |
| − | .igem_2017_content_wrapper p {
| + | |
| − | padding: 0px 15px;
| + | |
| − | font-size: 13px; }
| + | |
| − | | + | |
| − | /* Links */
| + | |
| − | .igem_2017_content_wrapper a {
| + | |
| − | font-weight: bold;
| + | |
| − | text-decoration: underline;
| + | |
| − | text-decoration-color: #3399ff;
| + | |
| − | color: #3399ff;
| + | |
| − | -webkit-transition: all 0.4s ease;
| + | |
| − | -moz-transition: all 0.4s ease;
| + | |
| − | -ms-transition: all 0.4s ease;
| + | |
| − | -o-transition: all 0.4s ease;
| + | |
| − | transition: all 0.4s ease; }
| + | |
| − | | + | |
| − | /* hover for the links */
| + | |
| − | .igem_2017_content_wrapper a:hover {
| + | |
| − | text-decoration: none;
| + | |
| − | color: #000000; }
| + | |
| − | | + | |
| − | /* non numbered lists */
| + | |
| − | .igem_2017_content_wrapper ul {
| + | |
| − | padding: 0px 20px;
| + | |
| − | font-size: 13px;
| + | |
| − | font-family: Tahoma, Geneva, sans-serif; }
| + | |
| − | | + | |
| − | /* numbered lists */
| + | |
| − | .igem_2017_content_wrapper ol {
| + | |
| − | padding: 0px;
| + | |
| − | font-size: 13px;
| + | |
| − | font-family: Tahoma, Geneva, sans-serif; }
| + | |
| − | | + | |
| − | /* Table */
| + | |
| − | .igem_2017_content_wrapper table {
| + | |
| − | width: 97%;
| + | |
| − | margin: 15px 10px;
| + | |
| − | border: 1px solid #d3d3d3;
| + | |
| − | border-collapse: collapse; }
| + | |
| − | | + | |
| − | /* table cells */
| + | |
| − | .igem_2017_content_wrapper td {
| + | |
| − | padding: 10px;
| + | |
| − | vertical-align: text-top;
| + | |
| − | border: 1px solid #d3d3d3;
| + | |
| − | border-collapse: collapse; }
| + | |
| − | | + | |
| − | /* table headers */
| + | |
| − | .igem_2017_content_wrapper th {
| + | |
| − | padding: 10px;
| + | |
| − | vertical-align: text-top;
| + | |
| − | border: 1px solid #d3d3d3;
| + | |
| − | border-collapse: collapse;
| + | |
| − | background-color: #f2f2f2; }
| + | |
| − | | + | |
| − | /**********************************LAYOUT CLASSES **********************************/
| + | |
| − | /* general class for column divs */
| + | |
| − | .igem_2017_content_wrapper .column {
| + | |
| − | padding: 10px 0px;
| + | |
| − | float: left; }
| + | |
| − | | + | |
| − | /* class for a full width column */
| + | |
| − | .column .full_size {
| + | |
| − | width: 100%; }
| + | |
| − | | + | |
| − | /* styling for images in a full width column*/
| + | |
| − | .column.full_size img {
| + | |
| − | width: 97%;
| + | |
| − | padding: 10px 15px; }
| + | |
| − | | + | |
| − | /* class for a half width column */
| + | |
| − | .column.half_size {
| + | |
| − | width: 50%; }
| + | |
| − | | + | |
| − | /* styling for images in a half width column*/
| + | |
| − | .column.half_size img {
| + | |
| − | width: 94.5%;
| + | |
| − | padding: 10px 15px; }
| + | |
| − | | + | |
| − | /********************************* SUPPORT CLASSES ********************************/
| + | |
| − | /* class that clears content below*/
| + | |
| − | .igem_2017_content_wrapper .clear {
| + | |
| − | clear: both; }
| + | |
| − | | + | |
| − | /* adds extra spacing when clearing content */
| + | |
| − | .igem_2017_content_wrapper .clear.extra_space {
| + | |
| − | height: 30px; }
| + | |
| − | | + | |
| − | /* highlight class, makes content slightly smaller */
| + | |
| − | .igem_2017_content_wrapper .highlight {
| + | |
| − | margin: 0px 15px;
| + | |
| − | padding: 15px 0px; }
| + | |
| − | | + | |
| − | /* highlight class, adds a gray background */
| + | |
| − | .igem_2017_content_wrapper .highlight.gray {
| + | |
| − | background-color: #f2f2f2; }
| + | |
| − | | + | |
| − | /* highlight with decoration blue line on top */
| + | |
| − | .igem_2017_content_wrapper .highlight.blue_top {
| + | |
| − | border-top: 4px solid #3399ff; }
| + | |
| − | | + | |
| − | /* highlight with a full blue border decoration */
| + | |
| − | .igem_2017_content_wrapper .highlight.blue_border {
| + | |
| − | border: 4px solid #3399ff; }
| + | |
| − | | + | |
| − | /* button class */
| + | |
| − | .igem_2017_content_wrapper .button {
| + | |
| − | max-width: 35%;
| + | |
| − | margin: 30px auto;
| + | |
| − | padding: 12px 10px;
| + | |
| − | background-color: #3399ff;
| + | |
| − | text-align: center;
| + | |
| − | color: #ffffff;
| + | |
| − | -webkit-transition: all 0.4s ease;
| + | |
| − | -moz-transition: all 0.4s ease;
| + | |
| − | -ms-transition: all 0.4s ease;
| + | |
| − | -o-transition: all 0.4s ease;
| + | |
| − | transition: all 0.4s ease; }
| + | |
| − | | + | |
| − | /* styling for button on hover */
| + | |
| − | .igem_2017_content_wrapper .button:hover {
| + | |
| − | background-color: #3399ff;
| + | |
| − | color: #000000; }
| + | |
| − | | + | |
| − | /***************************************************** RESPONSIVE STYLING ****************************************************/
| + | |
| − | /* IF THE SCREEN IS LESS THAN 1200PX */
| + | |
| − | @media only screen and (max-width: 1200px) {
| + | |
| − | #content {
| + | |
| − | width: 100%; }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper {
| + | |
| − | width: 15%;
| + | |
| − | right: 0; }
| + | |
| − | | + | |
| − | .highlight {
| + | |
| − | padding: 10px 0px; }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper #display_menu_control {
| + | |
| − | display: none; }
| + | |
| − | | + | |
| − | #menu_content {
| + | |
| − | display: block; }
| + | |
| − | | + | |
| − | .menu_button.direct_to_page {
| + | |
| − | padding-left: 17px; } }
| + | |
| − | /* IF THE SCREEN IS LESS THAN 800PX */
| + | |
| − | @media only screen and (max-width: 800px) {
| + | |
| − | .igem_2017_menu_wrapper {
| + | |
| − | width: 100%;
| + | |
| − | height: 15%;
| + | |
| − | position: relative;
| + | |
| − | left: 0%; }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper {
| + | |
| − | width: 100%;
| + | |
| − | margin-left: 0px; }
| + | |
| − | | + | |
| − | .column.half_size {
| + | |
| − | width: 100%; }
| + | |
| − | | + | |
| − | .column.full_size img, .column.half_size img {
| + | |
| − | width: 100%;
| + | |
| − | padding: 10px 0px; }
| + | |
| − | | + | |
| − | .highlight {
| + | |
| − | padding: 15px 5px; }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper #display_menu_control {
| + | |
| − | display: block; }
| + | |
| − | | + | |
| − | #menu_content {
| + | |
| − | display: none; }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper .menu_button .expand_collapse_icon {
| + | |
| − | width: 5%; }
| + | |
| − | | + | |
| − | .menu_bottom_padding {
| + | |
| − | display: none; }
| + | |
| − | | + | |
| − | .menu_button.direct_to_page {
| + | |
| − | padding-left: 36px; } }
| + | |
| − | /* special class that the system uses to make sure the team wants a page to be evaluated */
| + | |
| − | .judges-will-not-evaluate {
| + | |
| − | width: 96.6%;
| + | |
| − | margin: 5px 15px;
| + | |
| − | display: block;
| + | |
| − | border: 4px solid #3399ff;
| + | |
| − | font-weight: bold; }
| + | |
| − | | + | |
| − | .bg-dark-cyan {
| + | |
| − | background-color: #0f415c;
| + | |
| − | color: white; }
| + | |
| − | | + | |
| − | .bg-white {
| + | |
| − | background-color: white;
| + | |
| − | color: #0f415c; }
| + | |
| − | | + | |
| − | .text-yellow {
| + | |
| − | color: #f4ce3f; }
| + | |
| − | | + | |
| − | .text-red {
| + | |
| − | color: #e94c54; }
| + | |
| − | | + | |
| − | .text-cyan {
| + | |
| − | color: #40b2bc; }
| + | |
| − | | + | |
| − | .text-white {
| + | |
| − | color: white; }
| + | |
| − | | + | |
| − | .text-grey {
| + | |
| − | color: #999999; }
| + | |
| − | | + | |
| − | h1, h2, h3, h4, h5, p, a, blockquote, figcaption, li, th, td {
| + | |
| − | font-family: "Lato", serif !important;
| + | |
| − | margin: 1rem 0 !important;
| + | |
| − | -webkit-margin-before: 0 !important;
| + | |
| − | -webkit-margin-after: 0 !important;
| + | |
| − | -webkit-margin-start: 0 !important;
| + | |
| − | -webkit-margin-end: 0 !important; }
| + | |
| − | | + | |
| − | h1 {
| + | |
| − | font-size: 9rem !important; }
| + | |
| − | | + | |
| − | h2 {
| + | |
| − | font-size: 3.5rem !important;
| + | |
| − | font-weight: 700 !important;
| + | |
| − | margin: 0.5em 0 !important; }
| + | |
| − | | + | |
| − | h3 {
| + | |
| − | font-size: 2rem !important;
| + | |
| − | font-weight: 700 !important; }
| + | |
| − | | + | |
| − | h4 {
| + | |
| − | font-size: 1.8rem !important; }
| + | |
| − | | + | |
| − | p {
| + | |
| − | font-size: 1.7rem !important;
| + | |
| − | margin: 0.5em 0 !important; }
| + | |
| − | | + | |
| − | a {
| + | |
| − | font-size: 1.7rem !important;
| + | |
| − | text-decoration: none !important; }
| + | |
| − | | + | |
| − | sup a {
| + | |
| − | color: #e94c54 !important;
| + | |
| − | font-size: 0.9rem !important; }
| + | |
| − | | + | |
| − | button {
| + | |
| − | font-size: 1.5rem !important; }
| + | |
| − | | + | |
| − | blockquote {
| + | |
| − | margin-top: 1em !important;
| + | |
| − | margin-bottom: 1em !important;
| + | |
| − | border-left: 5px solid #40b2bc !important; }
| + | |
| − | | + | |
| − | blockquote.regular {
| + | |
| − | font-size: 2rem !important;
| + | |
| − | font-style: italic !important;
| + | |
| − | margin-left: 0 !important;
| + | |
| − | padding: 5px 10px !important; }
| + | |
| − | | + | |
| − | blockquote.sequence {
| + | |
| − | font-size: 1.5rem !important;
| + | |
| − | border-left: 5px solid #40b2bc !important;
| + | |
| − | margin-left: 0 !important;
| + | |
| − | padding: 5px 10px !important;
| + | |
| − | font-family: "Inconsolata", serif !important; }
| + | |
| − | blockquote.sequence pre {
| + | |
| − | margin: 0 !important;
| + | |
| − | color: rgba(15, 65, 92, 0.7) !important; }
| + | |
| − | | + | |
| − | blockquote.code {
| + | |
| − | font-size: 1.5rem !important;
| + | |
| − | border-left: 5px solid #40b2bc !important;
| + | |
| − | margin-left: 0 !important;
| + | |
| − | padding: 5px 10px !important;
| + | |
| − | font-family: "Inconsolata", serif !important; }
| + | |
| − | blockquote.code pre {
| + | |
| − | margin: 0 !important;
| + | |
| − | background-color: none !important;
| + | |
| − | color: rgba(15, 65, 92, 0.7) !important; }
| + | |
| − | | + | |
| − | figcaption {
| + | |
| − | font-size: 1.3rem !important;
| + | |
| − | color: rgba(15, 65, 92, 0.7) !important; }
| + | |
| − | | + | |
| − | ul {
| + | |
| − | padding: 0 5px;
| + | |
| − | list-style-type: none;
| + | |
| − | list-style-image: none; }
| + | |
| − | ul li {
| + | |
| − | padding: 5px 0; }
| + | |
| − | ul li a {
| + | |
| − | font-size: 1.4rem !important;
| + | |
| − | text-decoration: none;
| + | |
| − | color: #0f415c; }
| + | |
| − | ul li a:hover {
| + | |
| − | font-weight: 700; }
| + | |
| − | ul li a:visited {
| + | |
| − | color: #0f415c; }
| + | |
| − | ul li.active a {
| + | |
| − | font-weight: 900; }
| + | |
| − | | + | |
| − | ol {
| + | |
| − | padding: 0 30px !important; }
| + | |
| − | ol li {
| + | |
| − | font-size: 1.5rem !important;
| + | |
| − | color: rgba(15, 65, 92, 0.7) !important; }
| + | |
| − | | + | |
| − | th, td {
| + | |
| − | font-size: 1.5rem !important; }
| + | |
| − | | + | |
| − | hr {
| + | |
| − | border: none !important;
| + | |
| − | border-bottom: 2px solid #d7eff1 !important; }
| + | |
| − | | + | |
| − | body {
| + | |
| − | margin: 0; }
| + | |
| − | | + | |
| − | .section#animation {
| + | |
| − | height: 600px; }
| + | |
| − | | + | |
| − | .container-home {
| + | |
| − | display: flex;
| + | |
| − | flex-direction: row;
| + | |
| − | box-sizing: border-box; }
| + | |
| − | .container-home .home-left {
| + | |
| − | width: 50%;
| + | |
| − | box-sizing: border-box; }
| + | |
| − | .container-home .home-right {
| + | |
| − | width: 50%;
| + | |
| − | box-sizing: border-box; }
| + | |
| − | .container-home .lg-height {
| + | |
| − | height: 100vh; }
| + | |
| − | .container-home .text-right {
| + | |
| − | text-align: right; }
| + | |
| − | | + | |
| − | .container {
| + | |
| − | width: 100%;
| + | |
| − | padding: 50px 10%; }
| + | |
| − | @media (max-width: 800px) {
| + | |
| − | .container {
| + | |
| − | padding: 50px 2%; } }
| + | |
| − | .container.header {
| + | |
| − | min-height: 400px;
| + | |
| − | display: block;
| + | |
| − | text-align: center;
| + | |
| − | background: url("https://www.aiche.org/sites/default/files/images/courses/lab_safety_ssk_33970144.jpg");
| + | |
| − | background-size: cover;
| + | |
| − | background-position: center center;
| + | |
| − | color: white; }
| + | |
| − | @media (min-width: 800px) {
| + | |
| − | .container.header {
| + | |
| − | padding-right: 30%;
| + | |
| − | padding-left: 30%; } }
| + | |
| − | .container.row {
| + | |
| − | display: flex;
| + | |
| − | flex-direction: row; }
| + | |
| − | @media (max-width: 800px) {
| + | |
| − | .container.row {
| + | |
| − | flex-direction: column; } }
| + | |
| − | .container.col {
| + | |
| − | display: flex;
| + | |
| − | flex-direction: column; }
| + | |
| − | .container.main-page {
| + | |
| − | min-height: 400px; }
| + | |
| − | .container.main-page > .block:first-child {
| + | |
| − | margin-right: 80px; } | + | |
| − | .container.main-page .block.image {
| + | |
| − | flex: 1;
| + | |
| − | text-align: center;
| + | |
| − | display: flex;
| + | |
| − | justify-content: center;
| + | |
| − | flex-flow: column wrap; }
| + | |
| − | @media (max-width: 800px) {
| + | |
| − | .container.main-page .block.image {
| + | |
| − | order: 0; } }
| + | |
| − | .container.main-page .block.image img {
| + | |
| − | max-height: 100%;
| + | |
| − | max-width: 100%; }
| + | |
| − | .container.main-page .block.content {
| + | |
| − | flex: 2;
| + | |
| − | display: flex;
| + | |
| − | justify-content: center;
| + | |
| − | flex-flow: column wrap; }
| + | |
| − | @media (max-width: 800px) {
| + | |
| − | .container.main-page .block.content { | + | |
| − | order: 1; } }
| + | |
| − | .container.content-page {
| + | |
| − | min-height: 400px;
| + | |
| − | justify-content: center; }
| + | |
| − | .container.content-page .block.content {
| + | |
| − | max-width: 750px; | + | |
| − | flex: 3; }
| + | |
| − | .container.content-page .block.content .subsection {
| + | |
| − | margin-bottom: 50px; }
| + | |
| − | .container.content-page .block.sidebar { | + | |
| − | max-width: 200px;
| + | |
| − | flex: 1; }
| + | |
| − | .container.suggestions .block.suggestions-header { | + | |
| − | text-align: center; }
| + | |
| − | .container.suggestions .block.suggestions-header h3 {
| + | |
| − | margin: 2px;
| + | |
| − | color: #367b8c !important; }
| + | |
| − | .container.suggestions .block.page-suggestions {
| + | |
| − | display: flex;
| + | |
| − | flex-flow: row wrap;
| + | |
| − | justify-content: space-around;
| + | |
| − | margin: 0 50px; }
| + | |
| − | .container.suggestions .block.page-suggestions div {
| + | |
| − | width: 200px; }
| + | |
| − | .container.suggestions .block.page-suggestions div ul li a {
| + | |
| − | color: #367b8c; }
| + | |
| − | .container.suggestions .block.page-suggestions div ul li a:hover {
| + | |
| − | font-weight: 400;
| + | |
| − | color: #0f415c; }
| + | |
| − | | + | |
| − | #animation {
| + | |
| − | background: #11415B;
| + | |
| − | display: flex;
| + | |
| − | align-items: center;
| + | |
| − | justify-content: center;
| + | |
| − | position: relative;
| + | |
| − | overflow: hidden; }
| + | |
| − | #animation h3 {
| + | |
| − | font-size: auto;
| + | |
| − | font-weight: normal; }
| + | |
| − | | + | |
| − | #text {
| + | |
| − | display: inline-flex;
| + | |
| − | align-items: baseline;
| + | |
| − | justify-content: center; }
| + | |
| − | | + | |
| − | #circle {
| + | |
| − | border-radius: 50%;
| + | |
| − | position: absolute; }
| + | |
| − | | + | |
| − | #scrollWords {
| + | |
| − | height: 2.1em;
| + | |
| − | overflow: hidden;
| + | |
| − | text-align: left; }
| + | |
| − | | + | |
| − | #scrollWords h3 {
| + | |
| − | animation: scrollup 10s 2s infinite ease;
| + | |
| − | margin: 1px 0px;
| + | |
| − | position: relative; }
| + | |
| − | | + | |
| − | @keyframes scrollup {
| + | |
| − | 0% {
| + | |
| − | top: 0em; }
| + | |
| − | 15% {
| + | |
| − | top: -1.20em; }
| + | |
| − | 20% {
| + | |
| − | top: -1.20em; }
| + | |
| − | 35% {
| + | |
| − | top: -2.3em; }
| + | |
| − | 40% {
| + | |
| − | top: -2.3em; }
| + | |
| − | 55% {
| + | |
| − | top: -3.4em; }
| + | |
| − | 60% {
| + | |
| − | top: -3.4em; }
| + | |
| − | 80% {
| + | |
| − | top: 0em; }
| + | |
| − | 100% {
| + | |
| − | top: 0em; } }
| + | |
| − | #pink-orb, #mustard-orb, #turquois-orb, #darkTurquois-orb {
| + | |
| − | position: absolute;
| + | |
| − | top: 0;
| + | |
| − | height: 100vh;
| + | |
| − | width: 100%;
| + | |
| − | z-index: 1; }
| + | |
| − | | + | |
| − | .sidebar #sidebar-box {
| + | |
| − | width: 100%;
| + | |
| − | background: #d7eff1;
| + | |
| − | padding: 20px;
| + | |
| − | border-radius: 10px;
| + | |
| − | max-width: 200px;
| + | |
| − | box-shadow: 5px 5px 0 #f6f6f6; }
| + | |
| − | @media (max-width: 800px) {
| + | |
| − | .sidebar #sidebar-box {
| + | |
| − | display: none; } }
| + | |
| − | .sidebar #sidebar-box h3 {
| + | |
| − | margin: 0; }
| + | |
| − | .sidebar #sidebar-box .sidebar-minibox {
| + | |
| − | margin: 10px 0 20px 0;
| + | |
| − | background: white;
| + | |
| − | padding: 5px 10px; }
| + | |
| − | .sidebar #sidebar-box .sidebar-minibox ul li a {
| + | |
| − | font-size: 1.5em; }
| + | |
| − | .sidebar #sidebar-box.fixed {
| + | |
| − | position: fixed;
| + | |
| − | top: 50px; }
| + | |
| − | | + | |
| − | figure {
| + | |
| − | margin: 25px 0 !important;
| + | |
| − | width: 100% !important; }
| + | |
| − | | + | |
| − | figure .figures {
| + | |
| − | display: flex !important;
| + | |
| − | flex-wrap: wrap !important;
| + | |
| − | padding: 0 0 5px 0 !important; }
| + | |
| − | figure .figures > :nth-child(n) {
| + | |
| − | margin: 0 5px 5px 0 !important;
| + | |
| − | box-shadow: 2px 2px 0 #f6f6f6 !important; }
| + | |
| − | figure .figures .mol-container {
| + | |
| − | min-width: 300px !important;
| + | |
| − | height: 300px !important;
| + | |
| − | position: relative !important; }
| + | |
| − | figure .figures .image {
| + | |
| − | max-width: 80% !important;
| + | |
| − | box-shadow: none !important; }
| + | |
| − | figure .figures .image img {
| + | |
| − | min-width: 300px !important;
| + | |
| − | max-width: 100% !important;
| + | |
| − | object-fit: contain !important;
| + | |
| − | box-shadow: 2px 2px 0 #f6f6f6 !important; }
| + | |
| − | @media (max-width: 800px) {
| + | |
| − | figure .figures .image img {
| + | |
| − | width: 100% !important; } }
| + | |
| − | figure .figures table {
| + | |
| − | background: white !important;
| + | |
| − | border-collapse: collapse !important;
| + | |
| − | margin: auto !important; }
| + | |
| − | figure .figures table th, figure .figures table td {
| + | |
| − | min-width: 60px !important; }
| + | |
| − | figure .figures table thead tr th {
| + | |
| − | background: #d7eff1 !important;
| + | |
| − | color: #0f415c !important;
| + | |
| − | border-bottom: 2px solid #8bd1d7 !important;
| + | |
| − | border-right: 1px solid #eaf7f8 !important;
| + | |
| − | padding: 10px !important;
| + | |
| − | text-align: left !important; }
| + | |
| − | figure .figures table thead tr th:last-child {
| + | |
| − | border-right: none !important; }
| + | |
| − | figure .figures table tbody tr:nth-child(odd) {
| + | |
| − | background: #fdfdfd !important; }
| + | |
| − | figure .figures table tbody tr:nth-child(even) {
| + | |
| − | background: white !important; }
| + | |
| − | figure .figures table tbody tr:hover {
| + | |
| − | background: #eaf7f8 !important; }
| + | |
| − | figure .figures table tbody tr td {
| + | |
| − | padding: 10px !important;
| + | |
| − | border-right: 1px solid #f6f6f6 !important;
| + | |
| − | border-bottom: 1px solid #f6f6f6 !important; }
| + | |
| − | figure .figures table tbody tr td:last-child {
| + | |
| − | border-right: none !important; }
| + | |
| − | | + | |
| − | a button.btn-primary {
| + | |
| − | border: none;
| + | |
| − | padding: 10px 30px;
| + | |
| − | border-radius: 20px;
| + | |
| − | margin: 20px 0;
| + | |
| − | transition: background 0.2s ease-in-out;
| + | |
| − | cursor: crosshair; }
| + | |
| − | a button.btn-primary.dark-cyan {
| + | |
| − | color: white;
| + | |
| − | background: #0f415c; }
| + | |
| − | a button.btn-primary.dark-cyan:hover {
| + | |
| − | background: #338e96; }
| + | |
| − | a button.btn-primary.cyan {
| + | |
| − | color: #0f415c;
| + | |
| − | background: #40b2bc; }
| + | |
| − | a button.btn-primary.cyan:hover {
| + | |
| − | background: #8bd1d7; }
| + | |
| − | a button.btn-primary.red {
| + | |
| − | color: white;
| + | |
| − | background: #e94c54; }
| + | |
| − | a button.btn-primary.red:hover {
| + | |
| − | background: #ef797f; }
| + | |
| − | a button.btn-primary.yellow {
| + | |
| − | color: #0f415c;
| + | |
| − | background: #f4ce3f; }
| + | |
| − | a button.btn-primary.yellow:hover {
| + | |
| − | background: #fae79f; }
| + | |
| − | | + | |
| − | .audio.audio-player {
| + | |
| − | width: 80%;
| + | |
| − | min-width: 300px;
| + | |
| − | margin: 20px 0;
| + | |
| − | height: 56px;
| + | |
| − | /* box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .07); */
| + | |
| − | box-shadow: 2px 2px 0 #f6f6f6;
| + | |
| − | border: 1px solid #f6f6f6;
| + | |
| − | display: flex;
| + | |
| − | justify-content: space-between;
| + | |
| − | align-items: center;
| + | |
| − | padding-left: 24px;
| + | |
| − | padding-right: 24px;
| + | |
| − | border-radius: 4px;
| + | |
| − | user-select: none;
| + | |
| − | -webkit-user-select: none;
| + | |
| − | background-color: #fff; }
| + | |
| − | .audio.audio-player .play-pause-btn {
| + | |
| − | display: none;
| + | |
| − | cursor: pointer; }
| + | |
| − | .audio.audio-player .spinner {
| + | |
| − | width: 18px;
| + | |
| − | height: 18px;
| + | |
| − | background-image: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/355309/loading.png);
| + | |
| − | background-size: cover;
| + | |
| − | background-repeat: no-repeat;
| + | |
| − | animation: spin 0.4s linear infinite; }
| + | |
| − | .audio.audio-player .slider {
| + | |
| − | flex-grow: 1;
| + | |
| − | background-color: #D8D8D8;
| + | |
| − | cursor: pointer;
| + | |
| − | position: relative; }
| + | |
| − | .audio.audio-player .slider .progress {
| + | |
| − | background-color: #40b2bc;
| + | |
| − | border-radius: inherit;
| + | |
| − | position: absolute;
| + | |
| − | pointer-events: none; }
| + | |
| − | .audio.audio-player .slider .progress .pin {
| + | |
| − | height: 16px;
| + | |
| − | width: 16px;
| + | |
| − | border-radius: 8px;
| + | |
| − | background-color: #40b2bc;
| + | |
| − | position: absolute;
| + | |
| − | pointer-events: all;
| + | |
| − | box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32); }
| + | |
| − | .audio.audio-player .controls {
| + | |
| − | font-family: 'Roboto', sans-serif;
| + | |
| − | font-size: 16px;
| + | |
| − | line-height: 18px;
| + | |
| − | color: #367b8c;
| + | |
| − | display: flex;
| + | |
| − | flex-grow: 1;
| + | |
| − | justify-content: space-between;
| + | |
| − | align-items: center;
| + | |
| − | margin-left: 24px;
| + | |
| − | margin-right: 24px; }
| + | |
| − | .audio.audio-player .controls .slider {
| + | |
| − | margin-left: 16px;
| + | |
| − | margin-right: 16px;
| + | |
| − | border-radius: 2px;
| + | |
| − | height: 4px; }
| + | |
| − | .audio.audio-player .controls .slider .progress {
| + | |
| − | width: 0;
| + | |
| − | height: 100%; }
| + | |
| − | .audio.audio-player .controls .slider .progress .pin {
| + | |
| − | right: -8px;
| + | |
| − | top: -6px; }
| + | |
| − | .audio.audio-player .controls span {
| + | |
| − | cursor: default; }
| + | |
| − | .audio.audio-player .volume {
| + | |
| − | position: relative; }
| + | |
| − | .audio.audio-player .volume .volume-btn {
| + | |
| − | cursor: pointer; }
| + | |
| − | .audio.audio-player .volume .volume-btn.open path {
| + | |
| − | fill: #40b2bc; }
| + | |
| − | .audio.audio-player .volume .volume-controls {
| + | |
| − | width: 30px;
| + | |
| − | height: 135px;
| + | |
| − | background-color: rgba(0, 0, 0, 0.62);
| + | |
| − | border-radius: 7px;
| + | |
| − | position: absolute;
| + | |
| − | left: -3px;
| + | |
| − | bottom: 52px;
| + | |
| − | flex-direction: column;
| + | |
| − | align-items: center;
| + | |
| − | display: flex; }
| + | |
| − | .audio.audio-player .volume .volume-controls.hidden {
| + | |
| − | display: none; }
| + | |
| − | .audio.audio-player .volume .volume-controls .slider {
| + | |
| − | margin-top: 12px;
| + | |
| − | margin-bottom: 12px;
| + | |
| − | width: 6px;
| + | |
| − | border-radius: 3px; }
| + | |
| − | .audio.audio-player .volume .volume-controls .slider .progress {
| + | |
| − | bottom: 0;
| + | |
| − | height: 100%;
| + | |
| − | width: 6px; }
| + | |
| − | .audio.audio-player .volume .volume-controls .slider .progress .pin {
| + | |
| − | left: -5px;
| + | |
| − | top: -8px; }
| + | |
| − | | + | |
| − | svg {
| + | |
| − | display: block; }
| + | |
| − | | + | |
| − | @keyframes spin {
| + | |
| − | from {
| + | |
| − | transform: rotateZ(0); }
| + | |
| − | to {
| + | |
| − | transform: rotateZ(1turn); } }
| + | |
| − | .navigation {
| + | |
| − | display: flex;
| + | |
| − | flex-direction: row;
| + | |
| − | align-items: center;
| + | |
| − | padding: 10px 5%;
| + | |
| − | background: #d7eff1; }
| + | |
| − | | + | |
| − | #logo, #navigation {
| + | |
| − | display: flex; }
| + | |
| − | | + | |
| − | #logo {
| + | |
| − | flex: 1;
| + | |
| − | justify-content: center;
| + | |
| − | padding-bottom: 10px; }
| + | |
| − | #logo img {
| + | |
| − | height: 40px; }
| + | |
| − | | + | |
| − | #navigation {
| + | |
| − | flex: 3;
| + | |
| − | justify-content: flex-end;
| + | |
| − | display: flex;
| + | |
| − | align-items: center; }
| + | |
| − | #navigation ul {
| + | |
| − | list-style-type: circle; }
| + | |
| − | #navigation li {
| + | |
| − | display: inline-block;
| + | |
| − | padding: 5px 0.75em 0 0.75em;
| + | |
| − | margin-top: 5px;
| + | |
| − | font-size: 16px; }
| + | |
| − | | + | |
| − | #navbarSearch {
| + | |
| − | padding: 0; }
| + | |
| − | #navbarSearch input {
| + | |
| − | padding: 5px 10px;
| + | |
| − | border-radius: 50px 50px;
| + | |
| − | border: 1px solid #367b8c;
| + | |
| − | color: #367b8c;
| + | |
| − | font-size: 1.2rem;
| + | |
| − | width: 100%;
| + | |
| − | background: #fff;
| + | |
| − | outline: none; }
| + | |
| − | #navbarSearch input::-webkit-input-placeholder {
| + | |
| − | color: #367b8c; }
| + | |
| − | | + | |
| − | /*# sourceMappingURL=styles_min_css.map */
| + | |
