Team:HFUT-China/softearecss

div.container {

   background-color: #E6E6E1;

}

@media (min-width: 1300px) {

   div#whole-project {
       background-image: url(Intro_photo.png);
       background-repeat: no-repeat;
       background-size: 500px 291px;
       width: 500px;
       height: 291px;
   }
   div#ug-srecommend {
       background-image: url(System.png);
       background-repeat: no-repeat;
       background-size: 500px 300px;
       width: 500px;
       height: 300px;
   }
   div#ug-simulate {
       background-image: url(Simulate.png);
       background-repeat: no-repeat;
       background-size: 500px 300px;
       width: 500px;
       height: 300px;
   }
   div#ug-project {
       background-image: url(Project_page.png);
       background-repeat: no-repeat;
       background-size: 1000px 599px;
       width: 1000px;
       height: 599px;
   }
   div#ug-design {
       background-image: url(Design.png);
       background-repeat: no-repeat;
       background-size: 1000px 599px;
       width: 1000px;
       height: 599px;
   }
   div#search{
   	background-image: url(Search_.png);
       background-repeat: no-repeat;
       background-size: 500px 500px;
       width: 500px;
       height: 500px;
   }
   div#recommend{
   	background-image: url(Recommend_.png);
       background-repeat: no-repeat;
       background-size: 500px 500px;
       width: 500px;
       height: 500px;
   }
   div#simulator{
   	background-image: url(Simulation_.png);
       background-repeat: no-repeat;
       background-size: 500px 500px;
       width: 500px;
       height: 500px;
   }

}

@media (min-width: 1050px) and (max-width: 1300px) {

   div#whole-project {
       background-image: url(Intro_photo.png);
       background-repeat: no-repeat;
       background-size: 400px 233px;
       width: 400px;
       height: 233px;
   }
   div#ug-srecommend {
       background-image: url(System.png);
       background-repeat: no-repeat;
       background-size: 400px 240px;
       width: 400px;
       height: 240px;
   }
   div#ug-simulate {
       background-image: url(Simulate.png);
       background-repeat: no-repeat;
       background-size: 400px 240px;
       width: 400px;
       height: 240px;
   }
   div#ug-project {
       background-image: url(Project_page.png);
       background-repeat: no-repeat;
       background-size: 800px 480px;
       width: 800px;
       height: 480px;
   }
   div#ug-design {
       background-image: url(Design.png);
       background-repeat: no-repeat;
       background-size: 800px 480px;
       width: 800px;
       height: 480px;
   }
   div#search{
   	background-image: url(Search_.png);
       background-repeat: no-repeat;
       background-size: 400px 400px;
       width: 400px;
       height: 400px;
   }
   div#recommend{
   	background-image: url(Recommend_.png);
       background-repeat: no-repeat;
       background-size: 400px 400px;
       width: 400px;
       height: 400px;
   }
   div#simulator{
   	background-image: url(Simulation_.png);
       background-repeat: no-repeat;
       background-size: 400px 400px;
       width: 400px;
       height: 400px;
   }

}

@media (min-width: 800px) and (max-width: 1050px) {

   div#whole-project {
       background-image: url(Intro_photo.png);
       background-repeat: no-repeat;
       background-size: 300px 175px;
       width: 300px;
       height: 175px;
   }
   div#ug-srecommend {
       background-image: url(System.png);
       background-repeat: no-repeat;
       background-size: 300px 180px;
       width: 300px;
       height: 180px;
   }
   div#ug-simulate {
       background-image: url(Simulate.png);
       background-repeat: no-repeat;
       background-size: 300px 180px;
       width: 300px;
       height: 180px;
   }
   div#ug-project {
       background-image: url(Project_page.png);
       background-repeat: no-repeat;
       background-size: 600px 360px;
       width: 600px;
       height: 360px;
   }
   div#ug-design {
       background-image: url(Design.png);
       background-repeat: no-repeat;
       background-size: 600px 360px;
       width: 600px;
       height: 360px;
   }
   div#search{
   	background-image: url(Search_.png);
       background-repeat: no-repeat;
       background-size: 300px 300px;
       width: 300px;
       height: 300px;
   }
   div#recommend{
   	background-image: url(Recommend_.png);
       background-repeat: no-repeat;
       background-size: 300px 300px;
       width: 300px;
       height: 300px;
   }
   div#simulator{
   	background-image: url(Simulation_.png);
       background-repeat: no-repeat;
       background-size: 300px 300px;
       width: 300px;
       height: 300px;
   }

}

@media (max-width: 800px){

   div#whole-project {
       background-image: url(Intro_photo.png);
       background-repeat: no-repeat;
       background-size: 200px 117px;
       width: 200px;
       height: 117px;
   }
   div#ug-srecommend {
       background-image: url(System.png);
       background-repeat: no-repeat;
       background-size: 200px 120px;
       width: 200px;
       height: 120px;
   }
   div#ug-simulate {
       background-image: url(Simulate.png);
       background-repeat: no-repeat;
       background-size: 200px 120px;
       width: 200px;
       height: 120px;
   }
   div#ug-project {
       background-image: url(Project_page.png);
       background-repeat: no-repeat;
       background-size: 400px 240px;
       width: 400px;
       height: 3240px60px;
   }
   div#ug-design {
       background-image: url(Design.png);
       background-repeat: no-repeat;
       background-size: 400px 240px;
       width: 400px;
       height: 240px;
   }
   div#search{
       background-image: url(Search_.png);
       background-repeat: no-repeat;
       background-size: 200px 200px;
       width: 200px;
       height: 200px;
   }
   div#recommend{
       background-image: url(Recommend_.png);
       background-repeat: no-repeat;
       background-size: 200px 200px;
       width: 200px;
       height: 200px;
   }
   div#simulator{
       background-image: url(Simulation_.png);
       background-repeat: no-repeat;
       background-size: 200px 200px;
       width: 200px;
       height: 200px;
   }

}