main.css 51 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148
  1. :root {
  2. --black: #22292f;
  3. --white: #fff;
  4. --white-50: hsla(0,0%,100%,.5);
  5. --danger: #ff5b5b;
  6. --danger-dark: #bd4147;
  7. --success: #21b978;
  8. --warning: #ffcc80;/*#FFBD4A #ffc107;*/
  9. --info: #03a9f4;
  10. --primary: #4199de;
  11. --custom: #59a9f8;
  12. --blue: #007ee5;
  13. --tear: #26A69A;
  14. --inverse: #505b6b;
  15. --purple: #5b69bc;
  16. --purple-dark: #5b69bc;
  17. --orange-light: #ffcc80;
  18. --orange: #F99037;
  19. --pink: #ff8acc;
  20. --primary-dark: #297ec0;
  21. --primary-light: #e8f5fb;
  22. --primary-90: #52a2e1;/*rgba(64,153,222,.9);*/
  23. --primary-80: #62abe4;
  24. --primary-70: #73b4e7;
  25. --primary-60: #84bdea;
  26. --primary-50: #95c6ed;
  27. --primary-40: #c7e1f5;/* #a5cfef*/
  28. --primary-30: #d7eaf8;
  29. --primary-20: #e8f3fb;
  30. --primary-10: #f9fcfe;
  31. --20: #f6fbff;
  32. --30: #f4f7fa;
  33. --40: #ebf0f3;
  34. --50: #d3dde5;
  35. --60: #bacad6;
  36. --70: #b3b9bf;
  37. --80: #7c858e;
  38. --90: #252d37;
  39. --90-half: #5c7089;
  40. }
  41. html, body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, kbd, pre, samp, .tooltip, .popover, .main-header .logo {
  42. font-family: Nunito,system-ui,BlinkMacSystemFont,-apple-system,sans-serif;
  43. color: #414750;
  44. /*color:#525252;*/
  45. }
  46. .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  47. padding-right: 10px;
  48. padding-left: 10px;
  49. }
  50. .content-header {
  51. padding: 15px 15px 0;
  52. }
  53. .row {
  54. margin-right: -10px;
  55. margin-left: -10px;
  56. }
  57. .m-b-30 {
  58. margin-bottom: 30px!important;
  59. }
  60. .m-b-25 {
  61. margin-bottom: 25px!important;
  62. }
  63. .m-b-15 {
  64. margin-bottom: 15px!important;
  65. }
  66. .m-b-10 {
  67. margin-bottom: 10px!important;
  68. }
  69. .m-t-0 {
  70. margin-top: 0!important;
  71. }
  72. .m-t-20 {
  73. margin-top: 20px!important;
  74. }
  75. .m-t-15 {
  76. margin-top: 15px!important;
  77. }
  78. .m-t-10 {
  79. margin-top: 10px!important;
  80. }
  81. .m-b-0 {
  82. margin-bottom: 0!important;
  83. }
  84. .m-r-0 {
  85. margin-right: 0!important;
  86. }
  87. .m-l-0 {
  88. margin-left: 0!important;
  89. }
  90. a {
  91. color: var(--primary-dark)
  92. }
  93. #app {
  94. padding: 12px 12px 5px;
  95. }
  96. .font-12 {
  97. font-size:12px;
  98. }
  99. .font-13 {
  100. font-size:13px;
  101. }
  102. .font-14 {
  103. font-size:14px;
  104. }
  105. .font-16 {
  106. font-size:16px;
  107. }
  108. .font-20 {
  109. font-size:20px;
  110. }
  111. .bold {
  112. font-weight:bold;
  113. }
  114. .text-dark{
  115. color:#333;
  116. }
  117. .text-white {
  118. color:#fff;
  119. }
  120. .text-80 {
  121. color: var(--80)
  122. }
  123. .text-70 {
  124. color: var(--70)
  125. }
  126. .text-60 {
  127. color: var(--60)
  128. }
  129. .text-50 {
  130. color: var(--50)
  131. }
  132. .text-success{
  133. color:var(--success);
  134. }
  135. .text-primary{
  136. color:var(--primary);
  137. }
  138. .text-info{
  139. color:var(--info);
  140. }
  141. .text-warning{
  142. color:var(--warning);
  143. }
  144. .text-danger{
  145. color:var(--danger);
  146. }
  147. .text-custom{
  148. color:var(--custom);
  149. }
  150. .text-purple{
  151. color:var(--purple-dark);
  152. }
  153. .blue {
  154. color: var(--primary) !important
  155. }
  156. .green {
  157. color: var(--success) !important
  158. }
  159. .red {
  160. color: var(--danger) !important
  161. }
  162. .red-dark {
  163. color:var(--danger-dark)
  164. }
  165. /*main-header*/
  166. /*.main-header .logo {*/
  167. /*height:60px;*/
  168. /*line-height:60px;*/
  169. /*}*/
  170. /*.main-header>.navbar {*/
  171. /*height:60px;*/
  172. /*}*/
  173. /*.main-header .sidebar-toggle {*/
  174. /*padding: 20px 15px;*/
  175. /*}*/
  176. /*.main-sidebar, .left-side {*/
  177. /*padding-top:60px;*/
  178. /*}*/
  179. /*.control-sidebar {*/
  180. /*padding-top:60px;*/
  181. /*}*/
  182. /*@media (min-width: 768px) {*/
  183. /*.navbar-custom-menu .navbar-nav>li>a {*/
  184. /*padding-top: 20px;*/
  185. /*padding-bottom: 20px;*/
  186. /*}*/
  187. /*.sidebar-mini.sidebar-collapse .main-sidebar {*/
  188. /*width: 60px !important;*/
  189. /*}*/
  190. /*.sidebar-mini.sidebar-collapse .main-header .logo {*/
  191. /*width: 60px;*/
  192. /*}*/
  193. /*.sidebar-mini.sidebar-collapse .main-header .navbar {*/
  194. /*margin-left: 60px;*/
  195. /*}*/
  196. /*}*/
  197. /*.sidebar-mini.sidebar-collapse .sidebar-menu>li>a {*/
  198. /*padding: 12px 5px 12px 18px;*/
  199. /*}*/
  200. /*.fixed .content-wrapper, .fixed .right-side {*/
  201. /*padding-top: 60px;*/
  202. /*}*/
  203. /*main-header*/
  204. .main-footer {
  205. background:#ecf0f5;
  206. border-top:0;
  207. }
  208. input.content {
  209. min-height: 0;
  210. padding: 6px 12px;
  211. margin: 0
  212. }
  213. input.label:empty {
  214. display: inherit
  215. }
  216. input.label {
  217. display: inherit;
  218. padding: 6px 12px;
  219. font-size: 14px;
  220. font-weight: inherit;
  221. line-height: 1.42857143;
  222. color: #555;
  223. text-align: inherit;
  224. white-space: inherit;
  225. vertical-align: inherit;
  226. border-radius: inherit
  227. }
  228. .pin, .pin-y {
  229. top: 0;
  230. bottom: 0;
  231. }
  232. .pin {
  233. right: 0;
  234. left: 0;
  235. }
  236. .justify-center {
  237. -webkit-box-pack: center;
  238. -ms-flex-pack: center;
  239. justify-content: center;
  240. }
  241. .items-center {
  242. -webkit-box-align: center;
  243. -ms-flex-align: center;
  244. align-items: center;
  245. }
  246. .flex {
  247. display: -webkit-box;
  248. display: -ms-flexbox;
  249. display: flex;
  250. }
  251. .content-header>h1 {
  252. font-size: 22px;
  253. font-weight: 400;
  254. margin-top: 10px;
  255. }
  256. .box-show {
  257. border-radius: 0;
  258. box-shadow: none;
  259. }
  260. .content-header>h1>small {
  261. font-size:14px;
  262. }
  263. .btn-group-lg > .btn, .btn-lg {
  264. padding: 10px 16px !important;
  265. font-size: 16px
  266. }
  267. .btn-group-xs > .btn, .btn-xs {
  268. padding: 3px 5px;
  269. font-size: 12px;
  270. border-radius: 2px
  271. }
  272. .btn-group .btn + .btn, .btn-group .btn + .btn-group, .btn-group .btn-group + .btn, .btn-group .btn-group + .btn-group {
  273. margin-left: 0
  274. }
  275. .btn-group.open .dropdown-toggle {
  276. box-shadow: 0 0 0 100px transparent inset
  277. }
  278. .btn-custom, .btn-danger, .btn-info, .btn-inverse, .btn-pink, .btn-primary, .btn-purple, .btn-success, .btn-tear, .btn-warning {
  279. color: #fff !important
  280. }
  281. .btn-custom {
  282. background-color: var(--custom);
  283. border-color: var(--custom);
  284. }
  285. .amber, .btn-amber {
  286. background-color: #fff8e1 !important;
  287. color:#333;
  288. }
  289. .btn-default {
  290. background-color: #fff;
  291. border-color: #fff;
  292. /*text-shadow: 0 1px 2px rgba(0, 0, 0, .15);*/
  293. }
  294. .btn-instagram,.btn-instagram:hover {
  295. border-color:transparent;
  296. }
  297. .btn-default {
  298. background-color: #fff !important;
  299. border-color: #fff !important;
  300. /*box-shadow: 1px 1px 4px 1px rgba(0, 0, 0, .22) !important*/
  301. }
  302. .btn-light {
  303. background-color:rgba(218, 230, 236, .5)!important;
  304. border-color:rgba(218, 230, 236,.1);
  305. color:#444;
  306. box-shadow:none!important;
  307. }
  308. .btn-light.btn-circle {
  309. background-color:transparent!important;
  310. }
  311. .btn-light.active, .btn-light.focus, .btn-light:active, .btn-light:focus, .btn-light:hover, .open > .dropdown-toggle.btn-light {
  312. background-color:rgba(218, 230, 236, .8)!important;
  313. border-color:rgba(218, 230, 236,.1);
  314. }
  315. .btn-default.active, .btn-default.focus, .btn-default:active, .btn-default:focus, .btn-default:hover, .open > .dropdown-toggle.btn-default {
  316. border-color: rgba(218, 230, 236, .1);
  317. background-color: rgba(218, 230, 236, .5)!important;
  318. }
  319. .btn-primary {
  320. background-color: var(--primary) !important;
  321. border-color: var(--primary) !important
  322. }
  323. .btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open > .dropdown-toggle.btn-primary {
  324. opacity:.9;
  325. background-color: var(--primary) !important;
  326. border-color: var(--primary) !important
  327. }
  328. .btn-success {
  329. background-color: var(--success) !important;
  330. border-color: var(--success) !important
  331. }
  332. .btn-success.active, .btn-success.focus, .btn-success:active, .btn-success:focus, .btn-success:hover, .open > .dropdown-toggle.btn-success {
  333. opacity: .9
  334. }
  335. .btn-blue {
  336. background-color: var(--blue) !important;
  337. border-color: var(--blue) !important;
  338. color:#fff
  339. }
  340. .btn-blue.active, .btn-blue.focus, .btn-blue:active, .btn-blue:focus, .btn-blue:hover, .open > .dropdown-toggle.btn-blue {
  341. opacity: .9;
  342. color:#fff
  343. }
  344. .btn-info {
  345. background-color: var(--info) !important;
  346. border-color: var(--info) !important
  347. }
  348. .btn-info.active, .btn-info.focus, .btn-info:active, .btn-info:focus, .btn-info:hover, .open > .dropdown-toggle.btn-info {
  349. opacity: .9
  350. }
  351. .btn-warning {
  352. background-color: var(--warning) !important;
  353. border-color: var(--warning) !important
  354. }
  355. .btn-warning.active, .btn-warning.focus, .btn-warning:active, .btn-warning:focus, .btn-warning:hover, .open > .dropdown-toggle.btn-warning {
  356. opacity:0.9;
  357. }
  358. .btn-danger {
  359. background-color: var(--danger) !important;
  360. border-color: var(--danger) !important
  361. }
  362. .btn-danger.active, .btn-danger.focus, .btn-danger:active, .btn-danger:focus, .btn-danger:hover, .open > .dropdown-toggle.btn-danger {
  363. background-color: var(--danger) !important;
  364. opacity: .9
  365. }
  366. .btn-tear {
  367. background-color: var(--tear)
  368. }
  369. .btn-inverse {
  370. background-color: var(--inverse)
  371. }
  372. .btn-purple {
  373. background-color: var(--purple) !important
  374. }
  375. .btn-pink {
  376. background-color: var(--pink)
  377. }
  378. .btn-rounded {
  379. border-radius: 2em;
  380. padding: 6px 18px
  381. }
  382. .btn.btn-trans {
  383. background-color: transparent !important;
  384. border-color: transparent !important;
  385. box-shadow:none!important;
  386. }
  387. .btn.btn-trans:hover,.btn.btn-trans:focus {
  388. background-color:var(--40)!important;
  389. }
  390. .btn-trans.btn-default {
  391. color:#333;
  392. }
  393. .btn-trans.btn-primary {
  394. /*background-color: rgba(24, 138, 226, .15) !important;*/
  395. /*color: #1867c0 !important;*/
  396. color: var(--primary-dark)!important;
  397. }
  398. .btn-trans.btn-custom {
  399. color: var(--custom)!important;
  400. }
  401. .btn-trans.btn-blue {
  402. color: var(--blue)!important;
  403. }
  404. .btn-trans.btn-success {
  405. /*background-color: rgba(16, 196, 105, .15) !important;*/
  406. color: var(--success) !important;
  407. /*border-color: transparent !important*/
  408. }
  409. .btn-trans.btn-info {
  410. /*background-color: rgba(53, 184, 224, .15) !important;*/
  411. color: #35b8e0 !important;
  412. /*border-color: transparent !important*/
  413. }
  414. .btn-trans.btn-warning {
  415. /*background-color: rgba(249, 200, 81, .15) !important;*/
  416. color: var(--orange) !important;
  417. /*border-color: transparent !important*/
  418. }
  419. .btn-trans.btn-danger {
  420. /*background-color: rgba(255, 91, 91, .15) !important;*/
  421. color: var(--danger) !important;
  422. /*border-color: transparent !important*/
  423. }
  424. .btn-trans.btn-purple {
  425. /*background-color: rgba(91, 105, 188, .15) !important;*/
  426. color: var(--purple) !important;
  427. /*border-color: transparent !important*/
  428. }
  429. .btn-trans.btn-pink {
  430. /*background-color: rgba(255, 138, 204, .15) !important;*/
  431. color: var(--pink) !important;
  432. /*border-color: transparent !important*/
  433. }
  434. .btn-trans.btn-blue {
  435. /*background-color: rgba(255, 138, 204, .15) !important;*/
  436. color: var(--blue) !important;
  437. /*border-color: transparent !important*/
  438. }
  439. /*.fileupload input.upload {*/
  440. /* cursor: pointer;*/
  441. /* filter: alpha(opacity=0);*/
  442. /* font-size: 20px;*/
  443. /* margin: 0;*/
  444. /* opacity: 0;*/
  445. /* padding: 0;*/
  446. /* position: absolute;*/
  447. /* right: 0;*/
  448. /* top: 0*/
  449. /*}*/
  450. .btn-dropbox {
  451. color: #fff !important;
  452. background-color: var(--primary) !important;
  453. border-color: var(--primary) !important
  454. }
  455. .btn.active, .btn.focus, .btn:active, .btn:focus, .btn:hover, .open > .dropdown-toggle.btn {
  456. opacity: .9
  457. }
  458. .btn.btn-box-tool {
  459. box-shadow: none !important
  460. }
  461. .checkbox {
  462. padding-left: 20px
  463. }
  464. .card-tabs .nav-pills li a {
  465. padding: 8px 14px;
  466. font-size: 13px;
  467. background-color: transparent !important;
  468. font-weight: 500;
  469. color: #435966 !important
  470. }
  471. .card-tabs .tab-content {
  472. padding: 0;
  473. border: 0
  474. }
  475. .panel-disabled {
  476. background: rgba(243, 242, 241, .5);
  477. left: 0;
  478. cursor: wait;
  479. position: absolute;
  480. right: -5px;
  481. top: 0;
  482. bottom: 0;
  483. z-index: 999
  484. }
  485. .panel-group .panel {
  486. border-radius:1px;
  487. border: 0;
  488. cursor: pointer
  489. }
  490. .panel-default>.panel-heading {
  491. background-color: #f3f3f3;
  492. }
  493. .panel-default>.panel-heading+.panel-collapse>.panel-body {
  494. border:1px solid #eee;
  495. border-top-color:#fff;
  496. }
  497. .panel-white > .panel-heading + .panel-collapse > .panel-body {
  498. border-top-color:#eee
  499. }
  500. .panel-title {
  501. margin-top: 0;
  502. margin-bottom: 0;
  503. font-size: 16px;
  504. color: #666;
  505. }
  506. .panel-title a:hover, .panel-title a:hover, .panel-title a:active, .panel-title a:focus {
  507. color: #444;
  508. }
  509. .panel-group .panel .panel-heading a[data-toggle=collapse]:before {
  510. content: '\f056';
  511. display: block;
  512. float: right;
  513. font-family: 'FontAwesome';
  514. font-size: 14px;
  515. text-align: right;
  516. width: 25px;
  517. }
  518. .panel-group .panel .panel-heading a[data-toggle=collapse].collapsed:before {
  519. content: '\f055';
  520. }
  521. .panel-heading {
  522. padding:12px 26px;
  523. border-radius:1px;
  524. width:100%;
  525. }
  526. /*.panel-default > .panel-heading {*/
  527. /* border-top: 1px solid #ddd*/
  528. /*}*/
  529. .card-draggable-placeholder {
  530. border: 2px dashed rgba(67, 89, 102, .5);
  531. margin-bottom: 16px;
  532. background-color: rgba(67, 89, 102, .08)
  533. }
  534. .progress {
  535. background-color: #ebeff2;
  536. box-shadow: none !important;
  537. height: 10px;
  538. margin-bottom: 18px;
  539. overflow: hidden
  540. }
  541. .progress-bar {
  542. box-shadow: none;
  543. font-size: 8px;
  544. font-weight: 600;
  545. line-height: 12px
  546. }
  547. .progress.progress-sm {
  548. height: 5px !important
  549. }
  550. .progress.progress-sm .progress-bar {
  551. font-size: 8px;
  552. line-height: 5px
  553. }
  554. .progress.progress-md {
  555. height: 15px !important
  556. }
  557. .progress.progress-md .progress-bar {
  558. font-size: 10.8px;
  559. line-height: 14.4px
  560. }
  561. .progress.progress-lg {
  562. height: 20px !important
  563. }
  564. .progress.progress-lg .progress-bar {
  565. font-size: 12px;
  566. line-height: 20px
  567. }
  568. .progress-bar-primary {
  569. background-color: var(--primary)
  570. }
  571. .progress-bar-blue {
  572. background-color: var(--blue)
  573. }
  574. .progress-bar-success {
  575. background-color: var(--success)
  576. }
  577. .progress-bar-info {
  578. background-color: #35b8e0
  579. }
  580. .progress-bar-warning {
  581. background-color: var(--warning)
  582. }
  583. .progress-bar-danger {
  584. background-color: var(--danger)
  585. }
  586. .progress-bar-inverse {
  587. background-color: var(--inverse)
  588. }
  589. .progress-bar-purple {
  590. background-color: var(--purple-dark)
  591. }
  592. .progress-bar-pink {
  593. background-color: var(--pink)
  594. }
  595. .progress-bar-custom {
  596. background-color: var(--custom)
  597. }
  598. .progress-bar-custom-alt {
  599. background-color: rgba(113, 182, 249, .2)
  600. }
  601. .progress-bar-primary-alt {
  602. background-color: rgba(24, 138, 226, .2)
  603. }
  604. .progress-bar-success-alt {
  605. background-color: rgba(16, 196, 105, .2)
  606. }
  607. .progress-bar-info-alt {
  608. background-color: rgba(53, 184, 224, .2)
  609. }
  610. .progress-bar-warning-alt {
  611. background-color: rgba(249, 200, 81, .2)
  612. }
  613. .progress-bar-danger-alt {
  614. background-color: rgba(255, 91, 91, .2)
  615. }
  616. .progress-bar-purple-alt {
  617. background-color: rgba(91, 105, 188, .2)
  618. }
  619. .progress-bar-inverse-alt {
  620. background-color: rgba(59, 62, 71, .2)
  621. }
  622. .progress-bar-pink-alt {
  623. background-color: rgba(255, 138, 204, .2)
  624. }
  625. .progress-animated {
  626. -webkit-animation-duration: 5s;
  627. -webkit-animation-name: animationProgress;
  628. -webkit-transition: 5s all;
  629. animation-duration: 5s;
  630. animation-name: animationProgress;
  631. transition: 5s all
  632. }
  633. .progress-vertical {
  634. min-height: 250px;
  635. height: 250px;
  636. width: 10px;
  637. position: relative;
  638. display: inline-block;
  639. margin-bottom: 0;
  640. margin-right: 20px
  641. }
  642. .progress-vertical .progress-bar {
  643. width: 100%
  644. }
  645. .progress-vertical-bottom {
  646. min-height: 250px;
  647. height: 250px;
  648. position: relative;
  649. width: 10px;
  650. display: inline-block;
  651. margin-bottom: 0;
  652. margin-right: 20px
  653. }
  654. .progress-vertical-bottom .progress-bar {
  655. width: 100%;
  656. position: absolute;
  657. bottom: 0
  658. }
  659. .progress-vertical-bottom.progress-sm, .progress-vertical.progress-sm {
  660. width: 5px !important
  661. }
  662. .progress-vertical-bottom.progress-sm .progress-bar, .progress-vertical.progress-sm .progress-bar {
  663. font-size: 8px;
  664. line-height: 5px
  665. }
  666. .progress-vertical-bottom.progress-md, .progress-vertical.progress-md {
  667. width: 15px !important
  668. }
  669. .progress-vertical-bottom.progress-md .progress-bar, .progress-vertical.progress-md .progress-bar {
  670. font-size: 10.8px;
  671. line-height: 14.4px
  672. }
  673. .progress-vertical-bottom.progress-lg, .progress-vertical.progress-lg {
  674. width: 20px !important
  675. }
  676. .progress-vertical-bottom.progress-lg .progress-bar, .progress-vertical.progress-lg .progress-bar {
  677. font-size: 12px;
  678. line-height: 20px
  679. }
  680. /*.table .sortable {*/
  681. /*color: var(--70)*/
  682. /*}*/
  683. /*.table .sortable:before {*/
  684. /*right: -5px;*/
  685. /*top: -5px;*/
  686. /*content: "\f106";*/
  687. /*font: 800 normal normal 15px/1 FontAwesome;*/
  688. /*position: relative;*/
  689. /*}*/
  690. /*.table .sortable:after {*/
  691. /*right: 5px;*/
  692. /*top: 3px;*/
  693. /*content: "\f107";*/
  694. /*font: 800 normal normal 15px/1 FontAwesome;*/
  695. /*position: relative;*/
  696. /*}*/
  697. /*.table-bordered.table .sortable:before {*/
  698. /*right: -4.3px;*/
  699. /*}*/
  700. /*.table .sortable.up:before {*/
  701. /*color: #555*/
  702. /*}*/
  703. /*.table .sortable.down:after {*/
  704. /*color: #555*/
  705. /*}*/
  706. .table {
  707. margin-bottom: 0
  708. }
  709. .table-hover > tbody > tr:hover, .table-striped > tbody > tr:nth-of-type(odd), .table > tbody > tr.active > td, .table > tbody > tr.active > th, .table > tbody > tr > td.active, .table > tbody > tr > th.active, .table > tfoot > tr.active > td, .table > tfoot > tr.active > th, .table > tfoot > tr > td.active, .table > tfoot > tr > th.active, .table > thead > tr.active > td, .table > thead > tr.active > th, .table > thead > tr > td.active, .table > thead > tr > th.active {
  710. background-color: #f4f8fb !important
  711. }
  712. .table-bordered, .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
  713. border-top: 1px solid #f4f4f4;
  714. vertical-align: middle;
  715. }
  716. .table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
  717. border: 1px solid var(--40)
  718. }
  719. .table>tbody>tr>td {
  720. height:53px;
  721. }
  722. .table > thead > tr > th {
  723. color: #555;
  724. }
  725. .table-header-default.table>thead>tr>th,.table-header-gray.table>thead>tr>th {
  726. border-bottom: 1px solid #e3e7eb;
  727. text-transform: capitalize;
  728. font-weight: bold;
  729. font-size: 13px;
  730. padding: .75rem 8px;
  731. letter-spacing: .05em;
  732. }
  733. .table-header-default.table>thead>tr>th {
  734. border-bottom: 2px solid #f4f4f4;
  735. }
  736. .table>thead:first-child>tr:first-child>th:first-child {
  737. padding-left: 18px;
  738. }
  739. .table td:first-child {
  740. padding-left: 18px;
  741. }
  742. .table .checkbox {
  743. padding-left:15px;
  744. }
  745. .table-header-default.table:not(.table-striped) thead tr {
  746. border-top: 1px solid #f4f4f4;
  747. }
  748. .table-header-gray.table:not(.table-striped) thead tr {
  749. border-top: 1px solid #e3e7eb;
  750. background:var(--30);
  751. }
  752. .table-header-gray.table>thead>tr>th {
  753. color:var(--80);
  754. font-weight:bold;
  755. }
  756. .table.table-bordered thead tr {
  757. background: transparent;
  758. }
  759. .table-bordered.table > thead > tr > th {
  760. vertical-align: bottom !important;
  761. /*color:var(--90-half);*/
  762. /*font-weight:bold;*/
  763. color:#555;
  764. }
  765. td {
  766. font-size: 13px
  767. }
  768. .table-bordered {
  769. border: 1px solid #ebeff2 !important
  770. }
  771. table.focus-on tbody tr.focused th {
  772. background-color: #71b6f9 !important;
  773. color: #fff
  774. }
  775. table.focus-on tbody tr.focused td {
  776. background-color: #71b6f9;
  777. color: #fff
  778. }
  779. .table-rep-plugin .table-responsive {
  780. border: none !important
  781. }
  782. .table-rep-plugin tbody th {
  783. font-size: 14px;
  784. font-weight: 400
  785. }
  786. .table-rep-plugin .checkbox-row {
  787. padding-left: 40px
  788. }
  789. .table-rep-plugin .checkbox-row label {
  790. display: inline-block;
  791. padding-left: 5px;
  792. position: relative
  793. }
  794. .table.table-no-top-border >tbody>tr:first-child>td {
  795. border-top:0;
  796. }
  797. .table.table-left-border >tbody>tr>td,.table.table-left-border-nofirst >tbody>tr>td{
  798. border-left:1px solid #ebeff2;
  799. }
  800. .table.table-left-border-nofirst >tbody>tr>td:first-child{
  801. border-left:0;
  802. }
  803. .table.table-no-tr-padding >tbody>tr>td {
  804. padding-top:0;
  805. padding-bottom:0;
  806. }
  807. fieldset {
  808. margin: 0;
  809. border: 1px solid #e6e6e6;
  810. padding: 8px;
  811. }
  812. fieldset legend {
  813. color: #666;
  814. padding: 0 10px;
  815. font-size: 14px;
  816. width:auto;
  817. border:0;
  818. margin:0;
  819. }
  820. code {
  821. /*color: var(--primary);*/
  822. /*background-color: #f0f2f1;*/
  823. color: #188ae2;
  824. background-color: #f4f8fb;
  825. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125);
  826. padding: 2px 5px;
  827. }
  828. /*.inbox-widget .inbox-item {*/
  829. /*border-bottom: 1px solid #f3f3f3;*/
  830. /*overflow: hidden;*/
  831. /*padding: 10px 0;*/
  832. /*position: relative*/
  833. /*}*/
  834. /*.inbox-widget .inbox-item .inbox-item-img {*/
  835. /*display: block;*/
  836. /*float: left;*/
  837. /*margin-right: 15px;*/
  838. /*width: 40px*/
  839. /*}*/
  840. /*.inbox-widget .inbox-item img {*/
  841. /*width: 40px*/
  842. /*}*/
  843. /*.inbox-widget .inbox-item .inbox-item-author {*/
  844. /*color: #333;*/
  845. /*display: block;*/
  846. /*margin: 0*/
  847. /*}*/
  848. /*.inbox-widget .inbox-item .inbox-item-text {*/
  849. /*color: #98a6ad;*/
  850. /*display: block;*/
  851. /*font-size: 12px;*/
  852. /*margin: 0*/
  853. /*}*/
  854. /*.inbox-widget .inbox-item .inbox-item-date {*/
  855. /*color: #98a6ad;*/
  856. /*font-size: 11px;*/
  857. /*position: absolute;*/
  858. /*right: 7px;*/
  859. /*top: 2px*/
  860. /*}*/
  861. .pagination {
  862. margin: 10px 0;
  863. border-radius: 1px
  864. }
  865. .btn-group-sm > .btn, .btn-sm {
  866. border-radius: 1px
  867. }
  868. .btn {
  869. will-change: box-shadow !important;
  870. box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .1), 0 2px 2px 0 rgba(0, 0, 0, .1), 0 1px 5px 1px rgba(0,0,0, .1);
  871. border-radius: 1px;
  872. border:1px solid transparent;
  873. }
  874. .btn-circle {
  875. border-radius: 100%;
  876. width: 40px;
  877. height: 40px;
  878. padding: 10px;
  879. box-shadow:0 3px 1px -2px rgba(0,0,0,0.2), 0 2px 2px 0px rgba(0,0,0,0.14), 0 1px 5px 0px rgba(0,0,0,0.12);
  880. }
  881. .btn-lg.btn-circle {
  882. width: 50px;
  883. height: 50px;
  884. padding:14px 15px!important;
  885. font-size:18px;
  886. }
  887. .btn-sm.btn-circle {
  888. width: 32px;
  889. height: 32px;
  890. padding:7px!important;
  891. }
  892. .btn.disabled, .btn[disabled], fieldset[disabled] .btn {
  893. box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .1), 0 2px 2px 0 rgba(0, 0, 0, .1), 0 1px 5px 1px rgba(0,0,0, .1);
  894. -webkit-box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .1), 0 2px 2px 0 rgba(0, 0, 0, .1), 0 1px 5px 1px rgba(0,0,0, .1);
  895. }
  896. .btn-group {
  897. will-change: box-shadow !important;
  898. box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .1), 0 2px 2px 0 rgba(0, 0, 0, .1), 0 1px 5px 1px rgba(0, 0, 0, .1);
  899. }
  900. .input-group-btn .btn {
  901. box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .09), 0 2px 2px 0 rgba(0, 0, 0, .09), 0 1px 5px 0 rgba(0, 0, 0, .09);
  902. }
  903. .input-group-btn .btn-default {
  904. border-color: #ddd !important;
  905. box-shadow:none;
  906. }
  907. .input-group-btn .btn-default:focus{
  908. background:var(--50)!important;
  909. }
  910. .btn-group .btn {
  911. box-shadow: none !important;
  912. border-radius: 0;
  913. }
  914. .box, .panel {
  915. transition: .3s cubic-bezier(.25, .8, .5, 1);
  916. }
  917. .box {
  918. border-top:2px solid transparent;
  919. box-shadow:0 2px 4px 0 rgba(0, 0, 0, .05);
  920. }
  921. /*.box.box-default {*/
  922. /* border-top:1px solid var(--60);*/
  923. /*}*/
  924. .box.box-primary {
  925. border-top-color: var(--primary-70)
  926. }
  927. .box.box-danger {
  928. border-top-color: var(--danger)
  929. }
  930. .box.box-success {
  931. border-top-color: var(--success)
  932. }
  933. .box.box-info {
  934. border-top-color:var(--info)
  935. }
  936. .box-header .box-title {
  937. font-size: 15px;
  938. }
  939. .box.box-warning {
  940. border-color:var(--warning);
  941. }
  942. .box.box-solid.box-primary {
  943. border: 0;
  944. border-top: 1px solid var(--primary)
  945. }
  946. .box.box-solid.box-primary > .box-header {
  947. background-color: var(--primary)
  948. }
  949. .box-footer{
  950. background:transparent;
  951. }
  952. .box.box-solid.box-success {
  953. border: 0;
  954. border-top:1px solid var(--success)
  955. }
  956. .box.box-solid.box-success > .box-header {
  957. background-color: var(--success)
  958. }
  959. .card-box {
  960. padding: 20px;
  961. box-shadow: 0 0 8px 0 rgba(0, 0, 0, .06), 0 1px 0 0 rgba(0, 0, 0, .02);
  962. border-radius: 1px;
  963. background-clip: padding-box;
  964. margin-bottom: 20px;
  965. background-color: #fff
  966. }
  967. .card-box .card-drop {
  968. color: #98a6ad;
  969. font-size: 20px;
  970. line-height: 1px;
  971. padding: 0 5px;
  972. display: inline-block
  973. }
  974. .grid-structure .grid-container {
  975. background-color: #f4f8fb;
  976. margin-bottom: 10px;
  977. padding: 10px 20px
  978. }
  979. .card-box-line {
  980. border-bottom: 1px solid #dbddde;
  981. margin-top: 13px
  982. }
  983. .card-box-title {
  984. font-size: 1.1em;
  985. color: #333
  986. }
  987. .card .dropdown-menu {
  988. max-height: 720px
  989. }
  990. .card {
  991. background: #fff;
  992. margin-bottom: 15px;
  993. border-radius: 1px;
  994. box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .05);
  995. /*border: 1px solid rgba(0, 40, 100, 0.12);*/
  996. }
  997. /*.card .box-header {*/
  998. /*padding:12px 14px;*/
  999. /*}*/
  1000. .divider {
  1001. border-bottom: 1px solid #f0f0f0;
  1002. margin-top: 11px
  1003. }
  1004. .card, .card .card-header {
  1005. position: relative
  1006. }
  1007. .card .card-header {
  1008. border-bottom: 1px solid #f4f4f4
  1009. }
  1010. .card .card-header.black {
  1011. background: #f6f6f6;
  1012. border-bottom: 1px solid #e9e9e9
  1013. }
  1014. @media screen and (min-width: 768px) {
  1015. .card-header:not(.ch-alt) {
  1016. padding: 12px 14px;
  1017. }
  1018. }
  1019. .card-header:not(.ch-alt):not([class*=bgm-]) + .card-padding {
  1020. padding-top: 16px
  1021. }
  1022. .card-body {
  1023. display:block;
  1024. }
  1025. @media screen and (min-width: 768px) {
  1026. .card-body.card-padding {
  1027. padding: 10px 22px
  1028. }
  1029. }
  1030. @media screen and (max-width: 991px) {
  1031. .card .card-body.card-padding, .card-header:not(.ch-alt) {
  1032. padding: 10px 14px
  1033. }
  1034. }
  1035. .card-header .actions {
  1036. position: absolute;
  1037. right: 10px;
  1038. z-index: 2;
  1039. top: 15px
  1040. }
  1041. select.form-shadow {
  1042. box-shadow: 0 1px 2px 1px rgba(0, 0, 0, .21);
  1043. }
  1044. select.form-shadow {
  1045. background: #fff;
  1046. border-radius: 1px;
  1047. border: 0;
  1048. color: #444
  1049. }
  1050. .pagination > li > a, .pagination > li > span {
  1051. /*border-radius: 3px;*/
  1052. display: inline-flex;
  1053. justify-content: center;
  1054. align-items: center;
  1055. font-size: 14px;
  1056. background:#fff;
  1057. height: 34px;
  1058. min-width: 34px;
  1059. border:0;
  1060. margin: 0 .3rem 5px;
  1061. text-decoration: none;
  1062. transition: .3s cubic-bezier(0, 0, .2, 1);
  1063. border-radius:3rem!important;
  1064. /*border-radius:4px!important;*/
  1065. }
  1066. .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
  1067. /*color: #2e609c;*/
  1068. /*color:var(--primary-dark);*/
  1069. /*background-color:rgba(64,153,222,.2);*/
  1070. background-color:var(--primary-80);
  1071. box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .1), 1px 2px 2px 0 rgba(0, 0, 0, .1), 0 1px 3px 1px rgba(0, 0, 0, .1);
  1072. }
  1073. /*.pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover{*/
  1074. /* background:transparent;*/
  1075. /*}*/
  1076. .page-link .fa {
  1077. font-weight:800;
  1078. }
  1079. .dropdown-menu {
  1080. padding: 4px 0;
  1081. transition: all .3s ease;
  1082. -moz-transition: all .3s ease;
  1083. -webkit-transition: all .3s ease;
  1084. -o-transition: all .3s ease;
  1085. -ms-transition: all .3s ease;
  1086. box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
  1087. border: 1px solid rgba(152, 166, 173, .15);
  1088. border-radius: 2px
  1089. }
  1090. .dropdown-header{
  1091. font-size:13px;
  1092. padding:5px 20px;
  1093. }
  1094. .dropdown-menu > li > a {
  1095. color: #444;
  1096. padding:4px 20px;
  1097. }
  1098. .input-group-sm > .input-group-addon {
  1099. line-height: 1.2
  1100. }
  1101. .form-control:focus {
  1102. border-color: var(--primary-50);
  1103. }
  1104. input.form-control {
  1105. border-radius: 0 !important
  1106. }
  1107. .form-horizontal .form-group {
  1108. margin-right: -5px;
  1109. margin-left: -5px
  1110. }
  1111. .fields-group .control-label {
  1112. font-weight: normal;
  1113. text-transform: capitalize;
  1114. }
  1115. .select2-container .select2-selection--single {
  1116. height: 36px !important
  1117. }
  1118. .input-group-sm .select2-selection--multiple, .input-group-sm .select2-selection--single {
  1119. height: 30px !important;
  1120. min-height: 30px !important;
  1121. padding: 3px 10px !important;
  1122. font-size: 12px;
  1123. line-height: 1.5
  1124. }
  1125. .input-group-sm .select2-selection--multiple {
  1126. padding: 0 8px !important
  1127. }
  1128. .input-group-sm .permissions-clear-button {
  1129. margin-right:0!important;
  1130. }
  1131. .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single {
  1132. border-radius: 0 !important
  1133. }
  1134. .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single {
  1135. background-color: #fff;
  1136. border: 1px solid #e3e3e3 !important
  1137. }
  1138. .select2-dropdown {
  1139. overflow: hidden;
  1140. box-shadow: 0 2px 10px rgba(0, 0, 0, .23);
  1141. border: 0 !important;
  1142. border-radius: 0 !important
  1143. }
  1144. .select2-container--default .select2-search--dropdown .select2-search__field {
  1145. border: 1px solid #e3e3e3 !important
  1146. }
  1147. .select2-container--default .select2-results__option[aria-selected=true] {
  1148. background: rgba(218, 230, 236, .5) !important;
  1149. color: #333 !important
  1150. }
  1151. .select2-container--default .select2-results__option--highlighted[aria-selected] {
  1152. background: rgba(218, 230, 236, .8) !important;
  1153. color: #333 !important
  1154. }
  1155. .select2-results__option {
  1156. padding: 6px 15px !important;
  1157. color: #333 !important
  1158. }
  1159. .select2-container--default .select2-selection--multiple .select2-selection__choice {
  1160. background-color: var(--primary) !important;
  1161. border: 0 !important
  1162. }
  1163. .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  1164. color: #fff !important
  1165. }
  1166. .select2-container .select2-selection--multiple{
  1167. min-height: 34px!important;
  1168. }
  1169. .select2-selection--multiple .default-text{
  1170. margin: 6px 12px;
  1171. display: block;
  1172. }
  1173. .input-group-sm .select2-selection--multiple .default-text {
  1174. margin: 6px;
  1175. }
  1176. .filter-input .select2-container .select2-selection--multiple{
  1177. min-height: 30px!important;
  1178. }
  1179. pre.dump {
  1180. border-radius: 2px;
  1181. border: 0;
  1182. /*color: #eee;*/
  1183. box-shadow: 0 1px 3px 1px rgba(34, 25, 25, .17);
  1184. background: rgba(255, 255,213,0.3);
  1185. white-space:pre-wrap;
  1186. text-shadow: 0 1px 2px rgba(0, 0, 0, .15);
  1187. }
  1188. .form-row .control-label, .line .text {
  1189. margin: 0 0 9px;
  1190. text-transform: Capitalize
  1191. }
  1192. .form-row {
  1193. margin-bottom: 27px;
  1194. padding: 0 22px
  1195. }
  1196. .form-row:last-child {
  1197. margin-bottom: 15px
  1198. }
  1199. .form-row .input-group .form-control:not(textarea) {
  1200. border-left: 0;
  1201. border-top: 0;
  1202. border-right: 0;
  1203. padding: 7px 12px 7px 1px;
  1204. background: 0 0
  1205. }
  1206. .form-row .form-control[disabled], .form-row .form-control[readonly], .form-row fieldset[disabled] .form-control {
  1207. background-color: transparent
  1208. }
  1209. .form-row .input-group {
  1210. width: 100%
  1211. }
  1212. .show-field {
  1213. margin-bottom: 15px
  1214. }
  1215. .show-field .text {
  1216. font-weight:bold;
  1217. color: var(--80);
  1218. font-size:13px;
  1219. text-transform:capitalize;
  1220. }
  1221. .form-row .control-label:not([for=inputError]) {
  1222. font-weight: 500
  1223. }
  1224. .form-row .form-control:focus, .form-row .select2-container--open .select2-selection--multiple, .form-row .select2-container--open .select2-selection--single {
  1225. border-bottom: 2px solid #0072C6 !important
  1226. }
  1227. .form-row .select2-container--default .select2-selection--multiple, .form-row .select2-container--default .select2-selection--single {
  1228. border-left: 0 !important;
  1229. border-top: 0 !important;
  1230. border-right: 0 !important;
  1231. background: 0 0
  1232. }
  1233. .has-error .control-label {
  1234. color: #a94442 !important
  1235. }
  1236. .has-error .form-control {
  1237. box-shadow: none !important
  1238. }
  1239. .alert .btn {
  1240. margin-top: 10px
  1241. }
  1242. .alert h4 {
  1243. font-weight:normal;
  1244. }
  1245. .alert-primary {
  1246. background-color: #fff;
  1247. color: #333
  1248. }
  1249. .alert-success {
  1250. background-color: rgba(0, 166, 90, .7) !important
  1251. }
  1252. .alert-info {
  1253. background-color:var(--primary) !important;opacity: 0.9;
  1254. }
  1255. .label {
  1256. font-size:85%;
  1257. }
  1258. .bg-orange {
  1259. background-color:var(--orange-light);
  1260. }
  1261. .bg-white {
  1262. background-color:white;
  1263. }
  1264. .bg-20 {
  1265. background-color:var(--20);
  1266. }
  1267. .bg-30 {
  1268. background-color:var(--30);
  1269. }
  1270. .bg-40 {
  1271. background-color:var(--40);
  1272. }
  1273. .bg-50 {
  1274. background-color:var(--50);
  1275. }
  1276. .bg-primary-30 {
  1277. background-color:var(--primary-30);
  1278. }
  1279. .bg-primary-light {
  1280. background-color:var(--primary-light);
  1281. }
  1282. .bg-gray {
  1283. color:#333;
  1284. }
  1285. .bg-light-blue, .bg-primary, .label-primary {
  1286. background-color: var(--primary)!important
  1287. }
  1288. .bg-custom,.label-custom {
  1289. background-color: var(--custom)
  1290. }
  1291. .bg-aqua, .label-info {
  1292. background-color: var(--info) !important
  1293. }
  1294. .bg-green, .alert-success,.label-success{
  1295. background-color: var(--success)!important;
  1296. }
  1297. .bg-red, .alert-danger, .alert-error, .label-danger{
  1298. background-color: var(--danger)!important;
  1299. }
  1300. .bg-yellow, .label-warning {
  1301. background-color: var(--warning)!important;
  1302. }
  1303. .bg-blue, .label-blue {
  1304. background-color: var(--blue)!important;
  1305. }
  1306. .bg-purple, .label-purple {
  1307. background-color: var(--purple)!important;
  1308. }
  1309. .bg-inverse, .label-inverse {
  1310. background-color: var(--inverse)!important;
  1311. }
  1312. .bg-tear, .label-tear {
  1313. background-color: var(--tear)!important;
  1314. }
  1315. .alert {
  1316. border-radius: 1px;
  1317. border: 0;
  1318. -moz-box-shadow: 0 1px 3px 1px rgba(34, 25, 25, .17);
  1319. box-shadow: 0 1px 3px 1px rgba(34, 25, 25, .17) !important
  1320. }
  1321. .alert-warning {
  1322. background-color: rgba(255, 189, 74, .55) !important;
  1323. color: #8a6d3b !important
  1324. }
  1325. .alert-danger {
  1326. background-color: #e57373 !important
  1327. }
  1328. .layui-layer-border {
  1329. box-shadow: 0 2px 10px rgba(0, 0, 0, .2) !important
  1330. }
  1331. .bootstrap-duallistbox-container select option {
  1332. padding: 3px
  1333. }
  1334. .table-responsive {
  1335. border: 0 !important;
  1336. margin-bottom: 0!important;
  1337. }
  1338. .fixed-bottom-btn {
  1339. height: 45px;
  1340. position: fixed;
  1341. right: 18px;
  1342. bottom: 30px;
  1343. z-index: 999
  1344. }
  1345. .fixed-bottom-btn a {
  1346. border-radius: 50%;
  1347. cursor: pointer;
  1348. background: var(--primary);
  1349. display: none;
  1350. width: 45px;
  1351. height: 45px;
  1352. margin: .15rem 0;
  1353. text-align: center;
  1354. line-height: 46px;
  1355. box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .4);
  1356. position: relative;
  1357. font-size: 13px;
  1358. color: #fff;
  1359. }
  1360. .editormd-fullscreen {
  1361. z-index: 99999999
  1362. }
  1363. .nav>li>a:hover, .nav>li>a:active, .nav>li>a:focus {
  1364. background: var(--30)
  1365. }
  1366. .nav-pills>li+li {
  1367. margin-left: 0;
  1368. }
  1369. .nav-stacked>li.active>a, .nav-stacked>li.active>a:hover {
  1370. border-left:3px solid var(--60);
  1371. background:#fff!important;
  1372. color:#333!important;
  1373. }
  1374. .nav-tabs-default {
  1375. margin-bottom: 20px;
  1376. background: #fff;
  1377. border-radius: 1px;
  1378. box-shadow: none;
  1379. }
  1380. .nav-tabs-default>.nav-tabs {
  1381. margin: 0;
  1382. border-bottom:1px solid #f4f4f4;
  1383. }
  1384. .nav-tabs-default > .nav-tabs > li > a{
  1385. border:0;
  1386. color: var(--80);
  1387. font-weight:bold;
  1388. padding: 15px 20px;
  1389. }
  1390. .nav-tabs-default > .nav-tabs > li {
  1391. border-bottom: 3px solid transparent;
  1392. border-top:0;
  1393. }
  1394. .nav-tabs-default > .nav-tabs > li.active {
  1395. top:1px;
  1396. padding-bottom: 0;
  1397. border-bottom-color:var(--60);
  1398. }
  1399. .nav-tabs-default>.nav-tabs>li.active>a {
  1400. border-left:0;
  1401. border-right:0;
  1402. border-top:0!important;
  1403. color:#444;
  1404. }
  1405. .nav-tabs-default > .tab-content {
  1406. padding:10px;
  1407. }
  1408. .nav-tabs {
  1409. border-bottom:0;
  1410. }
  1411. .nav-tabs-custom > .nav-tabs > li > a, .nav-tabs-custom > .nav-tabs > li > a:hover {
  1412. color: var(--80)
  1413. }
  1414. .nav-tabs>li>a {
  1415. padding: 11px 18px 11px;
  1416. font-weight: bold;
  1417. }
  1418. .nav-tabs-custom {
  1419. box-shadow: none;
  1420. border-radius: 4px;
  1421. background: 0 0
  1422. }
  1423. .nav-tabs-custom > .nav-tabs > li:not(.active) > a, .nav-tabs-custom > .nav-tabs > li:not(.active) > a:hover {
  1424. border-top-color: #e1e1e1;
  1425. border-left-color: #e1e1e1;
  1426. border-right-color: #e1e1e1;
  1427. border-top-right-radius: 4px;
  1428. border-top-left-radius: 4px;
  1429. border-bottom-color: #e1e1e1;
  1430. margin-bottom: -20px;
  1431. z-index: 11;
  1432. background: #fff;
  1433. margin-top:4px
  1434. }
  1435. .nav-tabs-custom > .nav-tabs > li.active {
  1436. margin-bottom: -2px;
  1437. padding-bottom: 0;
  1438. border-bottom-color: #f4f4f4;
  1439. border-top-right-radius: 4px;
  1440. border-top-left-radius: 4px
  1441. }
  1442. .nav-tabs-custom > .nav-tabs > li {
  1443. border-top: 0
  1444. }
  1445. .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a {
  1446. border-left-color: #e1e1e1;
  1447. }
  1448. .nav-tabs-custom > .nav-tabs > li:first-of-type > a {
  1449. margin-left: 30px
  1450. }
  1451. .nav-tabs-custom > .nav-tabs > li.active > a {
  1452. border-top-color: #e1e1e1;
  1453. border-left-color: #e1e1e1;
  1454. border-right-color: #e1e1e1;
  1455. border-top-right-radius: 4px;
  1456. border-top-left-radius: 4px;
  1457. }
  1458. .nav-tabs-custom > .tab-content {
  1459. background: #fff;
  1460. border: 1px solid #e1e1e1;
  1461. border-radius: 4px
  1462. }
  1463. .navbar-brand {
  1464. font-size:16px;
  1465. text-transform: uppercase;
  1466. }
  1467. .navbar-default {
  1468. background-color: #fff;
  1469. border:0;
  1470. box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .05);
  1471. }
  1472. .navbar {
  1473. border-radius: 1px;
  1474. margin-bottom:15px;
  1475. }
  1476. .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
  1477. background-color:transparent;
  1478. border-bottom:3px solid var(--60);
  1479. color:#444;
  1480. }
  1481. .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
  1482. background-color: var(--30);
  1483. }
  1484. .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
  1485. background-color: var(--30);
  1486. }
  1487. .navbar-toggle {
  1488. padding: 18px 15px;
  1489. }
  1490. .navbar-default .navbar-nav>li>a {
  1491. color: var(--80);
  1492. font-weight: bold;
  1493. text-transform: capitalize;
  1494. }
  1495. .card .nav-tabs-custom {
  1496. box-shadow: none
  1497. }
  1498. .btn.filter-group {
  1499. border-right: 0;
  1500. margin-right:0!important;
  1501. }
  1502. .input-group-btn + .input-group-addon {
  1503. border-right: 0 !important
  1504. }
  1505. /*nprogress*/
  1506. #nprogress {
  1507. pointer-events: none
  1508. }
  1509. #nprogress .bar {
  1510. background: var(--blue);
  1511. position: fixed;
  1512. z-index: 1031;
  1513. top: 0;
  1514. left: 0;
  1515. width: 100%;
  1516. height: 2px
  1517. }
  1518. #nprogress .peg {
  1519. display: block;
  1520. position: absolute;
  1521. right: 0;
  1522. width: 100px;
  1523. height: 100%;
  1524. box-shadow: 0 0 10px var(--blue), 0 0 5px var(--blue);
  1525. opacity: 1;
  1526. -webkit-transform: rotate(3deg) translate(0, -4px);
  1527. -ms-transform: rotate(3deg) translate(0, -4px);
  1528. transform: rotate(3deg) translate(0, -4px)
  1529. }
  1530. #nprogress .spinner {
  1531. display: block;
  1532. position: fixed;
  1533. z-index: 1031;
  1534. top: 15px;
  1535. right: 15px
  1536. }
  1537. #nprogress .spinner-icon {
  1538. width: 18px;
  1539. height: 18px;
  1540. box-sizing: border-box;
  1541. border: solid 2px transparent;
  1542. border-top-color: var(--blue);
  1543. border-left-color: var(--blue);
  1544. border-radius: 50%;
  1545. -webkit-animation: nprogress-spinner .4s linear infinite;
  1546. animation: nprogress-spinner .4s linear infinite
  1547. }
  1548. .nprogress-custom-parent {
  1549. overflow: hidden;
  1550. position: relative
  1551. }
  1552. .nprogress-custom-parent #nprogress .bar, .nprogress-custom-parent #nprogress .spinner {
  1553. position: absolute
  1554. }
  1555. @-webkit-keyframes nprogress-spinner {
  1556. 0% {
  1557. -webkit-transform: rotate(0)
  1558. }
  1559. 100% {
  1560. -webkit-transform: rotate(360deg)
  1561. }
  1562. }
  1563. @keyframes nprogress-spinner {
  1564. 0% {
  1565. transform: rotate(0)
  1566. }
  1567. 100% {
  1568. transform: rotate(360deg)
  1569. }
  1570. }
  1571. /*nprogress*/
  1572. .popover {
  1573. border:1px solid rgba(0,0,0,.06);
  1574. /*border-radius:4px;*/
  1575. box-shadow:0 2px 10px rgba(0, 0, 0, .2);
  1576. }
  1577. .input-group-sm > .form-control, .input-group-sm > .input-group-addon, .input-group-sm > .input-group-btn > .btn {
  1578. border-radius: 0
  1579. }
  1580. .input-no-border .input-group {
  1581. box-shadow:0 2px 4px 0 rgba(0, 0, 0, .05);
  1582. }
  1583. .input-no-border .select2-container--default .select2-selection--multiple, .input-no-border .select2-container--default .select2-selection--single,
  1584. .input-no-border .input-group-btn .btn-default, .input-no-border .form-control, .input-no-border .input-group-addon{
  1585. border-color:#fff!important;
  1586. }
  1587. /*.input-no-border .form-control {*/
  1588. /* border-color:#fff;*/
  1589. /*}*/
  1590. /*.input-no-border .input-group-addon {*/
  1591. /* border-color:#fff;*/
  1592. /*}*/
  1593. /* .checkbox */
  1594. .checkbox input[type="checkbox"] {
  1595. cursor: pointer;
  1596. opacity: 0;
  1597. z-index: 1;
  1598. outline: none !important;
  1599. }
  1600. .checkbox label {
  1601. display: inline-block;
  1602. padding-left: 5px;
  1603. position: relative;
  1604. }
  1605. .checkbox input[type="checkbox"]:checked + label::after {
  1606. content: "\e64c";
  1607. font-family: 'themify';
  1608. }
  1609. .checkbox label::before {
  1610. -o-transition: 0.3s ease-in-out;
  1611. -webkit-transition: 0.3s ease-in-out;
  1612. background-color: #ffffff;
  1613. border-radius: 2px;
  1614. border: 1px solid #cccccc;
  1615. content: "";
  1616. display: inline-block;
  1617. height: 17px;
  1618. left: 0;
  1619. margin-left: -20px;
  1620. position: absolute;
  1621. transition: 0.3s ease-in-out;
  1622. width: 17px;
  1623. outline: none !important;
  1624. }
  1625. .checkbox label::after {
  1626. color: #555555;
  1627. display: inline-block;
  1628. font-size: 11px;
  1629. height: 16px;
  1630. left: 0;
  1631. margin-left: -20px;
  1632. padding-left: 3px;
  1633. padding-top: 1px;
  1634. position: absolute;
  1635. top: 0;
  1636. width: 16px;
  1637. }
  1638. .checkbox-primary input[type="checkbox"]:checked + label::before {
  1639. background-color: var(--primary);
  1640. border-color: var(--primary);
  1641. }
  1642. .checkbox-info input[type="checkbox"]:checked + label::before {
  1643. background-color: #71b6f9;
  1644. border-color: #71b6f9;
  1645. }
  1646. .checkbox-success input[type="checkbox"]:checked + label::before {
  1647. background-color: var(--success);
  1648. border-color: var(--success);
  1649. }
  1650. .checkbox-danger input[type="checkbox"]:checked + label::before {
  1651. background-color: var(--danger);
  1652. border-color: var(--danger);
  1653. }
  1654. .checkbox-purple input[type="checkbox"]:checked + label::before {
  1655. background-color: var(--purple);
  1656. border-color: var(--purple);
  1657. }
  1658. .checkbox-inverse input[type="checkbox"]:checked + label::before {
  1659. background-color: var(--inverse);
  1660. border-color: var(--inverse);
  1661. }
  1662. .checkbox:not(.checkbox-default) input[type="checkbox"]:checked + label::after {
  1663. color: #ffffff;
  1664. }
  1665. .checkbox input[type="checkbox"]:disabled + label {
  1666. opacity: 0.7;
  1667. }
  1668. .checkbox-grid{
  1669. margin-top:2px;margin-bottom:0
  1670. }
  1671. .checkbox-grid label{min-height:15px}
  1672. .checkbox.checkbox-circle label::before {
  1673. border-radius: 50%;
  1674. }
  1675. /* radio */
  1676. .radio {
  1677. padding-left: 20px;
  1678. }
  1679. .radio input[type="radio"] {
  1680. cursor: pointer;
  1681. opacity: 0;
  1682. z-index: 1;
  1683. outline: none !important;
  1684. }
  1685. .radio label {
  1686. display: inline-block;
  1687. padding-left: 5px;
  1688. position: relative;
  1689. }
  1690. .radio label::before {
  1691. -o-transition: border 0.5s ease-in-out;
  1692. -webkit-transition: border 0.5s ease-in-out;
  1693. background-color: #ffffff;
  1694. border-radius: 50%;
  1695. border: 1px solid #cccccc;
  1696. content: "";
  1697. display: inline-block;
  1698. height: 17px;
  1699. left: 0;
  1700. margin-left: -20px;
  1701. outline: none !important;
  1702. position: absolute;
  1703. transition: border 0.5s ease-in-out;
  1704. width: 17px;
  1705. }
  1706. .radio label::after {
  1707. -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  1708. -ms-transform: scale(0, 0);
  1709. -o-transform: scale(0, 0);
  1710. -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  1711. -webkit-transform: scale(0, 0);
  1712. -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  1713. background-color: #555555;
  1714. border-radius: 50%;
  1715. content: " ";
  1716. display: inline-block;
  1717. height: 11px;
  1718. left: 3px;
  1719. margin-left: -20px;
  1720. position: absolute;
  1721. top: 3px;
  1722. transform: scale(0, 0);
  1723. transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  1724. width: 11px;
  1725. }
  1726. .radio input[type="radio"]:checked + label::after {
  1727. -ms-transform: scale(1, 1);
  1728. -o-transform: scale(1, 1);
  1729. -webkit-transform: scale(1, 1);
  1730. transform: scale(1, 1);
  1731. }
  1732. .radio-primary input[type="radio"]:checked + label::before {
  1733. border-color: var(--primary);
  1734. }
  1735. .radio-primary input[type="radio"]:checked + label::after {
  1736. background-color: var(--primary);
  1737. }
  1738. .radio-primary input[type="radio"] + label::after {
  1739. background-color: var(--primary);
  1740. }
  1741. .radio-danger input[type="radio"]:checked + label::before {
  1742. border-color: var(--danger);
  1743. }
  1744. .radio-danger input[type="radio"] + label::after {
  1745. background-color: var(--danger);
  1746. }
  1747. .radio-danger input[type="radio"]:checked + label::after {
  1748. background-color: var(--danger);
  1749. }
  1750. .radio-purple input[type="radio"]:checked + label::before {
  1751. border-color: var(--purple);
  1752. }
  1753. .radio-purple input[type="radio"] + label::after {
  1754. background-color: var(--purple);
  1755. }
  1756. .radio-purple input[type="radio"]:checked + label::after {
  1757. background-color: var(--purple);
  1758. }
  1759. .radio-success input[type="radio"]:checked + label::before {
  1760. border-color: var(--success);
  1761. }
  1762. .radio-success input[type="radio"] + label::after {
  1763. background-color: var(--success);
  1764. }
  1765. .radio-success input[type="radio"]:checked + label::after {
  1766. background-color: var(--success);
  1767. }
  1768. .radio-info input[type="radio"]:checked + label::before {
  1769. border-color: #71b6f9;
  1770. }
  1771. .radio-info input[type="radio"] + label::after {
  1772. background-color: #71b6f9;
  1773. }
  1774. .radio-info input[type="radio"]:checked + label::after {
  1775. background-color: #71b6f9;
  1776. }
  1777. .radio input[type="radio"]:disabled + label {
  1778. opacity: 0.7;
  1779. }
  1780. .checkbox.checkbox-inline, .radio.radio-inline {
  1781. margin-top: 0;
  1782. }
  1783. /* .radio */
  1784. .grid-action-icon{
  1785. font-size:15px;
  1786. }
  1787. .layui-layer-btn .layui-layer-btn0 {
  1788. border-color: var(--primary) !important;
  1789. background-color: var(--primary) !important;
  1790. }
  1791. div.layui-layer-btn{
  1792. background: #fff;
  1793. }
  1794. .select-resource .layui-layer-btn .layui-layer-btn0 {
  1795. border-color: #dedede !important;
  1796. background-color: #fff!important;
  1797. color: #333;
  1798. }
  1799. /* jstree */
  1800. .jstree-wrapper {
  1801. /*box-shadow: 1px 1px 4px 1px rgba(0,0,0,.1);*/
  1802. width:100%;
  1803. padding: 12px 18px 18px;
  1804. border:1px solid #d2d6de;
  1805. }
  1806. .form-group.has-error .jstree-wrapper {border-color:#dd4b39}
  1807. .fields-group label.asterisk:before {
  1808. content: "*";
  1809. margin:0 5px 0 0;
  1810. font-weight:bold;
  1811. color:#dd4b39
  1812. }
  1813. .jstree-wrapper .jstree-container-ul .jstree-node {
  1814. display: block;
  1815. clear: both;
  1816. width:2px 0 1px 24px;
  1817. }
  1818. .jstree-wrapper .jstree-leaf:not(:first-child) {
  1819. float: left;
  1820. background: none;
  1821. margin-left: 0;
  1822. /*width: 80px;*/
  1823. clear: none;
  1824. }
  1825. .jstree-wrapper .jstree-leaf {
  1826. float: left;
  1827. margin-left: 0;
  1828. padding-left: 22px;
  1829. /*width: 80px;*/
  1830. clear: none;
  1831. color: #777;
  1832. }
  1833. .jstree-wrapper .jstree-leaf > .jstree-icon,.jstree-wrapper .jstree-leaf .jstree-themeicon {
  1834. display: none;
  1835. }
  1836. .jstree-wrapper .jstree-last {
  1837. /*background-image: url("../img/32px.png");*/
  1838. background-position: -292px -4px;
  1839. background-repeat: repeat-y;
  1840. }
  1841. .jstree-wrapper .jstree-children:before,.jstree-wrapper .jstree-children:after {
  1842. content: " ";
  1843. display: table;
  1844. }
  1845. .jstree-wrapper .jstree-children:after {
  1846. clear: both;
  1847. }
  1848. .jstree-wrapper .jstree-themeicon {
  1849. display: none;
  1850. }
  1851. .jstree-proton .jstree-anchor {
  1852. font-size:13px;
  1853. color:#333!important;
  1854. text-shadow: 0 1px 2px rgba(0, 0, 0, .15);
  1855. }
  1856. .jstree-proton .jstree-ocl,.jstree-proton .jstree-node {
  1857. background:none!important;
  1858. }
  1859. .jstree-proton .jstree-ocl:before {
  1860. font-family:FontAwesome;
  1861. font-weight:bold;
  1862. font-size:15px;
  1863. }
  1864. .jstree-proton .jstree-open>.jstree-ocl:before {
  1865. content:"\f107";
  1866. }
  1867. .jstree-proton .jstree-closed>.jstree-ocl:before {
  1868. content:"\f105";
  1869. }
  1870. .control-sidebar-light{
  1871. box-shadow: 0 2px 5px 0 rgba(0,0,0,0.26);
  1872. }
  1873. /* nestable */
  1874. .dd-item > button {
  1875. height:25px!important;;
  1876. }
  1877. .dd-item > button:before {
  1878. font-family: FontAwesome!important;
  1879. content:"\f105"!important;
  1880. }
  1881. .dd-item > button[data-action="collapse"]:before {
  1882. content:"\f107"!important;
  1883. }
  1884. /*!
  1885. * Waves v0.7.6
  1886. * http://fian.my.id/Waves
  1887. *
  1888. * Copyright 2014-2018 Alfiana E. Sibuea and other contributors
  1889. * Released under the MIT license
  1890. * https://github.com/fians/Waves/blob/master/LICENSE */.waves-effect{position:relative;cursor:pointer;display:inline-block;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.waves-effect .waves-ripple{position:absolute;border-radius:50%;width:100px;height:100px;margin-top:-50px;margin-left:-50px;opacity:0;background:rgba(0,0,0,.2);background:-webkit-radial-gradient(rgba(0,0,0,.2) 0,rgba(0,0,0,.3) 40%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.5) 60%,rgba(255,255,255,0) 70%);background:-o-radial-gradient(rgba(0,0,0,.2) 0,rgba(0,0,0,.3) 40%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.5) 60%,rgba(255,255,255,0) 70%);background:-moz-radial-gradient(rgba(0,0,0,.2) 0,rgba(0,0,0,.3) 40%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.5) 60%,rgba(255,255,255,0) 70%);background:radial-gradient(rgba(0,0,0,.2) 0,rgba(0,0,0,.3) 40%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.5) 60%,rgba(255,255,255,0) 70%);-webkit-transition:all .5s ease-out;-moz-transition:all .5s ease-out;-o-transition:all .5s ease-out;transition:all .5s ease-out;-webkit-transition-property:-webkit-transform,opacity;-moz-transition-property:-moz-transform,opacity;-o-transition-property:-o-transform,opacity;transition-property:transform,opacity;-webkit-transform:scale(0) translate(0,0);-moz-transform:scale(0) translate(0,0);-ms-transform:scale(0) translate(0,0);-o-transform:scale(0) translate(0,0);transform:scale(0) translate(0,0);pointer-events:none}.waves-effect.waves-light .waves-ripple{background:rgba(255,255,255,.4);background:-webkit-radial-gradient(rgba(255,255,255,.2) 0,rgba(255,255,255,.3) 40%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0) 70%);background:-o-radial-gradient(rgba(255,255,255,.2) 0,rgba(255,255,255,.3) 40%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0) 70%);background:-moz-radial-gradient(rgba(255,255,255,.2) 0,rgba(255,255,255,.3) 40%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0) 70%);background:radial-gradient(rgba(255,255,255,.2) 0,rgba(255,255,255,.3) 40%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0) 70%)}.waves-effect.waves-classic .waves-ripple{background:rgba(0,0,0,.2)}.waves-effect.waves-classic.waves-light .waves-ripple{background:rgba(255,255,255,.4)}.waves-notransition{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;transition:none!important}.waves-button,.waves-circle{-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0);-webkit-mask-image:-webkit-radial-gradient(circle,#fff 100%,#000 100%)}.waves-button,.waves-button-input,.waves-button:hover,.waves-button:visited{white-space:nowrap;vertical-align:middle;cursor:pointer;border:none;outline:0;color:inherit;background-color:rgba(0,0,0,0);font-size:1em;line-height:1em;text-align:center;text-decoration:none;z-index:1}.waves-button{padding:.85em 1.1em;border-radius:.2em}.waves-button-input{margin:0;padding:.85em 1.1em}.waves-input-wrapper{border-radius:.2em;vertical-align:bottom}.waves-input-wrapper.waves-button{padding:0}.waves-input-wrapper .waves-button-input{position:relative;top:0;left:0;z-index:1}.waves-circle{text-align:center;width:2.5em;height:2.5em;line-height:2.5em;border-radius:50%}.waves-float{-webkit-mask-image:none;-webkit-box-shadow:0 1px 1.5px 1px rgba(0,0,0,.12);box-shadow:0 1px 1.5px 1px rgba(0,0,0,.12);-webkit-transition:all .3s;-moz-transition:all .3s;-o-transition:all .3s;transition:all .3s}.waves-float:active{-webkit-box-shadow:0 8px 20px 1px rgba(0,0,0,.3);box-shadow:0 8px 20px 1px rgba(0,0,0,.3)}.waves-block{display:block}
  1891. .waves-effect.waves-70 .waves-ripple {
  1892. background: rgba(0, 0, 0, .07);
  1893. background: -webkit-radial-gradient(rgba(0, 0, 0, .07) 0, rgba(0, 0, 0, .13) 40%, rgba(0, 0, 0, .18) 50%, rgba(0, 0, 0, .23) 60%, rgba(255, 255, 255, 0) 70%);
  1894. background: -o-radial-gradient(rgba(0, 0, 0, .07) 0, rgba(0, 0, 0, .13) 40%, rgba(0, 0, 0, .18) 50%, rgba(0, 0, 0, .23) 60%, rgba(255, 255, 255, 0) 70%);
  1895. background: -moz-radial-gradient(rgba(0, 0, 0, .07) 0, rgba(0, 0, 0, .13) 40%, rgba(0, 0, 0, .18) 50%, rgba(0, 0, 0, .23) 60%, rgba(255, 255, 255, 0) 70%);
  1896. background: radial-gradient(rgba(0, 0, 0, .07) 0, rgba(0, 0, 0, .13) 40%, rgba(0, 0, 0, .18) 50%, rgba(0, 0, 0, .23) 60%, rgba(255, 255, 255, 0) 70%);
  1897. }
  1898. .waves-effect.waves-40 .waves-ripple{
  1899. background: var(--30);
  1900. background: -webkit-radial-gradient(var(--30) 0, var(--40) 40%, var(--50) 50%, var(--60) 60%, rgba(255, 255, 255, 0) 70%);
  1901. background: -o-radial-gradient(var(--30) 0, var(--40) 40%, var(--50) 50%, var(--60) 60%, rgba(255, 255, 255, 0) 70%);
  1902. background: -moz-radial-gradient(var(--30) 0, var(--40) 40%, var(--50) 50%, var(--60) 60%, rgba(255, 255, 255, 0) 70%);
  1903. background: radial-gradient(var(--30) 0, var(--40) 40%, var(--50) 50%, var(--60) 60%, rgba(255, 255, 255, 0) 70%);
  1904. }