diff --git a/css/services.css b/css/services.css index 2ccbb0a..cbcfe97 100644 --- a/css/services.css +++ b/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{