box.css 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165
  1. /*=====================容器样式============================= */
  2. h1,h2,h3,h4,h5,h6 {
  3. margin: 0;
  4. font-family: 'Open Sans', sans-serif;
  5. /*font-family: 'Signika', sans-serif;*/
  6. font-weight: 700;
  7. color: inherit;
  8. text-rendering: optimizelegibility;
  9. margin-bottom:10px;
  10. }
  11. .box {
  12. width:100%;
  13. min-height:100%;
  14. -moz-box-shadow:0 1px 0px rgba(255, 255, 255, 1);
  15. -webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 1);
  16. box-shadow: 0 1px 0px rgba(255, 255, 255, 1);
  17. margin-bottom: 25px;
  18. }
  19. .box.hover {
  20. -moz-box-shadow:0px 0px 3px rgba(0, 0, 0, 0.2);
  21. -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
  22. box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
  23. -webkit-transition: all 1s ease;
  24. -moz-transition: all 1s ease;
  25. -ms-transition: all 1s ease;
  26. -o-transition: all 1s ease;
  27. transition: all 1s ease;
  28. }
  29. .box.plain.hover {box-shadow: none;}
  30. .box .title {
  31. height:auto;
  32. background: url(img/2.png) repeat;
  33. position: relative;
  34. border:1px solid #c4c4c4;
  35. border-top-left-radius: 2px;
  36. border-top-right-radius: 2px;
  37. -moz-box-shadow:0 1px 0px rgba(255, 255, 255, 1);
  38. -webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 1);
  39. box-shadow: 0 1px 0px rgba(255, 255, 255, 1);
  40. }
  41. .box.plain .title {
  42. border-top: none;
  43. border-left: none;
  44. border-right: none;
  45. background: none;
  46. }
  47. .box.gradient .title {
  48. background: rgb(255,255,255);
  49. background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmM2YzZjMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  50. background: -moz-linear-gradient(top, rgba(255,255,255,1) 1%, rgba(243,243,243,1) 100%);
  51. background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(255,255,255,1)), color-stop(100%,rgba(243,243,243,1)));
  52. background: -webkit-linear-gradient(top, rgba(255,255,255,1) 1%,rgba(243,243,243,1) 100%);
  53. background: -o-linear-gradient(top, rgba(255,255,255,1) 1%,rgba(243,243,243,1) 100%);
  54. background: -ms-linear-gradient(top, rgba(255,255,255,1) 1%,rgba(243,243,243,1) 100%);
  55. background: linear-gradient(top, rgba(255,255,255,1) 1%,rgba(243,243,243,1) 100%);
  56. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f3f3',GradientType=0 );
  57. }
  58. .box .title.min {
  59. border-bottom-left-radius: 2px;
  60. border-bottom-right-radius: 2px;
  61. }
  62. .box .title h4 {
  63. padding-left:15px;
  64. margin-bottom: 0;
  65. padding-top: 9px;
  66. padding-bottom: 9px;
  67. }
  68. h4 .label {float: right; margin-right: 40px;}
  69. h4 .badge {float: right; margin-right: 40px;}
  70. .box .title span[class*=" icon-"], .box .title span[class*=" brocco-icon-"], .box .title span[class*=" cut-icon-"],
  71. .box .title span[class*=" entypo-icon-"], .box .title span[class*=" icomoon-icon-"], .box .title span[class*=" minia-icon-"],
  72. .box .title span[class*=" iconic-icon-"], .box .title span[class*=" meteo-icon-"], .box .title span[class*=" silk-icon-"],
  73. .box .title span[class*=" typ-icon-"], .box .title span[class*=" wpzoom-"], .box .title span[class*=" eco-"]
  74. {
  75. margin: 0 10px 0 0px;
  76. }
  77. .box .title .loader {
  78. position: absolute;
  79. right:40px;
  80. top:10px;
  81. }
  82. .box .title>a {
  83. position: absolute;
  84. right:10px;
  85. top:8px;
  86. border: 1px solid #c4c4c4;
  87. border-radius:2px;
  88. -webkit-border-radius:2px;
  89. -moz-border-radius:2px;
  90. text-decoration:none;
  91. color: #3f3f3f;
  92. /*padding: 2px 4px 0px 4px;*/
  93. text-indent: -9999px;
  94. background-color: #f3f3f3;
  95. width:16px;
  96. height:16px;
  97. padding:0px 2px 3px 2px;
  98. }
  99. .box .spark {
  100. margin-right: 40px;
  101. float: right;
  102. }
  103. .box .box-form {
  104. margin-right: 40px;
  105. margin-bottom: 0;
  106. position: relative;
  107. }
  108. .box .box-form input {
  109. width: 100%;
  110. margin-bottom: 0;
  111. }
  112. .box .box-form .dropdown-menu {top:auto; left:auto;}
  113. .box .box-form .btn-mini.dropdown-toggle {margin-top:-1px;}
  114. .box .box-form .btn span {margin-right: 0; margin-top: -8px; display: inline-block;}
  115. .box .box-form .btn-mini span {margin-top: 0;}
  116. .box .box-form .dropdown-toggle {margin-top: -4px; padding-bottom: 0;}
  117. .box .box-form .btn span.caret {margin-left: 2px; margin-top:7px;}
  118. .box .box-form .ibutton-container { margin-top:-2px;}
  119. .box .title .label span, .box .title .badge span {margin-left:0; margin-right:0}
  120. .box .title .progress {
  121. width:40%;
  122. position: absolute;
  123. right:40px;
  124. top:8px;
  125. }
  126. .box .title .minimize {
  127. cursor:pointer;
  128. background: url(img/minus.png) no-repeat center 3px #f3f3f3;
  129. display: none;
  130. }
  131. .box .title .maximize {
  132. background: url(img/plus.png) no-repeat center 3px #f3f3f3;
  133. display: block;
  134. }
  135. .box .content {
  136. padding:10px;
  137. border:1px solid #c4c4c4;
  138. border-bottom-left-radius: 2px;
  139. border-bottom-right-radius: 2px;
  140. border-top: none;
  141. background-color: #fff;
  142. position: relative;
  143. }
  144. .box .content.vertical-scroll {
  145. width: 200px;
  146. }
  147. .box .content.noPad {
  148. padding: 0;
  149. }
  150. .box .content.noPad .nav-tabs {
  151. margin-top: -1px;
  152. margin-left: -1px;
  153. margin-right: -1px;
  154. }
  155. .box .content.noPad .tab-content {
  156. margin-bottom: -1px;
  157. margin-left: -1px;
  158. margin-right: -1px;
  159. }
  160. .box.boxMargin {margin-bottom: 27px;}