modelmarketdetail.css 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. .sg-price-container {
  2. margin: 15px;
  3. font-size: 1.3em;
  4. }
  5. .con{
  6. background: #fff;
  7. width: 100%;
  8. float: left;
  9. /* margin-left: 8.3%; */
  10. }
  11. @media (min-width: 500px){
  12. .con{
  13. background: #fff;
  14. width: 83.3%;
  15. float: left;
  16. margin-left: 8.3%;
  17. }
  18. }
  19. @media (min-width: 1200px){
  20. .ex{
  21. width: 20%;
  22. }
  23. }
  24. .section_3{
  25. padding-left:10%;margin-top:40px;color:#fff;width: 100%;
  26. }
  27. .section_3>p{
  28. font-size:30px
  29. }
  30. .section_3>div>li{
  31. background: #fff;float:left;list-style: none;width: 100px;border: 1px solid #fff;border-radius: 50px;height: 35px;text-align: center;padding-top: 8px;margin-top: 22px;margin-left: 12px;
  32. }
  33. .section_3>div>li:hover{
  34. background: #0094DA;float:left;list-style: none;width: 100px;border: 1px solid #fff;border-radius: 50px;height: 35px;text-align: center;padding-top: 8px;margin-top: 22px;margin-left: 12px;background: #0094DA;
  35. }
  36. .section_3>div>li>a{
  37. color : #0094DA;
  38. font-size: 15px;
  39. }
  40. .section_3>div>li:hover>a{
  41. color:#fff;
  42. font-size: 15px;
  43. }
  44. .section_2>div>li{
  45. float: left;
  46. text-align: left;
  47. padding: 0;
  48. height: 15px;
  49. line-height: 15px;
  50. margin-bottom:9px;
  51. color: #fff;
  52. }
  53. .use_btn{
  54. background: #fff;
  55. margin-top: 28px;
  56. width: 130px;
  57. height: 40px;
  58. border-radius: 50px;
  59. text-align: center;
  60. vertical-align: middle;
  61. padding-top: 10px;
  62. border: 1px solid #fff;
  63. }
  64. .use_btn>a{
  65. color:#0094DA;font-size: 17px;
  66. }
  67. .use_btn:hover>a{
  68. color:#fff;font-size: 17px;
  69. }
  70. .use_btn:hover{
  71. background: #0094DA;
  72. margin-top: 28px;
  73. width: 130px;
  74. height: 40px;
  75. border-radius: 50px;
  76. text-align: center;
  77. vertical-align: middle;
  78. padding-top: 10px;
  79. border: 1px solid #fff;
  80. color:#fff;
  81. cursor: pointer;
  82. }
  83. @media only screen and (max-width: 992px) {
  84. .banner_margin{
  85. margin-left: auto !important;
  86. margin:auto;
  87. }
  88. .topbackground{
  89. background: #0094DA !important;
  90. height: auto !important;
  91. }
  92. }
  93. @media only screen and (min-width: 1920px){
  94. .m_height{
  95. max-height: 600px;
  96. }
  97. }
  98. @media (max-width: 640px){
  99. .box {
  100. width: 100%;
  101. }
  102. }
  103. .s1{
  104. margin-top:120px;padding-bottom: 20px;
  105. }
  106. .section_1{
  107. height:auto;display:inline-block;width:100%;
  108. }
  109. .section_1 .title{
  110. float:left;color:#fff;padding-left:10%;margin-top:20px;
  111. }
  112. .section_1 .qrcode{
  113. float:left;margin-top:20px;padding-left:10%;
  114. }
  115. .section_1 .qrcode img{
  116. width:120px;height:120px;
  117. }
  118. .section_2{
  119. padding-left:10%;margin-top:40px;color:#fff;height:80px;width:100%;
  120. }
  121. .s2{
  122. margin-top:120px;padding-bottom: 20px;padding-top: 20px;
  123. }
  124. .s2 #myCarousel{
  125. width:220px;margin-left:30%
  126. }
  127. .boxdetail{
  128. text-align: center;border:none;background:#fff;
  129. }
  130. .right span {
  131. position: absolute;
  132. top: 20%;
  133. right: 15px;
  134. }
  135. .left span {
  136. position: absolute;
  137. top: 20%;
  138. left: 15px;
  139. }
  140. @media only screen and (max-width: 767px){
  141. .s1{
  142. margin-top: 70px;
  143. }
  144. .s2{
  145. margin-top: 10px;
  146. }
  147. .use_btn{
  148. margin-top: 18px;
  149. width: 100px;
  150. height: 30px;
  151. padding-top: 6px;
  152. }
  153. .section_1 .title{
  154. float:left;color:#fff;padding-left:0%;margin-top:20px;
  155. }
  156. .section_1 .qrcode{
  157. float:left;margin-top:30px;padding-left:0%;
  158. }
  159. .section_2{
  160. padding-left:0%;margin-top:30px;color:#fff;height:120px;width:100%;
  161. }
  162. .section_2>div>li{
  163. font-size: 12px;
  164. float: left;
  165. text-align: left;
  166. padding: 0;
  167. color: #fff;
  168. list-style: none;
  169. text-align: center;
  170. border-left: 1px solid #fff;
  171. }
  172. .section_2>div>li:last-child{
  173. float: left;
  174. text-align: left;
  175. padding: 0;
  176. color: #fff;
  177. list-style: none;
  178. text-align: center;
  179. border-left: 1px solid #fff;
  180. border-right: 1px solid #fff;
  181. }
  182. .section_3{
  183. padding-left:0%;margin-top:30px;color:#fff;width: 100%;height: 120px;
  184. }
  185. .section_3>div>li{
  186. background: none;float:left;list-style: none;width: 90px;border: 1px solid #fff;border-radius: 50px;height: 25px;text-align: center;padding-top: 3px;
  187. margin-top: 18px;margin-left: 12px;
  188. }
  189. .section_3>div>li>a{
  190. color : #fff;
  191. font-size: 13px;
  192. }
  193. .section_3>div>li:hover{
  194. background: #fff !important;float:left;list-style: none;
  195. width: 90px;
  196. border: 1px solid #fff;border-radius: 50px;height: 25px;text-align: center;padding-top: 3px;
  197. margin-top: 18px;
  198. margin-left: 12px;background: #0094DA;
  199. }
  200. .section_3>div>li:hover>a{
  201. color:#0094DA;
  202. font-size: 13px;
  203. }
  204. .mar_r_70px{
  205. margin-right: -70px !important;
  206. }
  207. .mar_l_70px{
  208. margin-left: -70px !important;
  209. }
  210. }