Difference between revisions of "Team:NCTU Formosa/Project"

 
(23 intermediate revisions by 3 users not shown)
Line 40: Line 40:
 
}
 
}
 
/*大圖*/
 
/*大圖*/
−
.main-img{
+
@media screen and (min-width: 768px) {
 +
  .img-container{
 +
    height:100vh ;
 +
    overflow:hidden ;
 +
    width:100%;
 +
  }
 +
  .main-img{
 
     top: 0;
 
     top: 0;
 
     bottom: 0;
 
     bottom: 0;
Line 46: Line 52:
 
     right: 0;
 
     right: 0;
 
     width: 100%;
 
     width: 100%;
−
    height: 100%;
 
 
     margin: auto;
 
     margin: auto;
 
     z-index:999;
 
     z-index:999;
 +
    }
 +
}
 +
@media screen and (orientation: portrait) {
 +
    .img-container{
 +
        height:auto;
 +
        overflow:none;
 +
        width:100%;
 +
    }
 +
    .main-img{
 +
        top: 0;
 +
        bottom: 0;
 +
        left: 0;
 +
        right: 0;
 +
        width: 100%;
 +
        margin: auto;
 +
        z-index:999;
 +
    }
 
}
 
}
  
Line 64: Line 86:
 
     border-radius:10px;
 
     border-radius:10px;
 
     overflow:hidden;
 
     overflow:hidden;
−
     margin-left:17%;
+
     margin-left:20%;
 
     float:left;
 
     float:left;
 
     color:white;
 
     color:white;
 
     font-size:18pt;
 
     font-size:18pt;
−
     font-weight:bold;
+
     font-weight:bold;
 +
    margin-top:3%;
 +
    margin-bottom:3%;
 
     }
 
     }
 
.img-box1-1{
 
.img-box1-1{
Line 76: Line 100:
 
     border-radius:10px;
 
     border-radius:10px;
 
     overflow:hidden;
 
     overflow:hidden;
−
     margin-left:8%;
+
     margin-left:4%;
 
     float:left;
 
     float:left;
 
     color:white;
 
     color:white;
 
     font-size:18pt;
 
     font-size:18pt;
 
     font-weight:bold;
 
     font-weight:bold;
 +
    margin-top:3%;
 +
    margin-bottom:3%;
 
     }
 
     }
 
.img-box1-2{
 
.img-box1-2{
Line 88: Line 114:
 
     border-radius:10px;
 
     border-radius:10px;
 
     overflow:hidden;
 
     overflow:hidden;
−
     margin-left:8%;
+
     margin-left:4%;
 
     float:left;
 
     float:left;
 
     color:white;
 
     color:white;
 
     font-size:18pt;
 
     font-size:18pt;
 
     font-weight:bold;
 
     font-weight:bold;
 +
    margin-top:3%;
 +
    margin-bottom:3%;
 
     }   
 
     }   
 
      
 
      
Line 128: Line 156:
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
−
     margin-left:50px;
+
     margin-left:40px;
 
     font-family: 'Open Sans', sans-serif;
 
     font-family: 'Open Sans', sans-serif;
 
     opacity:none !important;
 
     opacity:none !important;
Line 137: Line 165:
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
−
     margin-left:40px;
+
     margin-left:60px;
 
     font-family: 'Open Sans', sans-serif;
 
     font-family: 'Open Sans', sans-serif;
 
     text-shadow:2px 2px black;
 
     text-shadow:2px 2px black;
Line 145: Line 173:
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
−
     margin-left:40px;
+
     margin-left:60px;
 
     font-family: 'Open Sans', sans-serif;
 
     font-family: 'Open Sans', sans-serif;
 
     text-shadow:2px 2px black;
 
     text-shadow:2px 2px black;
Line 153: Line 181:
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
−
     margin-left:53px;
+
     margin-left:60px;
 
     font-family: 'Open Sans', sans-serif;
 
     font-family: 'Open Sans', sans-serif;
 
     text-shadow:2px 2px black;
 
     text-shadow:2px 2px black;
Line 159: Line 187:
 
}
 
}
 
.text4{
 
.text4{
 +
    position:absolute;
 +
    margin-top:80px;
 +
    margin-left:53px;
 +
    font-family: 'Open Sans', sans-serif;
 +
    text-shadow:2px 2px black;
 +
    z-index:500;
 +
}
 +
.text5{
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
Line 166: Line 202:
 
     z-index:500;
 
     z-index:500;
 
}
 
}
−
 
  
 
/*overview*/
 
/*overview*/
Line 183: Line 218:
 
</style>
 
</style>
 
</head>
 
</head>
 +
 
<body>
 
<body>
−
     <div>
+
     <div class="img-container">
−
         <img src="https://static.igem.org/mediawiki/2016/8/87/Project_NCTU.png" class="main-img" width="100%">
+
         <img src="https://static.igem.org/mediawiki/2016/f/f8/NCTU_PROJECT_BIG_PICTURE.png" class="main-img" width="100%">
 
     </div>
 
     </div>
  
 
<div style="width:80%;margin:auto;margin-bottom:3%;">
 
<div style="width:80%;margin:auto;margin-bottom:3%;">
−
<h1>Overview</h1>
+
<h1></h1>
−
<p class="overviewHP">
+
 
−
The ultimate goal of our project is to implement the whole system including Pantide and the device into the agricultural industry and solve the problem caused by the excessive use of the chemical pesticide. Therefore, we design directed human practices that facilitate the project multidimensionally. The human practices consist of five aspects—Study, collaborations, education, meetups, and further considerations.
+
−
</p>
+
 
</div>
 
</div>
  
Line 198: Line 232:
 
         <div class="img-box1">
 
         <div class="img-box1">
 
             <div class="text">Description</div>
 
             <div class="text">Description</div>
−
             <img src="https://static.igem.org/mediawiki/2016/7/7a/Study2.jpg" width="100%" height="100%" class="HP_image">
+
             <img src="https://static.igem.org/mediawiki/2016/f/f1/NCTU_descirption_main_project_page.jpg" width="100%" height="100%" class="HP_image">
 
         </div>
 
         </div>
 
     </a>
 
     </a>
Line 205: Line 239:
 
         <div class="img-box1-1">       
 
         <div class="img-box1-1">       
 
             <div class="text1">Design</div>
 
             <div class="text1">Design</div>
−
             <img src="https://static.igem.org/mediawiki/2016/f/fc/Colloboration_HP.jpg" width="100%" height="100%" class="HP_image">
+
             <img src="https://static.igem.org/mediawiki/2016/a/ab/NCRU_Desigm_project_main_page.jpg" width="100%" height="100%" class="HP_image">
 
         </div>
 
         </div>
 
     </a>
 
     </a>
 +
 
      
 
      
−
     <a href="https://2016.igem.org/Team:NCTU_Formosa/Device">
+
     <a href="https://2016.igem.org/Team:NCTU_Formosa/Demonstrate">
 
         <div class="img-box1-2">
 
         <div class="img-box1-2">
 
             <div class="text2">Device</div>
 
             <div class="text2">Device</div>
−
             <img src="https://static.igem.org/mediawiki/2016/7/72/Education1.jpg" width="100%" height="100%" class="HP_image">
+
             <img src="https://static.igem.org/mediawiki/2016/7/75/NCTU_MAIN_PAGE_DEVICE.JPG" width="100%" height="100%" class="HP_image">
 
         </div>
 
         </div>
 
     </a>
 
     </a>
 
      
 
      
−
     <a href="https://2016.igem.org/Team:NCTU_Formosa/Results">
+
     <a href="https://2016.igem.org/Team:NCTU_Formosa/Proof">
 
         <div class="img-box1">
 
         <div class="img-box1">
 
             <div class="text3">Results</div>
 
             <div class="text3">Results</div>
−
             <img src="https://static.igem.org/mediawiki/2016/3/3b/Meetup_HP.JPG" width="100%" height="100%" class="HP_image">
+
             <img src="https://static.igem.org/mediawiki/2016/9/96/NCTU_Result_project_main_page.jpg" width="100%" height="100%" class="HP_image">
 
         </div>
 
         </div>
 
     </a>
 
     </a>
 
      
 
      
−
     <a href="https://2016.igem.org/Team:NCTU_Formosa/Modelling">
+
     <a href="https://2016.igem.org/Team:NCTU_Formosa/Model">
 
         <div class="img-box1-1">
 
         <div class="img-box1-1">
−
             <div class="text4">Modelling</div>
+
             <div class="text4">Modeling</div>
−
             <img src="https://static.igem.org/mediawiki/2016/d/d3/Further.jpg" width="100%" height="100%" class="HP_image">
+
             <img src="https://static.igem.org/mediawiki/2016/4/42/NCTU_Modeling_project_main_page.jpg" width="100%" height="100%" class="HP_image">
 
         </div>
 
         </div>
 
     </a>
 
     </a>
Line 232: Line 267:
 
<a href="https://2016.igem.org/Team:NCTU_Formosa/Safety">
 
<a href="https://2016.igem.org/Team:NCTU_Formosa/Safety">
 
         <div class="img-box1-2">
 
         <div class="img-box1-2">
−
             <div class="text4">Safety</div>
+
             <div class="text5">Safety</div>
−
             <img src="https://static.igem.org/mediawiki/2016/d/d3/Further.jpg" width="100%" height="100%" class="HP_image">
+
             <img src="https://static.igem.org/mediawiki/2016/9/9e/NCTU_safety_main_project_page.jpg" width="100%" height="100%" class="HP_image">
 
         </div>
 
         </div>
 
     </a>
 
     </a>

Latest revision as of 02:50, 4 November 2016

Description
Design
Device
Results
Modeling
Safety