(Prototype team page) |
Tefiducky8 (Talk | contribs) |
||
Line 1: | Line 1: | ||
{{Ecuador}} | {{Ecuador}} | ||
<html> | <html> | ||
+ | <style> | ||
+ | @import url('https://fonts.googleapis.com/css?family=Raleway'); | ||
+ | *{ | ||
+ | margin: 0px; | ||
+ | font-family: 'Raleway', sans-serif; | ||
+ | } | ||
+ | @keyframes slide-in { | ||
+ | from { | ||
+ | margin-left: -100%; | ||
+ | border-bottom-right-radius: 30px; | ||
+ | border-top-right-radius: 30px; | ||
+ | } | ||
+ | to { | ||
+ | margin-left: 0%; | ||
+ | border-bottom-right-radius: 0; | ||
+ | border-top-right-radius: 0px; | ||
+ | } | ||
+ | } | ||
+ | @keyframes slide-in-menu { | ||
+ | from { | ||
+ | margin-left: -120%; | ||
+ | border-bottom-right-radius: 30px; | ||
+ | border-top-right-radius: 30px; | ||
+ | opacity: 0.5; | ||
+ | } | ||
− | + | to { | |
− | + | margin-left: 0%; | |
− | + | border-bottom-right-radius: 0; | |
− | + | border-top-right-radius: 0px; | |
− | + | opacity: 1; | |
+ | } | ||
+ | } | ||
+ | @keyframes fade-in { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | } | ||
− | + | to { | |
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | @keyframes slide-in-oposite { | ||
+ | from { | ||
+ | margin-left: 100%; | ||
+ | } | ||
− | + | to { | |
− | + | margin-left: 0%; | |
+ | } | ||
+ | } | ||
− | + | @keyframes slide-in-up { | |
− | + | from { | |
− | + | margin-top: 100%; | |
+ | } | ||
− | + | to { | |
− | + | margin-left: 0%; | |
− | + | } | |
− | + | } | |
− | + | ||
− | + | @keyframes slide-in-up-oposite { | |
+ | from { | ||
+ | margin-top: -100%; | ||
+ | } | ||
− | + | to { | |
− | + | margin-left: 0%; | |
− | + | } | |
− | + | } | |
+ | .igem_2018_team_menu.displaying_menu { | ||
+ | display: none; | ||
+ | } | ||
+ | .ecuador_menu { | ||
+ | font-size: 14px; | ||
+ | width: 100%; | ||
+ | height: 80px; | ||
+ | position: fixed; | ||
+ | left: 0px; | ||
+ | top: 15px; | ||
+ | background-color: #2471A3; | ||
+ | animation-name: fade-in; | ||
+ | animation-duration: 2s; | ||
+ | -webkit-box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.75); | ||
+ | -moz-box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.75); | ||
+ | box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.75); | ||
+ | display: flex; | ||
+ | z-index: 5; | ||
+ | } | ||
− | + | .ecuador_home { | |
− | + | width: 16%; | |
− | + | height: 100%; | |
+ | display: flex; | ||
+ | justify-content: center; | ||
+ | background-color: #1F618D; | ||
+ | position: absolute; | ||
+ | align-items: center; | ||
+ | margin: auto auto; | ||
+ | left: 1.5%; | ||
+ | color: #FFF; | ||
+ | transition: 0.5s; | ||
+ | -webkit-box-shadow: inset -50px -42px 114px -30px rgba(0,0,0,0.75); | ||
+ | -moz-box-shadow: inset -50px -42px 114px -30px rgba(0,0,0,0.75); | ||
+ | box-shadow: inset -50px -42px 114px -30px rgba(0,0,0,0.75); | ||
+ | z-index: 10; | ||
+ | } | ||
− | + | .ecuador_home:hover { | |
+ | cursor: pointer; | ||
+ | font-size: 16px; | ||
+ | background-color: #1A5276; | ||
+ | box-shadow: none; | ||
+ | } | ||
+ | .menu_options_container { | ||
+ | width: 79%; | ||
+ | height: 50px; | ||
+ | position: absolute; | ||
+ | left: 19%; | ||
+ | top: 15px; | ||
+ | display: flex; | ||
+ | justify-content: center; | ||
+ | } | ||
+ | .menu_option { | ||
+ | width: 14.28%; | ||
+ | height: 100%; | ||
+ | position: relative; | ||
+ | justify-content: center; | ||
+ | align-items: center; | ||
+ | display: flex; | ||
+ | color: #FFFFFF; | ||
+ | transition: 0.2s; | ||
+ | text-align: center; | ||
+ | } | ||
− | + | #project { | |
− | + | animation-name: slide-in-up-oposite; | |
− | + | animation-duration: 0.5s; | |
− | + | animation-delay: 0.5s; | |
+ | animation-fill-mode: backwards; | ||
+ | position: absolute; | ||
+ | left: 0%; | ||
+ | z-index: 9; | ||
+ | } | ||
− | + | #people { | |
− | + | animation-name: slide-in-up-oposite; | |
− | + | animation-duration: 0.5s; | |
− | + | animation-delay: 0.6s; | |
− | + | animation-fill-mode: backwards; | |
− | + | position: absolute; | |
− | + | left: 14.28%; | |
− | + | z-index: 9; | |
− | + | } | |
− | + | ||
+ | #notebook { | ||
+ | animation-name: slide-in-up-oposite; | ||
+ | animation-duration: 0.5s; | ||
+ | animation-delay: 0.7s; | ||
+ | animation-fill-mode: backwards; | ||
+ | position: absolute; | ||
+ | left: 28.56%; | ||
+ | z-index: 9; | ||
+ | } | ||
+ | |||
+ | #human_practice { | ||
+ | animation-name: slide-in-up-oposite; | ||
+ | animation-duration: 0.5s; | ||
+ | animation-delay: 0.8s; | ||
+ | animation-fill-mode: backwards; | ||
+ | position: absolute; | ||
+ | left: 42.84%; | ||
+ | z-index: 9; | ||
+ | } | ||
+ | |||
+ | #parts { | ||
+ | animation-name: slide-in-up-oposite; | ||
+ | animation-duration: 0.5s; | ||
+ | animation-delay: 0.9s; | ||
+ | animation-fill-mode: backwards; | ||
+ | position: absolute; | ||
+ | left: 57.12%; | ||
+ | z-index: 9; | ||
+ | } | ||
+ | |||
+ | #safety { | ||
+ | animation-name: slide-in-up-oposite; | ||
+ | animation-duration: 0.5s; | ||
+ | animation-delay: 1s; | ||
+ | animation-fill-mode: backwards; | ||
+ | position: absolute; | ||
+ | left: 71.40%; | ||
+ | z-index: 9; | ||
+ | } | ||
+ | |||
+ | #interlab { | ||
+ | animation-name: slide-in-up-oposite; | ||
+ | animation-duration: 0.5s; | ||
+ | animation-delay: 1.1s; | ||
+ | animation-fill-mode: backwards; | ||
+ | position: absolute; | ||
+ | left: 85.68%; | ||
+ | z-index: 9; | ||
+ | } | ||
+ | |||
+ | .ecuador_href_text { | ||
+ | width: 14.28% !important; | ||
+ | height: 100% !important; | ||
+ | position: relative !important; | ||
+ | justify-content: center !important; | ||
+ | align-items: center !important; | ||
+ | display: flex !important; | ||
+ | color: #FFFFFF !important; | ||
+ | transition: 0.2s !important; | ||
+ | text-align: center !important; | ||
+ | text-decoration: none !important; | ||
+ | font-weight: bold !important; | ||
+ | } | ||
+ | |||
+ | .ecuador_href_sub_text { | ||
+ | width: 100% !important; | ||
+ | height: 40px !important; | ||
+ | position: relative !important; | ||
+ | text-align: left !important; | ||
+ | text-indent: 20px !important; | ||
+ | display: flex !important; | ||
+ | background-color: #000 !important; | ||
+ | margin: auto auto !important; | ||
+ | align-items: center !important; | ||
+ | transition: 0.2s !important; | ||
+ | color: #D5DBDB !important; | ||
+ | text-decoration: none !important; | ||
+ | } | ||
+ | |||
+ | .menu_option:hover { | ||
+ | margin-top: 3px; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | .menu_option:hover div.menu_sub_options_container{ | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .menu_sub_options_container { | ||
+ | width: 90%; | ||
+ | height: auto; | ||
+ | position: absolute; | ||
+ | top: 50px; | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .sub_menu_option { | ||
+ | width: 100%; | ||
+ | height: 40px; | ||
+ | position: relative; | ||
+ | text-align: left; | ||
+ | text-indent: 20px; | ||
+ | display: flex; | ||
+ | background-color: #000; | ||
+ | margin: auto auto; | ||
+ | align-items: center; | ||
+ | transition: 0.2s; | ||
+ | color: #D5DBDB; | ||
+ | } | ||
+ | |||
+ | .sub_menu_option:hover { | ||
+ | text-indent: 25px; | ||
+ | background-color: #2E86C1; | ||
+ | } | ||
+ | |||
+ | .ecuador_footer { | ||
+ | width: 100%; | ||
+ | height: 250px; | ||
+ | position: absolute; | ||
+ | left: 0px; | ||
+ | top: 810px; | ||
+ | background-color: #212F3C; | ||
+ | } | ||
+ | |||
+ | .ecuador_footer_igem_logo { | ||
+ | width: 180px; | ||
+ | height: 180px; | ||
+ | position: absolute; | ||
+ | right: 80px; | ||
+ | top: 35px; | ||
+ | background-image: url(https://static.igem.org/mediawiki/2018/5/55/T--Ecuador--iGEM--Logo--Black.png); | ||
+ | background-size: 100%; | ||
+ | background-repeat: no-repeat; | ||
+ | background-position: center; | ||
+ | } | ||
+ | |||
+ | .ecuador_footer_information_layout { | ||
+ | width: 75%; | ||
+ | height: 80%; | ||
+ | position: absolute; | ||
+ | left: 60px; | ||
+ | top: 15%; | ||
+ | display: flex; | ||
+ | } | ||
+ | |||
+ | .ecuador_footer_information_container { | ||
+ | width: 33.33%; | ||
+ | height: 100%; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | .ecuador_footer_information_title_container { | ||
+ | width: 100%; | ||
+ | height: 25px; | ||
+ | position: relative; | ||
+ | top: 0px; | ||
+ | text-align: center; | ||
+ | font-size: 20px; | ||
+ | font-weight: bold; | ||
+ | color: #B2BABB; | ||
+ | } | ||
+ | |||
+ | .ecuador_follow_us_icons_container { | ||
+ | width: 50%; | ||
+ | height: 60px; | ||
+ | position: relative; | ||
+ | top: 40px; | ||
+ | margin: auto; | ||
+ | display: flex; | ||
+ | } | ||
+ | |||
+ | .ecuador_follow_us_icon { | ||
+ | width: 60px; | ||
+ | height: 60px; | ||
+ | position: relative; | ||
+ | margin: auto; | ||
+ | } | ||
+ | |||
+ | #facebook { | ||
+ | background-image: url(https://static.igem.org/mediawiki/2018/4/42/T--Ecuador--Facebook.png); | ||
+ | background-repeat: no-repeat; | ||
+ | background-position: center; | ||
+ | background-size: 80%; | ||
+ | transition: 0.4s; | ||
+ | border-radius: 5px; | ||
+ | } | ||
+ | |||
+ | #facebook:hover { | ||
+ | background-image: url(https://static.igem.org/mediawiki/2018/4/40/T--Ecuador--Facebook--White.png); | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | #instagram { | ||
+ | background-image: url(https://static.igem.org/mediawiki/2018/9/90/T--Ecuador--Instagram.png); | ||
+ | background-repeat: no-repeat; | ||
+ | background-position: center; | ||
+ | background-size: 80%; | ||
+ | transition: 0.4s; | ||
+ | border-radius: 5px; | ||
+ | } | ||
+ | |||
+ | #instagram:hover { | ||
+ | background-image: url(https://static.igem.org/mediawiki/2018/4/49/T--Ecuador--Instagram--White.png); | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | .ecuador_abstract_container { | ||
+ | width: 100%; | ||
+ | height: 700px; | ||
+ | position: absolute; | ||
+ | left: 0px; | ||
+ | top: 110px; | ||
+ | background-color: #21618C; | ||
+ | } | ||
+ | |||
+ | .ecuador_abstract_title_cotainer { | ||
+ | width: 100%; | ||
+ | height: 70px; | ||
+ | position: relative; | ||
+ | top: 30px; | ||
+ | margin: auto; | ||
+ | color: #FFF; | ||
+ | font-size: 32px; | ||
+ | display: flex; | ||
+ | justify-content: center; | ||
+ | align-items: center; | ||
+ | animation-name: slide-in; | ||
+ | animation-duration: 1.5s; | ||
+ | } | ||
+ | |||
+ | .ecuador_abstract_text_container { | ||
+ | width: 100%; | ||
+ | height: 400px; | ||
+ | top: 70px; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | .ecuador_abstract_text { | ||
+ | width: 60%; | ||
+ | height: 100%; | ||
+ | position: relative; | ||
+ | margin: auto; | ||
+ | background-color: #21618C; | ||
+ | border-radius: 20px; | ||
+ | color: #FFF; | ||
+ | text-align: justify; | ||
+ | font-size: 20px; | ||
+ | animation-name: fade-in; | ||
+ | animation-duration: 4.5s; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | <div class="ecuador_menu"> | ||
+ | <a href="https://2018.igem.org/Team:Ecuador"> | ||
+ | <div class="ecuador_home"> | ||
+ | iGEM ECUADOR | ||
+ | </div> | ||
+ | </a> | ||
+ | <div class="menu_options_container"> | ||
+ | <div id="project" class="menu_option"> | ||
+ | PROJECT | ||
+ | <div class="menu_sub_options_container"> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Description"> | ||
+ | <div class="sub_menu_option"> | ||
+ | OVERVIEW | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Background"> | ||
+ | <div class="sub_menu_option"> | ||
+ | BACKGROUND | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Model"> | ||
+ | <div class="sub_menu_option"> | ||
+ | MODELING | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Design"> | ||
+ | <div class="sub_menu_option"> | ||
+ | DESIGN | ||
+ | </div> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="people" class="menu_option"> | ||
+ | PEOPLE | ||
+ | <div class="menu_sub_options_container"> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Sponsiring"> | ||
+ | <div class="sub_menu_option"> | ||
+ | SPONSIRING | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Attributions"> | ||
+ | <div class="sub_menu_option"> | ||
+ | ATTRIBUTIONS | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Team"> | ||
+ | <div class="sub_menu_option"> | ||
+ | TEAM | ||
+ | </div> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="notebook" class="menu_option"> | ||
+ | <a class="ecuador_href_text" href="https://2018.igem.org/Team:Ecuador/Notebook"> | ||
+ | NOTEBOOK | ||
+ | </a> | ||
+ | <div class="menu_sub_options_container"> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Lab_book"> | ||
+ | <div class="sub_menu_option"> | ||
+ | LAB BOOK | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Protocols"> | ||
+ | <div class="sub_menu_option"> | ||
+ | PROTOCOLS | ||
+ | </div> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="human_practice" class="menu_option"> | ||
+ | <a class="ecuador_href_text" href="https://2018.igem.org/Team:Ecuador/Human_Practices"> | ||
+ | HUMAN PRACTICE | ||
+ | </a> | ||
+ | <div class="menu_sub_options_container"> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Collaborations"> | ||
+ | <div class="sub_menu_option"> | ||
+ | COLLABORATIONS | ||
+ | </div> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="parts" class="menu_option"> | ||
+ | <a class="ecuador_href_text" href="https://2018.igem.org/Team:Ecuador/Parts"> | ||
+ | PARTS | ||
+ | </a> | ||
+ | <div class="menu_sub_options_container"> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/List"> | ||
+ | <div class="sub_menu_option"> | ||
+ | LIST | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Composite"> | ||
+ | <div class="sub_menu_option"> | ||
+ | COMPOSITE | ||
+ | </div> | ||
+ | </a> | ||
+ | <a class="ecuador_href_sub_text" href="https://2018.igem.org/Team:Ecuador/Basic"> | ||
+ | <div class="sub_menu_option"> | ||
+ | BASIC | ||
+ | </div> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="safety" class="menu_option"> | ||
+ | <a class="ecuador_href_text" href="https://2018.igem.org/Team:Ecuador/Safety"> | ||
+ | SAFETY | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div id="interlab" class="menu_option"> | ||
+ | <a class="ecuador_href_text" href="http://2018.iGEM.org/Team:Ecuador/Interlab"> | ||
+ | INTERLAB | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="ecuador_abstract_container"> | ||
+ | <div class="ecuador_abstract_title_cotainer"> | ||
+ | Collaborations | ||
+ | </div> | ||
+ | <div class="ecuador_abstract_text_container"> | ||
+ | <div class="ecuador_abstract_text"> | ||
+ | About our collaborations. | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="ecuador_footer"> | ||
+ | <div class="ecuador_footer_igem_logo"> | ||
+ | </div> | ||
+ | <div class="ecuador_footer_information_layout"> | ||
+ | <div class="ecuador_footer_information_container"> | ||
+ | <div class="ecuador_footer_information_title_container"> | ||
+ | SPONSORS | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="ecuador_footer_information_container"> | ||
+ | <div class="ecuador_footer_information_title_container"> | ||
+ | FOLLOW US | ||
+ | <div class="ecuador_follow_us_icons_container"> | ||
+ | <div id="facebook" class="ecuador_follow_us_icon"> | ||
+ | |||
+ | </div> | ||
+ | <div id="instagram" class="ecuador_follow_us_icon"> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="ecuador_footer_information_container"> | ||
+ | <div class="ecuador_footer_information_title_container"> | ||
+ | CONTACT US | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
</html> | </html> |
Revision as of 10:19, 26 September 2018
Collaborations
About our collaborations.