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

 
(22 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:5%;
+
     margin-top:3%;
 +
    margin-bottom:3%;
 
     }
 
     }
 
.img-box1-1{
 
.img-box1-1{
Line 77: 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:5%;
+
     margin-top:3%;
 +
    margin-bottom:3%;
 
     }
 
     }
 
.img-box1-2{
 
.img-box1-2{
Line 90: 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:5%;
+
     margin-top:3%;
 +
    margin-bottom:3%;
 
     }   
 
     }   
 
      
 
      
Line 140: Line 165:
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
−
     margin-left:50px;
+
     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 148: Line 173:
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
−
     margin-left:50px;
+
     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 164: Line 189:
 
     position:absolute;
 
     position:absolute;
 
     margin-top:80px;
 
     margin-top:80px;
−
     margin-left:60px;
+
     margin-left:53px;
 +
    font-family: 'Open Sans', sans-serif;
 +
    text-shadow:2px 2px black;
 +
    z-index:500;
 +
}
 +
.text5{
 +
    position:absolute;
 +
    margin-top:80px;
 +
    margin-left:65px;
 
     font-family: 'Open Sans', sans-serif;
 
     font-family: 'Open Sans', sans-serif;
 
     text-shadow:2px 2px black;
 
     text-shadow:2px 2px black;
 
     z-index:500;
 
     z-index:500;
 
}
 
}
−
 
  
 
/*overview*/
 
/*overview*/
Line 186: 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 201: 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 208: 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 235: 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