|
|
(237 intermediate revisions by the same user not shown) |
Line 16: |
Line 16: |
| </style> | | </style> |
| | | |
− | <head> | + | <html> |
− | <meta charset="utf-8">
| + | |
− | <meta http-equiv="X-UA-Compatible" content="IE=edge">
| + | |
− | <meta name="viewport" content="width=device-width, initial-scale=1">
| + | |
− | </head>
| + | |
− | <!-- ////////////////////// START TOP HEADER /////////////////////// -->
| + | |
| <head> | | <head> |
| <style> | | <style> |
− | .ccsticky-nav { /*背板*/ | + | .top { |
− | width: 100%;
| + | position: absolute; |
− | height: 80px;
| + | top: 0px; |
− | position: fixed;
| + | left: 0px; |
− | top: 0px;
| + | width: 100%; |
− | background: #97CBFF;
| + | height: 110px; |
− | z-index:+1;
| + | font-family: Corbel; |
− | font-family: Corbel;
| + | background: rgba(250, 250, 250, 0.1); |
| + | overflow: visible; |
| + | z-index: +1; |
| } | | } |
− | | + | .mid { |
− | .ccsticky-nav ul { /*major menu type*/ | + | position: absolute; |
− | padding: 20px;
| + | left: 0px; |
− | list-style: none;
| + | width: 100%; |
− | text-align: center;
| + | height: 100%; |
− | position: relative;
| + | font-family: Corbel; |
− | left: 150px;
| + | |
− | z-index:+1;
| + | |
− | text-decoration: none;
| + | |
− | display: inline-block;
| + | |
− | margin: 20px;
| + | |
− | top:-10px;
| + | |
− | overflow: hidden;
| + | |
| } | | } |
− | .ccsticky-nav ul li { | + | .menu-bar { |
− | margin: 0 10px;
| + | position: fixed; |
− | z-index:+1;
| + | background: rgba(250, 250, 250, 0.1); |
− | float: left;
| + | z-index: +1; |
− | display: inline-block;
| + | |
| } | | } |
− | .ccsticky-nav ul li:hover { /*major menu 滑動 type*/ | + | .menu-bar a{ |
− | padding: 25px 20px;
| + | position: fixed; |
− | background: #0066FF;
| + | top: 595px; |
− | position: relative;
| + | background-color: rgba(250, 250, 250, 0.1); |
− | top:-22px;
| + | |
− | border-radius: 4px;
| + | |
− | }
| + | |
− | | + | |
− | .ccsticky-nav ul li a { /*major menu font type*/
| + | |
− | padding: 10px 0;
| + | |
− | font-size: 1rem;
| + | |
− | text-decoration: none;
| + | |
− | z-index:+1;
| + | |
− | color: white;
| + | |
− | }
| + | |
− | .ccsticky-nav ul li a:hover { /*major menu font 滑動 type*/
| + | |
− | color: white;
| + | |
− | z-index:+1;
| + | |
− | }
| + | |
− | .ccsticky-nav ul li.dropdown { /*下拉式選單*/
| + | |
− | display: inline-block;
| + | |
− | }
| + | |
− | .ccsticky-nav ul li a:hover, .dropdown:hover
| + | |
− | <!-- ////////////////////// START SUB MENU /////////////////////// -->
| + | |
− | .dropdown-content {
| + | |
− | display: none;
| + | |
− | position: absolute;
| + | |
− | min-width: 160px;
| + | |
− | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
| + | |
− | z-index:-1;
| + | |
− | }
| + | |
− | | + | |
− | .dropdown-content a { /* 隱藏次選單*/
| + | |
− | color: white;
| + | |
− | padding: 12px 16px;
| + | |
− | text-decoration: none;
| + | |
− | z-index:-1;
| + | |
− | display: block;
| + | |
− | }
| + | |
− | | + | |
− | .dropdown-content a:hover {
| + | |
− | background-color: #FF4848; padding: 15px 20px; border-radius: 4px;
| + | |
− | | + | |
− | }
| + | |
− | | + | |
− | .dropdown:hover .dropdown-content {
| + | |
− | display: block;
| + | |
− | }
| + | |
− | </style>
| + | |
− | <nav class="ccsticky-nav">
| + | |
− | <ul>
| + | |
− | <li><a href="https://2016.igem.org/Team:CGU_Taiwan/Home">HOME</a></li>
| + | |
− | <li><a href="https://2016.igem.org/Team:CGU_Taiwan/Team">TEAM</a></li>
| + | |
− | <li class="dropdown"><a href="https://2016.igem.org/Team:CGU_Taiwan/Project">PROJECT</a></li>
| + | |
− | <li class="dropdown"><a href="https://2016.igem.org/Team:CGU_Taiwan/Wet Lab">WET LAB</a>
| + | |
− |
| + | |
− | </li>
| + | |
− | <li class="dropdown"><a href="https://2016.igem.org/Team:CGU_Taiwan/Model">MODELING</a>
| + | |
− |
| + | |
− | </li>
| + | |
− | <li><a href="https://2016.igem.org/Team:CGU_Taiwan/Human_Practices">HUMAN PRACTICES</a></li>
| + | |
− | <li><a href="https://2016.igem.org/Team:CGU_Taiwan/Attributions">ATTRIBUTION</a></li>
| + | |
− | <li class="dropdown"><a href="https://2016.igem.org/Team:CGU_Taiwan/Notebook">NOTEBOOK</a>
| + | |
− |
| + | |
− | </li>
| + | |
− | <li class="dropdown"><a href="https://2016.igem.org/Team:CGU_Taiwan/Safety">SAFETY</a></li>
| + | |
− | </ul>
| + | |
− | </nav>
| + | |
− | <!-- ////////////////////// END OF HEADER /////////////////////// -->
| + | |
− | <!-- ////////////////////// START SLIDER /////////////////////// -->
| + | |
− | | + | |
− | <meta name="viewport" content="width=device-width, initial-scale=1">
| + | |
− | <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
| + | |
− | <style>
| + | |
− | .mySlides {display:none; width: 1500px; height:600px}
| + | |
− | .w3-left, .w3-right, .w3-badge {cursor:pointer}
| + | |
− | .w3-badge {height:13px;width:13px;padding:0}
| + | |
− | </style>
| + | |
− | <body>
| + | |
− | <div class="w3-content w3-display-container" style="max-width:1500px">
| + | |
− | <img class="mySlides" src="https://static.igem.org/mediawiki/2016/b/b4/Chang_Gung_university.jpeg">
| + | |
− | <img class="mySlides" src="img_fjords_wide.jpg" style="width:100%">
| + | |
− | <img class="mySlides" src="img_mountains_wide.jpg" style="width:100%">
| + | |
− | <div class="w3-center w3-section w3-large w3-text-white w3-display-bottomleft" style="width:100%">
| + | |
− | <div class="w3-left w3-padding-left w3-hover-text-khaki" onclick="plusDivs(-1)">❮</div>
| + | |
− | <div class="w3-right w3-padding-right w3-hover-text-khaki" onclick="plusDivs(1)">❯</div>
| + | |
− | <span class="w3-badge demo w3-border w3-transparent w3-hover-white" onclick="currentDiv(1)"></span>
| + | |
− | <span class="w3-badge demo w3-border w3-transparent w3-hover-white" onclick="currentDiv(2)"></span>
| + | |
− | <span class="w3-badge demo w3-border w3-transparent w3-hover-white" onclick="currentDiv(3)"></span>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | | + | |
− | <script>
| + | |
− | var slideIndex = 1;
| + | |
− | showDivs(slideIndex);
| + | |
− | | + | |
− | function plusDivs(n) {
| + | |
− | showDivs(slideIndex += n);
| + | |
− | }
| + | |
− | | + | |
− | function currentDiv(n) {
| + | |
− | showDivs(slideIndex = n);
| + | |
− | }
| + | |
− | | + | |
− | function showDivs(n) {
| + | |
− | var i;
| + | |
− | var x = document.getElementsByClassName("mySlides");
| + | |
− | var dots = document.getElementsByClassName("demo");
| + | |
− | if (n > x.length) {slideIndex = 1}
| + | |
− | if (n < 1) {slideIndex = x.length}
| + | |
− | for (i = 0; i < x.length; i++) {
| + | |
− | x[i].style.display = "none";
| + | |
− | }
| + | |
− | for (i = 0; i < dots.length; i++) {
| + | |
− | dots[i].className = dots[i].className.replace(" w3-white", "");
| + | |
− | }
| + | |
− | x[slideIndex-1].style.display = "block";
| + | |
− | dots[slideIndex-1].className += " w3-white";
| + | |
− | }
| + | |
− | </script>
| + | |
− | | + | |
− | </body>
| + | |
− | <style>
| + | |
− | .rad {
| + | |
− | border: 1px solid #ddd;
| + | |
− | border-radius: 4px;
| + | |
− | padding: 5px;
| + | |
− | position: relative;
| + | |
− | left: 200px;
| + | |
− | top: 10px;
| + | |
− | }
| + | |
− | </style>
| + | |
− | <!-- ////////////////////// END OF SLIDER /////////////////////// -->
| + | |
− | <!-- ////////////////////// START TABS /////////////////////// -->
| + | |
− | <style>
| + | |
− | body {
| + | |
− | background-color: white;
| + | |
− | }
| + | |
− | .tabs {
| + | |
− | position: absolute;
| + | |
− | left: 700px;
| + | |
− | top: 770px;
| + | |
− | height: 50%;
| + | |
− | min-width: 450px;
| + | |
− | transform: translate(-50%, -50%);
| + | |
| color: black; | | color: black; |
− | font-size: 16px; | + | font-family: Corbel; |
− | font-weight: bolder; | + | font-size: 15px; |
− | -webkit-transition-duration: 0.4s; /* Safari */ | + | font-weight: bold; |
| + | text-align: center; |
| + | -webkit-transition-duration: 0.4s; |
| transition-duration: 0.4s; | | transition-duration: 0.4s; |
| margin: 4px 2px; | | margin: 4px 2px; |
− | padding-top: 10px;
| + | padding-top: 10px; |
− | padding-right: 10px;
| + | padding-right: 5px; |
− | padding-bottom: 10px;
| + | padding-bottom: 10px; |
− | padding-left: 10px;
| + | padding-left: 5px; |
− | border-radius: 4px; | + | border-color: #F0F0F; |
− | padding: 20px;
| + | z-index: +1; |
− | }
| + | text-decoration: none; |
− | .tabs: hover {
| + | |
− | font-color: #86BCFF;
| + | |
− | }
| + | |
− | label, #slider {
| + | |
− | display: inline-block; | + | |
− | font-weight: bold; | + | |
| text-align: center; | | text-align: center; |
− | font color: black;
| |
− | width: 150px;
| |
− | height: 40px;
| |
− | border-radius: 4px;
| |
− | background-color: #86BCFF;
| |
− | padding-top: 30px;
| |
− | padding-right: 20px;
| |
− | padding-bottom: 30px;
| |
− | padding-left: 20px;
| |
− | -webkit-transition-duration: 0.4s; /* Safari */
| |
− | transition-duration: 0.4s;
| |
− | margin: 4px 2px;
| |
− | padding: 40px auto;
| |
| } | | } |
− | | + | .menu-bar a:hover { |
− | label:hover {
| + | background-color: #E0E0E0; |
− | background-color: white;
| + | color: black; |
− | font-size: 16px;
| + | -webkit-transition-duration: 0.4s; |
− | font-weight: bolder;
| + | transition-duration: 0.4s; |
− | font color: #86BCFF;
| + | |
− | text-align: center;
| + | |
− | -webkit-transition-duration: 0.4s; /* Safari */
| + | |
− | transition-duration: 0.4s;
| + | |
− | margin: 4px 2px;
| + | |
− | border: 2px solid #86BCFF;
| + | |
| } | | } |
− | .tabs [type=radio] { | + | .fixed1 { |
− | display: none; | + | position:fixed; |
| + | top:10px; |
| } | | } |
− | .content {
| |
− | position: absolute;
| |
− | top: 80px; right: 0; bottom: 0; left: -450px;
| |
− | background: white;
| |
− | padding: 20px;
| |
− | display: none;
| |
− | width:1350px;
| |
− | }
| |
− | #slider {
| |
− | background-color: transparent;
| |
− | position: absolute;
| |
− | border-bottom: 3px solid white;
| |
− | margin: 7px 10px;
| |
− | transition: transform 0.5s;
| |
− | width: 130px;
| |
− | }
| |
− | [type=radio],#r1:checked ~ #slider {
| |
− |
| |
− | }
| |
− | [type=radio],#r2:checked ~ #slider {
| |
− |
| |
− | }
| |
− | [type=radio],#r3:checked ~ #slider {
| |
− |
| |
− | }
| |
− | [type=radio]:checked + label {
| |
− | color: white;
| |
− | }
| |
− | [type=radio]:checked + label + .content {
| |
− | display: inline-block;
| |
− | }
| |
− | .con1 {
| |
− | position: relative;
| |
− | left: 600px;
| |
− | top: 0px;
| |
− | font-family: Calibri;
| |
− | font-size: 200px;
| |
− | font-weight: bolder;
| |
− | font-color: black;
| |
− | }
| |
− | .con2 {
| |
− | position: relative;
| |
− | left: 30px;
| |
− | font-family: Calibri;
| |
− | font-size: 100%;
| |
− | font-weight: bolder;
| |
− | font-color: black;
| |
− | }
| |
− |
| |
− | @import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,600);
| |
| | | |
− | * {
| + | .page { |
− | margin:0;
| + | |
− | padding:0;
| + | |
− | box-sizing:border-box;
| + | |
− | -webkit-box-sizing:border-box;
| + | |
− | -moz-box-sizing:border-box;
| + | |
− | -webkit-font-smoothing:antialiased;
| + | |
− | -moz-font-smoothing:antialiased;
| + | |
− | -o-font-smoothing:antialiased;
| + | |
− | font-smoothing:antialiased;
| + | |
− | text-rendering:optimizeLegibility;
| + | |
| } | | } |
− | | + | .end { |
− | body {
| + | |
− | font-family:"Open Sans", Helvetica, Arial, sans-serif;
| + | |
− | font-weight:300;
| + | |
− | font-size: 12px;
| + | |
− | line-height:30px;
| + | |
− | color:#777;
| + | |
| } | | } |
| | | |
− | .container {
| |
− | max-width:400px;
| |
− | width:100%;
| |
− | margin:0 auto;
| |
− | position:relative;
| |
− | top: -90px;
| |
− | }
| |
| | | |
− | #contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea, #contact button[type="submit"] { font:400 12px/16px "Open Sans", Helvetica, Arial, sans-serif; }
| + | </style> |
| + | </head> |
| | | |
− | #contact {
| + | <script> |
− | background:#F9F9F9;
| + | /* Dynamic top menu positioning |
− | padding:25px;
| + | * |
− | margin:50px 0;
| + | */ |
− | }
| + | |
| | | |
− | #contact h3 {
| + | var num = 115; //number of pixels before modifying styles |
− | color: #F96;
| + | $(window).bind('scroll', function () { |
− | display: block;
| + | if ($(window).scrollTop() > num) { |
− | font-size: 30px;
| + | $('.menu-bar a').addClass('fixed1'); |
− | font-weight: 400;
| + | } else { |
− | }
| + | $('.menu-bar a').removeClass('fixed1'); |
− | | + | |
− | #contact h4 {
| + | |
− | margin:5px 0 15px;
| + | |
− | display:block;
| + | |
− | font-size:13px;
| + | |
− | }
| + | |
− | | + | |
− | fieldset {
| + | |
− | border: medium none !important;
| + | |
− | margin: 0 0 10px;
| + | |
− | min-width: 100%;
| + | |
− | padding: 0;
| + | |
− | width: 100%;
| + | |
− | }
| + | |
− | | + | |
− | #contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
| + | |
− | width:100%;
| + | |
− | border:1px solid #CCC;
| + | |
− | background:#FFF;
| + | |
− | margin:0 0 5px;
| + | |
− | padding:10px;
| + | |
− | }
| + | |
− | | + | |
− | #contact input[type="text"]:hover, #contact input[type="email"]:hover, #contact input[type="tel"]:hover, #contact input[type="url"]:hover, #contact textarea:hover {
| + | |
− | -webkit-transition:border-color 0.3s ease-in-out;
| + | |
− | -moz-transition:border-color 0.3s ease-in-out;
| + | |
− | transition:border-color 0.3s ease-in-out;
| + | |
− | border:1px solid #AAA;
| + | |
− | }
| + | |
− | | + | |
− | #contact textarea {
| + | |
− | height:100px;
| + | |
− | max-width:100%;
| + | |
− | resize:none;
| + | |
− | }
| + | |
− | | + | |
− | #contact button[type="submit"] {
| + | |
− | cursor:pointer;
| + | |
− | width:100%;
| + | |
− | border:none;
| + | |
− | background:#0CF;
| + | |
− | color:#FFF;
| + | |
− | margin:0 0 5px;
| + | |
− | padding:10px;
| + | |
− | font-size:15px;
| + | |
− | }
| + | |
− | | + | |
− | #contact button[type="submit"]:hover {
| + | |
− | background:#09C;
| + | |
− | -webkit-transition:background 0.3s ease-in-out;
| + | |
− | -moz-transition:background 0.3s ease-in-out;
| + | |
− | transition:background-color 0.3s ease-in-out;
| + | |
− | }
| + | |
− | | + | |
− | #contact button[type="submit"]:active { box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.5); }
| + | |
− | | + | |
− | #contact input:focus, #contact textarea:focus {
| + | |
− | outline:0;
| + | |
− | border:1px solid #999;
| + | |
− | }
| + | |
− | ::-webkit-input-placeholder {
| + | |
− | color:#888;
| + | |
− | }
| + | |
− | :-moz-placeholder {
| + | |
− | color:#888;
| + | |
− | }
| + | |
− | ::-moz-placeholder {
| + | |
− | color:#888;
| + | |
− | }
| + | |
− | :-ms-input-placeholder {
| + | |
− | color:#888;
| + | |
− | }
| + | |
− | | + | |
− | | + | |
− | .box1 {
| + | |
− | width: 800px; | + | |
− | border: 10px solid #97CBFF;
| + | |
− | padding: 25px;
| + | |
− | margin: 25px;
| + | |
− | border-radius: 8px;
| + | |
− | font-size: 25px;
| + | |
− | font-family: Calibri;
| + | |
− | font-color: black;
| + | |
− | line-height: 100px;
| + | |
− | position: relative;
| + | |
− | left: 200px;
| + | |
− | text-align:justify;
| + | |
− | top: 50px;
| + | |
− | }
| + | |
− | | + | |
− | #rig {
| + | |
− | max-width:900px;
| + | |
− | margin:0 auto; /*center aligned*/
| + | |
− | padding:0;
| + | |
− | font-size:0; /* Remember to change it back to normal font size if have captions */
| + | |
− | list-style:none;
| + | |
− | background-color:#000;
| + | |
− | }
| + | |
− | #rig li {
| + | |
− | display: inline-block;
| + | |
− | *display:inline;/*for IE6 - IE7*/
| + | |
− | width:25%;
| + | |
− | vertical-align:middle;
| + | |
− | box-sizing:border-box;
| + | |
− | margin:0;
| + | |
− | padding:0;
| + | |
− | }
| + | |
− |
| + | |
− | /* The wrapper for each item */
| + | |
− | .rig-cell {
| + | |
− | /*margin:12px;
| + | |
− | box-shadow:0 0 6px rgba(0,0,0,0.3);*/
| + | |
− | display:block;
| + | |
− | position: relative;
| + | |
− | overflow:hidden;
| + | |
− | }
| + | |
− |
| + | |
− | /* If have the image layer */
| + | |
− | .rig-img { | + | |
− | display:block;
| + | |
− | width: 100%;
| + | |
− | height: auto;
| + | |
− | border:none;
| + | |
− | transform:scale(1);
| + | |
− | transition:all 1s;
| + | |
− | }
| + | |
− | | + | |
− | #rig li:hover .rig-img {
| + | |
− | transform:scale(1.05);
| + | |
− | }
| + | |
− |
| + | |
− | /* If have the overlay layer */
| + | |
− | .rig-overlay { | + | |
− | position: absolute;
| + | |
− | display:block;
| + | |
− | top: 0;
| + | |
− | left: 0;
| + | |
− | bottom: 0;
| + | |
− | right: 0;
| + | |
− | margin: auto;
| + | |
− | background: #3DC0F1 url(img/link.png) no-repeat center 20%;
| + | |
− | background-size:50px 50px; | + | |
− | opacity:0;
| + | |
− | filter:alpha(opacity=0);/*For IE6 - IE8*/
| + | |
− | transition:all 0.6s;
| + | |
− | } | + | |
− | #rig li:hover .rig-overlay {
| + | |
− | opacity:0.8;
| + | |
− | }
| + | |
− | | + | |
− | /* If have captions */
| + | |
− | .rig-text {
| + | |
− | display:block;
| + | |
− | padding:0 30px;
| + | |
− | box-sizing:border-box;
| + | |
− | position: relative;
| + | |
− | left:200px;
| + | |
− | width:100%;
| + | |
− | text-align:center;
| + | |
− | text-transform:capitalize;
| + | |
− | font-size:28px;
| + | |
− | font-weight: bold;
| + | |
− | font-family: Calibri;
| + | |
− | font-weight:normal!important;
| + | |
− | top:40%;
| + | |
− | color:white;
| + | |
− | opacity:0;
| + | |
− | filter:alpha(opacity=0);/*For older IE*/
| + | |
− | transform:translateY(-20px);
| + | |
− | transition:all .3s;
| + | |
− | }
| + | |
− | #rig li:hover .rig-text {
| + | |
− | transform:translateY(0px);
| + | |
− | opacity:0.9;
| + | |
− | }
| + | |
− | | + | |
− | @media (max-width: 9000px) {
| + | |
− | #rig li {
| + | |
− | width:25%;
| + | |
| } | | } |
− | } | + | }); |
| + | </script> |
| | | |
− | @media (max-width: 700px) {
| + | <body> |
− | #rig li {
| + | <div class="top"> |
− | width:33.33%;
| + | <div class="top"><img alt="" style="float:left;margin-top:20px; width=390; height=80; z-index:+1;" src="https://static.igem.org/mediawiki/2016/3/38/CGU_Taiwan--LOGO7.jpg"> |
− | }
| + | </div> |
− | }
| + | |
| | | |
− | @media (max-width: 550px) {
| |
− | #rig li {
| |
− | width:50%;
| |
− | }
| |
− | }
| |
| | | |
− | </style>
| |
− | <div class='tabs'>
| |
− | <input type='radio' id='r1' name='t' checked>
| |
− | <label for='r1'>CONTACT US</label>
| |
− | <div class='content'>
| |
− | <p class='con1'>CONTACT US</p>
| |
− | <p class='con2'>Chang Gung University</p>
| |
− | <div class="container">
| |
− | <form id="contact" action="" method="post">
| |
− | <h3>Quick Contact</h3>
| |
− | <h4>Contact us today, and get reply with in 24 hours!</h4>
| |
− | <fieldset>
| |
− | <input placeholder="Your name" type="text" tabindex="1" required autofocus>
| |
− | </fieldset>
| |
− | <fieldset>
| |
− | <input placeholder="Your Email Address" type="email" tabindex="2" required>
| |
− | </fieldset>
| |
− | <fieldset>
| |
− | <input placeholder="Your Phone Number" type="tel" tabindex="3" required>
| |
− | </fieldset>
| |
− | <fieldset>
| |
− | <input placeholder="Your Web Site starts with http://" type="url" tabindex="4" required>
| |
− | </fieldset>
| |
− | <fieldset>
| |
− | <textarea placeholder="Type your Message Here...." tabindex="5" required></textarea>
| |
− | </fieldset>
| |
− | <fieldset>
| |
− | <button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Submit</button>
| |
− | </fieldset>
| |
− | </form>
| |
− | </div>
| |
− | </div>
| |
| | | |
− | <input type='radio' id='r2' name='t'>
| + | <div class="menu-bar"> |
− | <label for='r2'>PROJECT</label>
| + | <a style="left:400px;" href="https://2016.igem.org/Team:CGU_Taiwan/Home">HOME</a> |
− | <div class='content'>
| + | <a style="left:452px;" href="https://2016.igem.org/Team:CGU_Taiwan/Attributions">ATTRIBUTION</a> |
− | <p class='con1'>PROJECT</p>
| + | <a style="left:556px;" href="https://2016.igem.org/Team:CGU_Taiwan/Project">PROJECT</a> |
− | <div class="box1" style='line-height: 25px;'>hihihihihihihihihihihihihi</div>
| + | <a style="left:627px;" href="https://2016.igem.org/Team:CGU_Taiwan/Modeling">MODELING</a> |
− | </div>
| + | <a style="left:712px;" href="https://2016.igem.org/Team:CGU_Taiwan/Human_Practices">HUMANPRACTICES</a> |
− | | + | <a style="left:852px;" href="https://2016.igem.org/Team:CGU_Taiwan/Team">TEAM</a> |
− | <input type='radio' id='r3' name='t'>
| + | <a style="left:901px;" href="https://2016.igem.org/Team:CGU_Taiwan/Notebook">NOTEBOOK</a> |
− | <label for='r3'>NEWS</label>
| + | <a style="left:991px;" href="https://2016.igem.org/Team:CGU_Taiwan/Safety">SAFETY</a> |
− | <div class='content'>
| + | <a style="left:1054px;" href="https://2016.igem.org/Team:CGU_Taiwan/Parts">PARTS</a> |
− | <ul id="rig">
| + | </div> |
− | <li>
| + | <div class="mid" style="top:0px;"> |
− | <a class="rig-cell" href="#">
| + | <img style="width:1348px;height:645px;position:absolute;" src="https://static.igem.org/mediawiki/2016/e/ec/CGU_Taiwan--B2.jpg"> |
− | <img class="rig-img" style="width:300px; height:200px;" src="https://static.igem.org/mediawiki/2016/c/cd/CGU_Taiwan--macrophage.jpg">
| + | </div> |
− | <span class="rig-overlay"></span>
| + | <div class="mid" style="top: 645px;background-color:white;"> |
− | <span class="rig-text">2016/04</span>
| + | <h1 style="font-size:50px;font-weight:bold;position:absolute;left:550px;">ABSTRACT</h1> |
− | </a>
| + | <br></br> |
− | </li>
| + | <br></br> |
− | <li>
| + | <br></br> |
− | <a class="rig-cell" href="#">
| + | <HR style="color:#140731;width:70%;position:absolute;left:200px;"> |
− | <img class="rig-img" style="width:300px; height:200px;" src="https://static.igem.org/mediawiki/2016/7/7c/CGU_Taiwan--HA.jpg">
| + | <p style="margin: 150px;position:absolute;top:0px;line-height: 1.8;font-weight:15px;text-align:justify;">This text is styled with some of the text formatting properties. The heading uses the text-align, text-transform, and color properties. The paragraph is indented, aligned, and the space between characters is specified.This text is styled with some of the text formatting properties. The heading uses the text-align, text-transform, and color properties. The paragraph is indented, aligned, and the space between characters is specified.This text is styled with some of the text formatting properties. The heading uses the text-align, text-transform, and color properties. The paragraph is indented, aligned, and the space between characters is specified. </p> |
− | <span class="rig-overlay"></span>
| + | </div> |
− | <span class="rig-text">2016/05</span>
| + | <div class="mid" style="top:1290px;background:#140731;float:left;"> |
− | </a>
| + | <h1 style="position:absolute;left:100px;color:white;font-size:18px;margin:50px;float:left;">Chang Gung University</h1> |
− | </li>
| + | <p style="position:absolute;top:35px;color:white;font-size:13px;margin:50px;float:left;">Address:No.259, Wenhua 1st Rd., Guishan Dist., Taoyuan City 33302, Taiwan (R.O.C.)</p> |
− | <li>
| + | <p style="position:absolute;top:55px;left:80px;color:white;font-size:13px;margin:50px;float:left;">TEL: +886-3-2118800 FAX:+886-3-2118700</p> |
− | <a class="rig-cell" href="#">
| + | <p style="position:absolute;color:white;left:800px;font-size:18px;margin:50px;">CONTACT US</p> |
− | <img class="rig-img" style="width:300px; height:200px;" src="https://static.igem.org/mediawiki/2016/4/40/CGU_Taiwan--t4.jpg">
| + | </div> |
− | <span class="rig-overlay"></span>
| + | |
− | <span class="rig-text">2016/06</span>
| + | |
− | </a>
| + | |
− | </li>
| + | |
− | <li>
| + | |
− | <a class="rig-cell" href="#">
| + | |
− | <img class="rig-img" style="width:300px; height:200px;" src="https://static.igem.org/mediawiki/2016/c/cd/CGU_Taiwan--mhc.jpg">
| + | |
− | <span class="rig-overlay"></span>
| + | |
− | <span class="rig-text">2016/06</span>
| + | |
− | </a>
| + | |
− | </li>
| + | |
− | </ul>
| + | |
− | </div>
| + | |
− | <div id='slider'></div>
| + | |
− | </div>
| + | |
− | <!-- "><div"s are required to avoid spaces between display: inline-block elements. http://css-tricks.com/fighting-the-space-between-inline-block-elements/ -->
| + | |
− | <!-- ////////////////////// END OF TABS /////////////////////// --> | + | |
| | | |
| </html> | | </html> |