vid_details.css 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
  1. body {background:#F8F8F8;}
  2. .body_box {position: relative;}
  3. /*导航*/
  4. .nav-box {position:absolute;top:0;left:0;width:100%;z-index:20;}
  5. .nav-box a {display:inline-block;}
  6. .nav-box a:first-child {padding:15px;}
  7. .nav-box a:first-child img {display:inline-block;width:9px;height:16px;}
  8. .nav-box a:last-child {float:right;padding:15px;}
  9. .nav-box a:last-child img {width:23px;height:16px;}
  10. /*视频播放*/
  11. .deta-box {}
  12. .playvideo {height:250px;position:relative;}
  13. .playvideo .poay {position:absolute;top:50%;left:50%;z-index:15;width:40px;height:40px;margin-left:-20px;margin-top:-20px;}
  14. .playvideo .poay img {display:block;width:100%;height:100%;}
  15. .polay-magnigy {float:right;}
  16. .polay-magnigy a {display:inline-block;width:14px;height:14px;margin:4px;}
  17. .polay-magnigy a img {display:block;width:100%;height:100%;}
  18. .polay-time {color:#fff;font-size:0.75rem;margin-left:10px;line-height:22px;}
  19. .polay-axis {margin-left:15px;width:170px;height:1px;background:#fff;position:relative;}
  20. .polay-axis span {display:inline-block;width:0;background:#FF3B23;height:1px;position:relative;top:-15px;left:0;}
  21. .polay-axis span:after {content:"";display:inline-block;width:13px;height:13px;background:url(/image/video/icon-hoki.png) no-repeat center/13px 13px;position:absolute;top:-6px;right:-7px;}
  22. /*楼盘名称*/
  23. .lpname {background:#fff;padding:20px 15px 20px;}
  24. .lpname .lpname-box {position:relative;}
  25. .lpname .lpname-img {display:inline-block;vertical-align:top;width:40px;height:40px;}
  26. .lpname .lpname-img img {display:block;width:100%;height:100%;}
  27. .lpname .lpname-font {display:inline-block;vertical-align:top;margin-left:10px;width:70%;}
  28. .lpname .lpname-hint {color:#666;font-size:0.875rem;margin:15px 0;line-height:25px;}
  29. .lpname-font .lpname-title {position:relative;}
  30. .lpname-font .lpname-title span {font-size:1.125rem;color:#333;display:inline-block;max-width:73%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
  31. .lpname-font .lpname-title a {display:inline-block;border:1px solid #38a2ff;font-size:0.6875rem;padding:2px 5px;position:absolute;top:1px;color:#38a2ff;margin-left:8px;}
  32. .lpname-font .tag {}
  33. .lpname-font .tag i {display:inline-block;border:1px solid #E6E6E6;color:#666666;border-radius:20px;font-size:0.75rem;padding:2px 10px;}
  34. .lpname-map {position:absolute;top:0;right:5px;font-size:0.75rem;color:#666;}
  35. .lpname-map:before {content:"";display:inline-block;width:8px;height:10px;background:url(/image/video/icon-m.png) no-repeat center/8px 10px;margin-right:5px;}
  36. .lpname .video-list-label {margin:10px 0 0;font-size:0.625rem;color:#999;}
  37. .lpname .video-list-label span:first-child {}
  38. .lpname .video-list-label span:first-child:before {content:"";display:inline-block;width:13px;height:14px;background:url(/image/video/count.png) no-repeat center/13px 14px;position:relative;top:2px;right:3px;}
  39. .lpname .video-list-label span:last-child {margin-left:20px;}
  40. .lpname .video-list-label span:last-child:before {content:"";display:inline-block;width:14px;height:14px;background:url(/image/video/icon-like.png) no-repeat center/14px 14px;position:relative;top:2px;right:3px;}
  41. /*点赞*/
  42. .lpname .video-list-label span.oin {color:#FF5454;}
  43. .lpname .video-list-label span.oin:before {content:"";display:inline-block;width:14px;height:14px;background:url(/image/video/icon-like2.png) no-repeat center/14px 14px;position:relative;top:2px;right:3px;}
  44. /*热播推荐*/
  45. .hot-box {margin-top:30px;margin-bottom:50px;}
  46. .hot-box .hot-title {padding:0 15px;}
  47. .hot-box .hot-title span {font-size:1.125rem;color:#333;}
  48. .hot-box .hot-title span i {color:#FF5454;}
  49. .hot-box .hot-title a {color:#666;font-size:0.75rem;float:right;position:relative;top:4px;}
  50. .video-li {padding:15px 15px;}
  51. .video-li ul li {width:48%;display:inline-block;vertical-align:top;box-shadow:0px 1px 13px 2px rgba(0, 0, 0, 0.1);border-radius:5px;margin-top:15px;}
  52. .video-li ul li:nth-child(1) {margin-top:0;}
  53. .video-li ul li:nth-child(2) {margin-top:0;}
  54. .video-li ul li:nth-child(2n) {float:right;}
  55. .video-li ul li .video-li-img {position:relative;height:8.8rem;}
  56. .video-li ul li .video-li-img span {display:inline-block;width:40px;height:40px;position:absolute;top:-4px;left:-4px;}
  57. .video-li ul li .video-li-img span img {display:block;width:100%;height:100%;}
  58. .video-li ul li .video-li-img img {display:block;width:100%;height:100%;}
  59. .video-li ul li .video-li-img:before {content:"";display:inline-block;width:29px;height:29px;background:url(/image/video/play.png) no-repeat center/29px 29px;top:50%;left:50%;position:absolute;margin-left:-18px;margin-top:-14px;}
  60. .video-li-font {padding:10px;}
  61. .video-li-font .video-li-title {font-size:0.875rem;color:#333;}
  62. .video-li-label {margin:10px 0 0;font-size:0.625rem;color:#999;}
  63. .video-li-label span:first-child {}
  64. .video-li-label span:first-child:before {content:"";display:inline-block;width:13px;height:14px;background:url(/image/video/count.png) no-repeat center/13px 14px;position:relative;top:2px;right:3px;}
  65. .video-li-label span:last-child {float:right;}
  66. .video-li-label span:last-child:before {content:"";display:inline-block;width:14px;height:14px;background:url(/image/video/icon-like.png) no-repeat center/14px 14px;position:relative;top:2px;right:3px;}
  67. /*点赞*/
  68. .video-li-label span.oin {color:#FF5454;}
  69. .video-li-label span.oin:before {content:"";display:inline-block;width:14px;height:14px;background:url(/image/video/icon-like2.png) no-repeat center/14px 14px;position:relative;top:2px;right:3px;}
  70. /*2018.7.26 明 移过来内页方便快速加载*/
  71. .Content{height:100%;}
  72. .m_signUp_box{z-index:1000;position:relative;}
  73. .m_signUp{border:1px solid;width:100%;height:100%;position: fixed;top:0;left:0;z-index:100;background-color:#000;opacity:0.3;}
  74. .m_form{width:80%;position:absolute;left:50%;margin-left:-40%;z-index:110;border-radius:10px;overflow:hidden;background:#FFF;padding-bottom:40px;box-shadow:7px 7px 20px 0px rgba(70, 54, 54, 0.35);
  75. animation:change 0.4s;
  76. -webkit-animation:change 0.4s;
  77. -moz-animation:change 0.4s;
  78. -o-animation:change 0.4s;
  79. }
  80. @keyframes change {
  81. 0% {left:100%;opacity:0;}
  82. 100% {opacity:1;}
  83. }
  84. -webkit-@keyframes change {
  85. 0% {left:100%;opacity:0;}
  86. 100% {opacity:1;}
  87. }
  88. -moz-@keyframes change {
  89. 0% {left:100%;opacity:0;}
  90. 100% {opacity:1;}
  91. }
  92. -o-@keyframes change {
  93. 0% {left:100%;opacity:0;}
  94. 100% {opacity:1;}
  95. }
  96. .m_form_title{height:110px;background: url("/image/m_xbm1.png") no-repeat 0 0 / 100% 100%;text-align:center;line-height:135px;font-size:1.5rem;color:#FFF;position:relative;}
  97. .m_form_title img{width:37%;display:block;position:absolute;bottom:9px;left:50%;margin-left:-19%;}
  98. .m_form_input{border:1px solid #D2CFCF;width:85%;height:40px;margin:auto;margin-bottom:15px;position:relative;top:13px;background:#FBFBFB;}
  99. .m_form_input img{display: block;width:13px;margin-top:10px;float:left;margin-left:14px;}
  100. .m_form_input input{outline:none;background:#fbfbfb;border-radius:0;float:left;width:80%;height:60%;border:0;margin-left:10px;font-size:0.9rem;color:#9b9b9b;border-left:1px solid;margin-top:8px;padding-left:5px;}
  101. .m_button{outline:none;width:85%;height:40px;border:0;background:#FF5849;border-radius:5px;margin:auto;display: block;margin-top:28px;font-size:1.1rem;color:#FFF;position:relative;z-index:100;}
  102. .y_fonr_text{font-size: 0.8rem; color: #666; width: 85%; margin: 0 auto; line-height: 20px;margin-top:5px;}
  103. .m_close{position:absolute;top:5%;left:50%;z-index:100;width:36px;margin-left:130px;margin-top:54px;
  104. animation:change 0.4s;
  105. -webkit-animation:change 0.4s;
  106. -moz-animation:change 0.4s;
  107. -o-animation:change 0.4s;
  108. }
  109. .m_close img{width:100%;display:block;}
  110. .m_form_input input:-webkit-input-placeholder {color: #8AC6FE;}
  111. .m_form_input input:-moz-placeholder {color: #8AC6FE;}
  112. .m_form_input input:-ms-input-placeholder {color: #8AC6FE;}
  113. .m_form_input input:-o-input-placeholder {color: #8AC6FE;}
  114. /*报名 20180809修改 */
  115. .lpapply2{ position: absolute; left: 50%; top:-100%; z-index:110; width:300px; margin-left: -150px;}
  116. .lpapply2_main{ position: relative; width: 100%; height: 100%;}
  117. .lpapple_xian{
  118. position: absolute;
  119. left: 50%;
  120. margin-left: -0.5px;
  121. top: -160px;
  122. height: 180px;
  123. background: #fff;
  124. width: 1px;
  125. z-index: 1;
  126. }
  127. .lpapply2_top p.topimg{ width: 100%; height: auto;position: relative; top: 2px;}
  128. .lpapply2_top p.topimg img{ width: 100%; height: auto;}
  129. .lpapply2_top .lpapply2_topconter{ width: 100%; height: auto; background: #fff; border-radius: 0 0 10px 10px; padding: 0 20px 20px;}
  130. .lpapply2_top .lpapply2_topconter .title{ font-size: 1.2rem; color: #40a0eb; font-weight: 600; text-align: center;}
  131. .lpapply2_top .lpapply2_topconter .texi{ width: 95%; margin: 0 auto; font-size: 0.8rem; line-height: 20px; color: #999; text-align: center; margin-top: 5px; }
  132. .lpapply2_top .lpapply2_topconter .texi em{ color: #f56140;}
  133. .lpapply2_top .lpapply2_topconter .input_text{ -webkit-user-modify: read-write-plaintext-only; margin-top: 10px; width: 100%; background: #f1f1f1; border-radius: 30px; border: none; text-align: center; height: 38px; font-size: 0.75rem;color: #666; padding: 0 15px;}
  134. .lpapply2_top .lpapply2_topconter .bmipc{ border: none; margin: 15px 0px 10px 0; font-size: 1rem; background: #40a0eb; color: #fff; text-align: center; font-weight:600; display: block; width: 100%; padding: 6px 0; border-radius: 30px;}
  135. .lpapply2_gb{ width: 30px; height: 30px; margin: 0 auto; position: absolute; left: 50%; margin-left: -15px; bottom: -50px;}
  136. .lpapply2_gb img{ width: 100%; height: 100%;}
  137. .keep {position:fixed;top:0;bottom:0;width:100%;background:rgba(0,0,0,0.4);z-index:101;display:none;}
  138. @media screen and (min-width: 300px) and (max-width: 374px) {
  139. .axis-box {padding:5px;}
  140. .m_close{margin-left:115px;margin-top:40px;width:30px;}
  141. .m_form_title{height:100px;}
  142. .m_form{padding-bottom:28px;}
  143. }