Merge branch 'test' of http://192.168.1.195:9998/web_developers/webportal into test

liuqimichale
2 parents c03ce36e f5bd1ba0
Showing 1 changed file with 150 additions and 11 deletions
css/services.css
@@ -56,11 +56,11 @@
     float: left;
 }
 .part3 .hd,.part5 .hd{width: 500px!important; margin-top: 50px; overflow: hidden;margin-left:500px; background: #fff; z-index: 1000;}
-.part .hd h2{width: 110px !important; cursor: pointer; float: left; font-size: 20px; padding-bottom: 15px; margin-bottom: 0; text-align: center;}
+.part .hd h2{width: 110px; cursor: pointer; float: left; font-size: 20px; padding-bottom: 15px; margin-bottom: 0; text-align: center;}
 .part .hd h2.active-nav{ border-bottom: solid 3px #3F9FFE;color:#3F9FFE; }
 .part .bd{width: 100%;float: left;}
 .part .line {
-    width: 90%;
+    width: 100%;
     /* margin: 0 auto; */
     height: 1px;
     background: #818181;
@@ -80,9 +80,9 @@
 .part .bd .img img {
     /*border: solid 1px #b8b8b8;*/
     display: block;
-    /*margin: 50px auto;*/
-    width: 100%;
-    height: 100%;
+    margin: 0px auto;
+    width: 80%;
+    height: 80%;
 }
 .part3 .bd .txt , .part5 .bd .txt {float: right; width: 500px;}
 .part4 .bd .txt {float: left; width: 500px; margin-left: 0px;}
@@ -94,8 +94,8 @@
 .part3 .hd h2.icon3 .icon{ background:url(../images/service_bgsmallIco.png) -127px 0 no-repeat; }
 .part3 .hd h2.icon3.active-nav .icon{ background:url(../images/service_bgsmallIco.png) -667px 0 no-repeat;}
 .part3 .bd .img {
-    width: 433.6px;
-    height: 395.2px;
+    /*width: 433.6px;*/
+    /*height: 395.2px;*/
     z-index: 1000;
     margin: -50px 0 0 0%;
     float: left;
@@ -121,8 +121,8 @@
 .part4 .hd h2.icon3 .icon{ background:url(../images/service_bgsmallIco.png) -305px 0 no-repeat; }
 .part4 .hd h2.icon3.active-nav .icon{ background:url(../images/service_bgsmallIco.png) -845px 0 no-repeat;}
 .part4 .bd .img {
-    width: 433.6px;
-    height: 395.2px;
+    /*width: 433.6px;*/
+    /*height: 395.2px;*/
     z-index: 1000;
     margin: -50px 0 0 30px;
     float: left;
@@ -141,13 +141,152 @@
 .part5 .hd h2.icon3 .icon{ background:url(../images/service_bgsmallIco.png) -485px 0 no-repeat; }
 .part5 .hd h2.icon3.active-nav .icon{ background:url(../images/service_bgsmallIco.png) -1025px 0 no-repeat;}
 .part5 .bd .img {
-    width: 433.6px;
-    height: 395.2px;
+    /*width: 433.6px;*/
+    /*height: 395.2px;*/
     z-index: 1000;
     margin: -50px 0 0 0%;
     float: left;
     /*overflow: hidden;*/
 }
+@media screen and (min-width: 1000px) and (max-width: 2500px){
+    .part .bd .img {
+        width: 433.6px;
+        height: 395.2px;
+    }
+}
+
+@media screen and (min-width: 980px) and (max-width: 1000px){
+    .part .bd .img {
+        width: 433.6px;
+        height: 395.2px;
+    }
+    .part3 .bd .txt,  .part5 .bd .txt {
+        margin-right: 0px;
+    }
+    
+}
+
+@media screen and (min-width: 767px) and (max-width: 980px){
+    .container{width: 100% !important}
+    .part .bd .img {
+        width: 80%;
+        height: 80%;
+    }
+     .part{height: auto}
+     .part .con {
+        width: 100%;
+        margin-left: 0px;
+        margin-bottom: 50px;
+    }
+     .part .hd {
+        width:100%;
+        margin:20px auto 0;
+        text-align: center;
+        overflow: hidden;
+    }
+     .part .bd .p1 {
+        font-size:2.5rem; text-align: center;
+
+    }
+     .part .bd .p2 {
+        font-size: 2.1rem; display: none
+
+    }
+     .part  .line{width: 100%;}
+     .part .hd h2 {
+        width: 80px;
+        float: none; display: inline-block; margin-left: -4px;
+    }
+     .part .bd .img {
+        font-size: 34px;
+        margin: 0 auto; float: none;
+        position: static;
+
+    }
+
+
+     .part3 , .part4, .part5 {
+        height: 750px;
+
+    }
+     .part .hd {
+        width: 100%;
+        margin: 30px auto 0;
+
+    }
+     .part3 .bd .txt,  .part5 .bd .txt {
+        float: none;
+        width: 100%;
+        margin:0 auto;
+    }
+
+     .part4 .bd .txt {
+        float: none;
+        width: 100%;
+        margin-left: 0;
+    }
+
+}
+
+@media screen and (min-width: 320px) and (max-width: 767px){
+    .container{
+        width: 100%
+    }
+     .part{height: auto; width: 100%;}
+     .part .con {
+        width: 100%;
+        margin-left: 0px;
+        margin-bottom: 50px;
+    }
+     .part .hd {
+        width:100%;
+        margin:20px auto 0;
+        text-align: center;
+        overflow: hidden;
+    }
+     .part .bd .p1 {
+        font-size:2.5rem; text-align: center;
+
+    }
+     .part .bd .p2 {
+        font-size: 2.1rem; display: none
+
+    }
+     .part  .line{width: 100%;}
+     .part .hd h2 {
+        width: 72px;
+        float: none; display: inline-block; margin-left: -4px;
+    }
+     .part .bd .img {
+        font-size: 34px;
+        margin: 0 auto; float: none;
+        position: static;
+
+    }
+
+
+     .part3 , .part4, .part5 {
+        height: 550px;
+        width: 100%;
+    }
+     .part .hd {
+        width: 90% !important;
+        margin: 30px auto 0;
+
+    }
+     .part3 .bd .txt,  .part5 .bd .txt {
+        float: none;
+        width: 100%;
+        margin:0 auto;
+    }
+
+     .part4 .bd .txt {
+        float: none;
+        width: 100%;
+        margin-left: 0;
+    }
+}
+
  
 /*footer sta*/
 .services-foottit{