components.css 92 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126
  1. html {
  2. font-size: 14px;
  3. height: 100%;
  4. letter-spacing: 0.01rem;
  5. /*
  6. * Blank page
  7. */ }
  8. html body {
  9. height: 100%;
  10. background-color: #f8f8f8;
  11. direction: ltr; }
  12. html body p {
  13. line-height: 1.5rem; }
  14. html .content {
  15. padding: 0;
  16. position: relative;
  17. transition: 300ms ease all;
  18. backface-visibility: hidden;
  19. min-height: calc(100% - 3.35rem);
  20. margin-left: 260px; }
  21. html .content.app-content {
  22. padding: calc(2rem + 4.45rem + 1.3rem) 2rem 0; }
  23. html .content.app-content.show-overlay .content-overlay {
  24. z-index: 10;
  25. opacity: 1; }
  26. html .content.app-content.show-overlay .content-overlay ~ .header-navbar-shadow {
  27. display: none; }
  28. html .content.app-content .content-overlay {
  29. position: fixed;
  30. opacity: 0;
  31. width: 100%;
  32. height: 100%;
  33. top: 0;
  34. left: 0;
  35. right: 0;
  36. bottom: 0;
  37. background-color: rgba(34, 41, 47, 0.5);
  38. cursor: pointer;
  39. transition: all 0.7s, z-index 0s;
  40. z-index: -1; }
  41. html .content.app-content .content-area-wrapper {
  42. display: flex;
  43. position: relative;
  44. overflow: hidden; }
  45. html .content.app-content .content-area-wrapper .content-wrapper,
  46. html .content.app-content .content-area-wrapper .content-body {
  47. height: 100%; }
  48. html .content .body-content-overlay {
  49. top: 0;
  50. left: 0;
  51. right: 0;
  52. bottom: 0;
  53. position: absolute;
  54. display: block;
  55. z-index: 4;
  56. visibility: hidden;
  57. opacity: 0;
  58. transition: all 0.3s ease; }
  59. html .content .body-content-overlay.show {
  60. visibility: visible;
  61. transition: all 0.3s ease;
  62. opacity: 1;
  63. background-color: rgba(34, 41, 47, 0.2);
  64. border-radius: 0.1785rem; }
  65. html .content .content-wrapper .content-header-title {
  66. font-weight: 500;
  67. color: #636363;
  68. padding-right: 1rem;
  69. border-right: 1px solid #d6dce1; }
  70. html .content .content-wrapper .content-header-right .dropdown-toggle::after {
  71. display: none; }
  72. html .content .content-wrapper .content-header-right .dropdown-toggle i,
  73. html .content .content-wrapper .content-header-right .dropdown-toggle svg {
  74. margin-right: 0; }
  75. html .content .content-wrapper .content-header-right .btn-icon {
  76. padding: 0.8rem; }
  77. html .content .content-wrapper .content-header-right .btn-icon i,
  78. html .content .content-wrapper .content-header-right .btn-icon svg {
  79. height: 1rem;
  80. width: 1rem; }
  81. html .navbar-floating.footer-static .app-content .content-area-wrapper,
  82. html .navbar-floating.footer-static .app-content .kanban-wrapper {
  83. height: calc( 100vh - calc( calc(2rem * 1) + 4.45rem + 3.35rem + 1.3rem + 0rem ));
  84. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 1) + 4.45rem + 3.35rem + 1.3rem + 0rem )); }
  85. @media (max-width: 575.98px) {
  86. html .navbar-floating.footer-static .app-content .content-area-wrapper,
  87. html .navbar-floating.footer-static .app-content .kanban-wrapper {
  88. height: calc( 100vh - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 4.45rem + 3.35rem + 1.3rem + 0rem ));
  89. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 4.45rem + 3.35rem + 1.3rem + 0rem )); } }
  90. html .navbar-floating.footer-hidden .app-content .content-area-wrapper,
  91. html .navbar-floating.footer-hidden .app-content .kanban-wrapper {
  92. height: calc( 100vh - calc( calc(2rem * 2) + 4.45rem + 0rem + 1.3rem + 0rem ));
  93. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 4.45rem + 0rem + 1.3rem + 0rem )); }
  94. @media (max-width: 575.98px) {
  95. html .navbar-floating.footer-hidden .app-content .content-area-wrapper,
  96. html .navbar-floating.footer-hidden .app-content .kanban-wrapper {
  97. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 0rem + 1.3rem + 0rem ));
  98. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 0rem + 1.3rem + 0rem )); } }
  99. html .navbar-floating.footer-fixed .app-content .content-area-wrapper,
  100. html .navbar-floating.footer-fixed .app-content .kanban-wrapper {
  101. height: calc( 100vh - calc( calc(2rem * 2) + 4.45rem + 3.35rem + 1.3rem + 0rem ));
  102. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 4.45rem + 3.35rem + 1.3rem + 0rem )); }
  103. @media (max-width: 575.98px) {
  104. html .navbar-floating.footer-fixed .app-content .content-area-wrapper,
  105. html .navbar-floating.footer-fixed .app-content .kanban-wrapper {
  106. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 3.35rem + 1.3rem + 0rem ));
  107. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 3.35rem + 1.3rem + 0rem )); } }
  108. html .navbar-hidden .app-content {
  109. padding: 2rem 2rem 0 2rem !important; }
  110. html .navbar-hidden.footer-static .app-content .content-area-wrapper,
  111. html .navbar-hidden.footer-static .app-content .kanban-wrapper {
  112. height: calc( 100vh - calc( calc(2rem * 1) + 0rem + 3.35rem + 0rem + 0rem ));
  113. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 1) + 0rem + 3.35rem + 0rem + 0rem )); }
  114. @media (max-width: 575.98px) {
  115. html .navbar-hidden.footer-static .app-content .content-area-wrapper,
  116. html .navbar-hidden.footer-static .app-content .kanban-wrapper {
  117. height: calc( 100vh - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 0rem + 3.35rem + 0rem + 0rem ));
  118. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 0rem + 3.35rem + 0rem + 0rem )); } }
  119. html .navbar-hidden.footer-hidden .app-content .content-area-wrapper,
  120. html .navbar-hidden.footer-hidden .app-content .kanban-wrapper {
  121. height: calc( 100vh - calc( calc(2rem * 2) + 0rem + 0rem + 0rem + 0rem ));
  122. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 0rem + 0rem + 0rem + 0rem )); }
  123. @media (max-width: 575.98px) {
  124. html .navbar-hidden.footer-hidden .app-content .content-area-wrapper,
  125. html .navbar-hidden.footer-hidden .app-content .kanban-wrapper {
  126. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 0rem + 0rem + 0rem + 0rem ));
  127. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 0rem + 0rem + 0rem + 0rem )); } }
  128. html .navbar-hidden.footer-fixed .app-content .content-area-wrapper,
  129. html .navbar-hidden.footer-fixed .app-content .kanban-wrapper {
  130. height: calc( 100vh - calc( calc(2rem * 2) + 0rem + 3.35rem + 0rem + 0rem ));
  131. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 0rem + 3.35rem + 0rem + 0rem )); }
  132. @media (max-width: 575.98px) {
  133. html .navbar-hidden.footer-fixed .app-content .content-area-wrapper,
  134. html .navbar-hidden.footer-fixed .app-content .kanban-wrapper {
  135. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 0rem + 3.35rem + 0rem + 0rem ));
  136. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 0rem + 3.35rem + 0rem + 0rem )); } }
  137. html .navbar-static .main-menu {
  138. top: 0; }
  139. html .navbar-static .content {
  140. min-height: calc(100% - calc(4.45rem + 3.35rem)); }
  141. html .navbar-static .app-content {
  142. padding: 2rem 2rem 0 2rem; }
  143. html .navbar-static.footer-static .app-content .content-area-wrapper,
  144. html .navbar-static.footer-static .app-content .kanban-wrapper {
  145. height: calc( 100vh - calc( calc(2rem * 1) + 4.45rem + 3.35rem + 0rem + 0rem ));
  146. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 1) + 4.45rem + 3.35rem + 0rem + 0rem )); }
  147. @media (max-width: 575.98px) {
  148. html .navbar-static.footer-static .app-content .content-area-wrapper,
  149. html .navbar-static.footer-static .app-content .kanban-wrapper {
  150. height: calc( 100vh - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 4.45rem + 3.35rem + 0rem + 0rem ));
  151. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 4.45rem + 3.35rem + 0rem + 0rem )); } }
  152. html .navbar-static.footer-hidden .app-content .content-area-wrapper,
  153. html .navbar-static.footer-hidden .app-content .kanban-wrapper {
  154. height: calc( 100vh - calc( calc(2rem * 2) + 4.45rem + 0rem + 0rem + 0rem ));
  155. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 4.45rem + 0rem + 0rem + 0rem )); }
  156. @media (max-width: 575.98px) {
  157. html .navbar-static.footer-hidden .app-content .content-area-wrapper,
  158. html .navbar-static.footer-hidden .app-content .kanban-wrapper {
  159. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 0rem + 0rem + 0rem ));
  160. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 0rem + 0rem + 0rem )); } }
  161. html .navbar-static.footer-fixed .app-content .content-area-wrapper,
  162. html .navbar-static.footer-fixed .app-content .kanban-wrapper {
  163. height: calc( 100vh - calc( calc(2rem * 2) + 4.45rem + 3.35rem + 0rem + 0rem ));
  164. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 4.45rem + 3.35rem + 0rem + 0rem )); }
  165. @media (max-width: 575.98px) {
  166. html .navbar-static.footer-fixed .app-content .content-area-wrapper,
  167. html .navbar-static.footer-fixed .app-content .kanban-wrapper {
  168. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 3.35rem + 0rem + 0rem ));
  169. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 3.35rem + 0rem + 0rem )); } }
  170. html .navbar-sticky .app-content {
  171. padding: calc(2rem + 4.45rem) 2rem 0 2rem; }
  172. html .navbar-sticky.footer-static .app-content .content-area-wrapper,
  173. html .navbar-sticky.footer-static .app-content .kanban-wrapper {
  174. height: calc( 100vh - calc( calc(2rem * 1) + 4.45rem + 3.35rem + 0rem + 0rem ));
  175. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 1) + 4.45rem + 3.35rem + 0rem + 0rem )); }
  176. @media (max-width: 575.98px) {
  177. html .navbar-sticky.footer-static .app-content .content-area-wrapper,
  178. html .navbar-sticky.footer-static .app-content .kanban-wrapper {
  179. height: calc( 100vh - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 4.45rem + 3.35rem + 0rem + 0rem ));
  180. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 1) - calc(0.8rem * 1)) + 4.45rem + 3.35rem + 0rem + 0rem )); } }
  181. html .navbar-sticky.footer-hidden .app-content .content-area-wrapper,
  182. html .navbar-sticky.footer-hidden .app-content .kanban-wrapper {
  183. height: calc( 100vh - calc( calc(2rem * 2) + 4.45rem + 0rem + 0rem + 0rem ));
  184. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 4.45rem + 0rem + 0rem + 0rem )); }
  185. @media (max-width: 575.98px) {
  186. html .navbar-sticky.footer-hidden .app-content .content-area-wrapper,
  187. html .navbar-sticky.footer-hidden .app-content .kanban-wrapper {
  188. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 0rem + 0rem + 0rem ));
  189. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 0rem + 0rem + 0rem )); } }
  190. html .navbar-sticky.footer-fixed .app-content .content-area-wrapper,
  191. html .navbar-sticky.footer-fixed .app-content .kanban-wrapper {
  192. height: calc( 100vh - calc( calc(2rem * 2) + 4.45rem + 3.35rem + 0rem + 0rem ));
  193. height: calc( var(--vh, 1vh) * 100 - calc( calc(2rem * 2) + 4.45rem + 3.35rem + 0rem + 0rem )); }
  194. @media (max-width: 575.98px) {
  195. html .navbar-sticky.footer-fixed .app-content .content-area-wrapper,
  196. html .navbar-sticky.footer-fixed .app-content .kanban-wrapper {
  197. height: calc( 100vh - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 3.35rem + 0rem + 0rem ));
  198. height: calc( var(--vh, 1vh) * 100 - calc( calc(calc(2rem * 2) - calc(0.8rem * 2)) + 4.45rem + 3.35rem + 0rem + 0rem )); } }
  199. html .navbar-static .nav.header-navbar .navbar-container,
  200. html .navbar-sticky .nav.header-navbar .navbar-container {
  201. padding-left: 1.6rem;
  202. padding-right: 1.6rem; }
  203. html .navbar-static .nav.header-navbar .navbar-container .search-input .search-list.show,
  204. html .navbar-sticky .nav.header-navbar .navbar-container .search-input .search-list.show {
  205. width: 98%;
  206. left: 1%; }
  207. html .footer-fixed .content.app-content {
  208. padding-bottom: 3.35rem !important; }
  209. html [data-col='1-column'] .header-navbar {
  210. width: 100%;
  211. left: 0 !important; }
  212. html [data-col='1-column'] .header-navbar.floating-nav {
  213. width: calc( 100vw - (100vw - 100%) - calc(2rem * 2)) !important; }
  214. html [data-col='1-column'] .content,
  215. html [data-col='1-column'] .footer {
  216. margin-left: 0px !important; }
  217. html [data-col='1-column'].horizontal-layout .header-navbar {
  218. width: 100% !important; }
  219. html [data-col='1-column'].horizontal-layout .app-content {
  220. padding: calc(2rem + 4.45rem + 1.3rem) 2rem 0 2rem !important; }
  221. html [data-col='1-column'].horizontal-layout.footer-fixed .app-content {
  222. padding: calc(2rem + 4.45rem + 1.3rem) 2rem 3.35rem 2rem !important; }
  223. html .blank-page .content {
  224. margin-left: 0; }
  225. html .blank-page .content.app-content {
  226. overflow: overlay;
  227. overflow-x: hidden;
  228. padding: 0 !important;
  229. transition: none; }
  230. html .blank-page .content.app-content .header-navbar-shadow {
  231. display: none; }
  232. html .blank-page .content-wrapper {
  233. padding: 0 !important; }
  234. html .blank-page .content-wrapper .flexbox-container {
  235. display: flex;
  236. align-items: center;
  237. height: 100vh;
  238. height: calc(var(--vh, 1vh) * 100);
  239. justify-content: center; }
  240. html .pace .pace-progress {
  241. background: #7367f0; }
  242. .app-content.center-layout {
  243. overflow: hidden; }
  244. /*
  245. * Col 3 layout for detached and general type
  246. */
  247. @media (min-width: 992px) {
  248. body .content-right {
  249. width: calc(100vw - (100vw - 100%) - 260px);
  250. float: right; }
  251. body .content-left {
  252. width: calc(100vw - (100vw - 100%) - 260px);
  253. float: left; }
  254. body .content-detached {
  255. width: 100%; }
  256. body .content-detached.content-right {
  257. float: right;
  258. margin-left: -260px; }
  259. body .content-detached.content-right .content-body {
  260. margin-left: calc(260px + 2rem); }
  261. body .content-detached.content-left {
  262. float: left;
  263. margin-right: -260px; }
  264. body .content-detached.content-left .content-body {
  265. margin-right: calc(260px + 2rem); }
  266. .sidebar-right.sidebar-sticky {
  267. float: right !important;
  268. margin-left: -260px;
  269. width: 260px !important;
  270. margin-top: 5.7rem; } }
  271. @media (max-width: 767.98px) {
  272. html body .app-content {
  273. padding: calc(2rem - 0.8rem + 4.45rem + 1.3rem) calc(2rem - 0.8rem) 0 calc(2rem - 0.8rem) !important; }
  274. html body.navbar-static .app-content {
  275. padding: calc(2rem - 0.8rem) calc(2rem - 0.8rem) 0 calc(2rem - 0.8rem) !important; }
  276. html body.navbar-sticky .app-content {
  277. padding: calc(2rem - 0.8rem + 4.45rem) calc(2rem - 0.8rem) 0 calc(2rem - 0.8rem) !important; }
  278. html body.navbar-hidden .app-content {
  279. padding: calc(2rem - 0.8rem) calc(2rem - 0.8rem) 0 calc(2rem - 0.8rem) !important; } }
  280. @media (max-width: 767.98px) {
  281. .navbar-static .app-content .header-navbar .navbar-container,
  282. .navbar-sticky .app-content .header-navbar .navbar-container {
  283. padding-left: 1rem;
  284. padding-right: 0.5rem; } }
  285. @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  286. html.full-screen {
  287. width: 100%; }
  288. html.full-screen .content.app-content {
  289. height: 100%;
  290. overflow: scroll;
  291. overflow-x: hidden; } }
  292. /*=========================================================================================
  293. File Name: sidebar.scss
  294. Description: content sidebar specific scss.
  295. ----------------------------------------------------------------------------------------
  296. Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
  297. Author: PIXINVENT
  298. Author URL: http://www.themeforest.net/user/pixinvent
  299. ==========================================================================================*/
  300. .sidebar {
  301. position: relative;
  302. width: 100%;
  303. height: 100%; }
  304. @media (min-width: 992px) {
  305. .sidebar {
  306. vertical-align: top; } }
  307. .sidebar-fixed {
  308. position: fixed;
  309. height: 100%;
  310. overflow: scroll; }
  311. .sidenav-overlay {
  312. position: fixed;
  313. top: 0;
  314. left: 0;
  315. right: 0;
  316. height: 120vh;
  317. background-color: rgba(34, 41, 47, 0.5);
  318. z-index: 997;
  319. display: block;
  320. visibility: hidden;
  321. opacity: 0;
  322. transition: all 0.5s ease; }
  323. .sidenav-overlay.show {
  324. opacity: 1;
  325. visibility: visible;
  326. transition: all 0.5s ease; }
  327. .drag-target {
  328. height: 100%;
  329. width: 40px;
  330. position: fixed;
  331. top: 0;
  332. left: -10px;
  333. z-index: 1036; }
  334. .sidebar-detached .sidebar {
  335. width: 260px; }
  336. @media (min-width: 992px) {
  337. .sidebar-left {
  338. float: left; }
  339. .sidebar-right {
  340. float: right; } }
  341. @media (max-width: 991.98px) {
  342. .sidebar-detached .sidebar {
  343. width: 100%; } }
  344. footer.footer {
  345. padding: 0.8rem 2rem;
  346. min-height: 3.35rem;
  347. transition: 300ms ease all; }
  348. footer.footer span i,
  349. footer.footer span svg {
  350. height: 1.51rem;
  351. width: 1.51rem;
  352. font-size: 1.51rem;
  353. margin-left: 0.5rem;
  354. color: #ea5455; }
  355. footer.footer .scroll-top {
  356. padding: 0.81rem 0.83rem; }
  357. footer.footer-shadow {
  358. box-shadow: 0 4px 24px 0 rgba(34, 41, 47, 0.1); }
  359. footer.footer-border {
  360. border-top: 1px solid #ebe9f1; }
  361. .footer-fixed footer {
  362. position: fixed !important;
  363. z-index: 1030;
  364. right: 0;
  365. left: 0;
  366. bottom: 0; }
  367. .footer-fixed footer.footer-light {
  368. background: #fff;
  369. box-shadow: 0 4px 24px 0 rgba(34, 41, 47, 0.1); }
  370. .footer-fixed footer.footer-dark {
  371. background: #b8c2cc;
  372. color: #fff; }
  373. .footer-hidden .app-content {
  374. padding-bottom: 0.1px !important; }
  375. .scroll-top {
  376. position: fixed;
  377. bottom: 5%;
  378. right: 30px;
  379. display: none;
  380. z-index: 99; }
  381. /*=========================================================================================
  382. File Name: navigation.scss
  383. Description: Common mixin for menus, contain dark and light version scss.
  384. ----------------------------------------------------------------------------------------
  385. Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
  386. Author: PIXINVENT
  387. Author URL: http://www.themeforest.net/user/pixinvent
  388. ==========================================================================================*/
  389. .main-menu {
  390. z-index: 1031;
  391. position: absolute;
  392. display: table-cell;
  393. height: 100%;
  394. overflow: hidden; }
  395. .main-menu.menu-light {
  396. color: #6e6b7b;
  397. background: #fff; }
  398. .main-menu.menu-light .navigation {
  399. background: #fff; }
  400. .main-menu.menu-light .navigation .navigation-header {
  401. color: #a6a4b0;
  402. margin: calc(2rem + 0.286rem) 0 0.8rem 2.2rem;
  403. padding: 0;
  404. line-height: 1.5;
  405. letter-spacing: 0.01rem; }
  406. .main-menu.menu-light .navigation .navigation-header span {
  407. font-weight: 500; }
  408. .main-menu.menu-light .navigation li.has-sub > a {
  409. transition: all 0.5s ease, background 0s, color 0s; }
  410. .main-menu.menu-light .navigation li a {
  411. color: #625f6e;
  412. padding: 10px 15px 10px 15px;
  413. line-height: 1.45; }
  414. .main-menu.menu-light .navigation li a span.menu-sub-title {
  415. color: #bdbbc4; }
  416. .main-menu.menu-light .navigation li a > * {
  417. transition: transform 0.25s ease; }
  418. .main-menu.menu-light .navigation li.nav-item a:hover > * {
  419. transition: transform 0.25s ease;
  420. transform: translateX(5px); }
  421. .main-menu.menu-light .navigation li.nav-item ul.menu-content li a:hover > * {
  422. transition: transform 0.25s ease;
  423. transform: translateX(5px); }
  424. .main-menu.menu-light .navigation > li > a {
  425. margin: 0 15px; }
  426. .main-menu.menu-light .navigation > li > a .label {
  427. margin-top: 4px;
  428. margin-right: 5px; }
  429. .main-menu.menu-light .navigation > li > a i,
  430. .main-menu.menu-light .navigation > li > a svg {
  431. position: relative;
  432. top: 1px; }
  433. .main-menu.menu-light .navigation > li > ul li:first-of-type {
  434. margin-top: 7px !important; }
  435. .main-menu.menu-light .navigation > li > ul li:not(.has-sub) {
  436. margin: 0 15px; }
  437. .main-menu.menu-light .navigation > li > ul li.has-sub > a {
  438. margin: 0 15px; }
  439. .main-menu.menu-light .navigation > li > ul li.has-sub > ul > li {
  440. margin: 0 15px; }
  441. .main-menu.menu-light .navigation > li.open:not(.menu-item-closing) > a, .main-menu.menu-light .navigation > li.sidebar-group-active > a {
  442. color: #565360;
  443. background: whitesmoke;
  444. border-radius: 6px; }
  445. .main-menu.menu-light .navigation > li:not(.open) > ul {
  446. display: none; }
  447. .main-menu.menu-light .navigation > li:not(.open) > ul .active {
  448. background: transparent;
  449. box-shadow: none; }
  450. .main-menu.menu-light .navigation > li.active {
  451. z-index: 1; }
  452. .main-menu.menu-light .navigation > li.active > a {
  453. background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7));
  454. box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7);
  455. color: #fff;
  456. font-weight: 400;
  457. border-radius: 4px; }
  458. .main-menu.menu-light .navigation > li .active {
  459. background: #f0f0f0; }
  460. .main-menu.menu-light .navigation > li .active > a {
  461. color: #7367f0;
  462. margin-bottom: 0; }
  463. .main-menu.menu-light .navigation > li .active .hover > a,
  464. .main-menu.menu-light .navigation > li .active :hover > a {
  465. background: whitesmoke; }
  466. .main-menu.menu-light .navigation > li ul {
  467. padding: 0;
  468. margin: 0; }
  469. .main-menu.menu-light .navigation > li ul li {
  470. color: #6e6b7b;
  471. background: transparent; }
  472. .main-menu.menu-light .navigation > li ul li > a {
  473. padding: 10px 15px 10px 20px; }
  474. .main-menu.menu-light .navigation > li ul li ul a {
  475. padding: 10px 15px 10px 53px; }
  476. .main-menu.menu-light .navigation > li ul .has-sub:not(.open) > ul {
  477. display: none; }
  478. .main-menu.menu-light .navigation > li ul .has-sub:not(.open) > ul .active {
  479. background: transparent;
  480. box-shadow: none; }
  481. .main-menu.menu-light .navigation > li ul .open > a,
  482. .main-menu.menu-light .navigation > li ul .sidebar-group-active > a {
  483. color: #6e6b7b;
  484. background: whitesmoke;
  485. border-radius: 6px; }
  486. .main-menu.menu-light .navigation > li ul .open > ul,
  487. .main-menu.menu-light .navigation > li ul .sidebar-group-active > ul {
  488. display: block; }
  489. .main-menu.menu-light .navigation > li ul .open > ul .open > ul,
  490. .main-menu.menu-light .navigation > li ul .sidebar-group-active > ul .open > ul {
  491. display: block; }
  492. .main-menu.menu-light .navigation > li ul .hover > a, .main-menu.menu-light .navigation > li ul:hover > a {
  493. color: #787486; }
  494. .main-menu.menu-light .navigation > li ul .active {
  495. background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7));
  496. box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7);
  497. border-radius: 4px;
  498. z-index: 1; }
  499. .main-menu.menu-light .navigation > li ul .active > a {
  500. color: #fff; }
  501. .main-menu.menu-dark {
  502. color: #dcdcdc;
  503. background: #10163a; }
  504. .main-menu.menu-dark .navigation {
  505. background: #10163a; }
  506. .main-menu.menu-dark .navigation .navigation-header {
  507. color: white;
  508. margin: calc(2rem + 0.286rem) 0 0.8rem 2.2rem;
  509. padding: 0;
  510. line-height: 1.5;
  511. letter-spacing: 0.01rem; }
  512. .main-menu.menu-dark .navigation .navigation-header span {
  513. font-weight: 500; }
  514. .main-menu.menu-dark .navigation li.has-sub > a {
  515. transition: all 0.5s ease, background 0s, color 0s; }
  516. .main-menu.menu-dark .navigation li a {
  517. color: #d0d0d0;
  518. padding: 10px 15px 10px 15px;
  519. line-height: 1.45; }
  520. .main-menu.menu-dark .navigation li a span.menu-sub-title {
  521. color: white; }
  522. .main-menu.menu-dark .navigation li a > * {
  523. transition: transform 0.25s ease; }
  524. .main-menu.menu-dark .navigation li.nav-item a:hover > * {
  525. transition: transform 0.25s ease;
  526. transform: translateX(5px); }
  527. .main-menu.menu-dark .navigation li.nav-item ul.menu-content li a:hover > * {
  528. transition: transform 0.25s ease;
  529. transform: translateX(5px); }
  530. .main-menu.menu-dark .navigation > li > a {
  531. margin: 0 15px; }
  532. .main-menu.menu-dark .navigation > li > a .label {
  533. margin-top: 4px;
  534. margin-right: 5px; }
  535. .main-menu.menu-dark .navigation > li > a i,
  536. .main-menu.menu-dark .navigation > li > a svg {
  537. position: relative;
  538. top: 1px; }
  539. .main-menu.menu-dark .navigation > li > ul li:first-of-type {
  540. margin-top: 7px !important; }
  541. .main-menu.menu-dark .navigation > li > ul li:not(.has-sub) {
  542. margin: 0 15px; }
  543. .main-menu.menu-dark .navigation > li > ul li.has-sub > a {
  544. margin: 0 15px; }
  545. .main-menu.menu-dark .navigation > li > ul li.has-sub > ul > li {
  546. margin: 0 15px; }
  547. .main-menu.menu-dark .navigation > li.open:not(.menu-item-closing) > a, .main-menu.menu-dark .navigation > li.sidebar-group-active > a {
  548. color: #c3c3c3;
  549. background: #0c102a;
  550. border-radius: 6px; }
  551. .main-menu.menu-dark .navigation > li:not(.open) > ul {
  552. display: none; }
  553. .main-menu.menu-dark .navigation > li:not(.open) > ul .active {
  554. background: transparent;
  555. box-shadow: none; }
  556. .main-menu.menu-dark .navigation > li.active {
  557. z-index: 1; }
  558. .main-menu.menu-dark .navigation > li.active > a {
  559. background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7));
  560. box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7);
  561. color: #fff;
  562. font-weight: 400;
  563. border-radius: 4px; }
  564. .main-menu.menu-dark .navigation > li .active {
  565. background: #090d22; }
  566. .main-menu.menu-dark .navigation > li .active > a {
  567. color: #7367f0;
  568. margin-bottom: 0; }
  569. .main-menu.menu-dark .navigation > li .active .hover > a,
  570. .main-menu.menu-dark .navigation > li .active :hover > a {
  571. background: #0c102a; }
  572. .main-menu.menu-dark .navigation > li ul {
  573. padding: 0;
  574. margin: 0; }
  575. .main-menu.menu-dark .navigation > li ul li {
  576. color: #dcdcdc;
  577. background: transparent; }
  578. .main-menu.menu-dark .navigation > li ul li > a {
  579. padding: 10px 15px 10px 20px; }
  580. .main-menu.menu-dark .navigation > li ul li ul a {
  581. padding: 10px 15px 10px 53px; }
  582. .main-menu.menu-dark .navigation > li ul .has-sub:not(.open) > ul {
  583. display: none; }
  584. .main-menu.menu-dark .navigation > li ul .has-sub:not(.open) > ul .active {
  585. background: transparent;
  586. box-shadow: none; }
  587. .main-menu.menu-dark .navigation > li ul .open > a,
  588. .main-menu.menu-dark .navigation > li ul .sidebar-group-active > a {
  589. color: #dcdcdc;
  590. background: #0c102a;
  591. border-radius: 6px; }
  592. .main-menu.menu-dark .navigation > li ul .open > ul,
  593. .main-menu.menu-dark .navigation > li ul .sidebar-group-active > ul {
  594. display: block; }
  595. .main-menu.menu-dark .navigation > li ul .open > ul .open > ul,
  596. .main-menu.menu-dark .navigation > li ul .sidebar-group-active > ul .open > ul {
  597. display: block; }
  598. .main-menu.menu-dark .navigation > li ul .hover > a, .main-menu.menu-dark .navigation > li ul:hover > a {
  599. color: #e6e6e6; }
  600. .main-menu.menu-dark .navigation > li ul .active {
  601. background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7));
  602. box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7);
  603. border-radius: 4px;
  604. z-index: 1; }
  605. .main-menu.menu-dark .navigation > li ul .active > a {
  606. color: #fff; }
  607. .main-menu.menu-fixed {
  608. position: fixed; }
  609. .main-menu.menu-static {
  610. height: 100%;
  611. padding-bottom: calc(100% - 20rem); }
  612. .main-menu.menu-static .main-menu-content {
  613. height: unset !important; }
  614. .main-menu.menu-shadow {
  615. box-shadow: 0 0 15px 0 rgba(34, 41, 47, 0.05); }
  616. .main-menu.menu-border {
  617. border-right: 1px solid #ebe9f1; }
  618. .main-menu .shadow-bottom {
  619. display: none;
  620. position: absolute;
  621. z-index: 2;
  622. height: 50px;
  623. width: 100%;
  624. pointer-events: none;
  625. margin-top: -0.7rem;
  626. filter: blur(5px);
  627. background: linear-gradient(#fff 41%, rgba(255, 255, 255, 0.11) 95%, rgba(255, 255, 255, 0)); }
  628. .bordered-layout .main-menu .shadow-bottom {
  629. background: linear-gradient(#f8f8f8 41%, rgba(255, 255, 255, 0.11) 95%, rgba(255, 255, 255, 0)); }
  630. .main-menu.menu-native-scroll .main-menu-content {
  631. overflow-y: scroll !important; }
  632. .main-menu .navbar-header {
  633. height: 100%;
  634. width: 260px;
  635. height: 4.45rem;
  636. position: relative;
  637. padding: 0.35rem 1rem 0.3rem 1.64rem;
  638. transition: 300ms ease all, background 0s; }
  639. .main-menu .navbar-header .navbar-brand {
  640. display: flex;
  641. align-items: center;
  642. margin-top: 1.35rem;
  643. font-size: inherit; }
  644. .main-menu .navbar-header .navbar-brand .brand-logo img {
  645. max-width: 36px; }
  646. .main-menu .navbar-header .navbar-brand .brand-text {
  647. color: #7367f0;
  648. padding-left: 1rem;
  649. margin-bottom: 0;
  650. font-weight: 600;
  651. letter-spacing: 0.01rem;
  652. font-size: 1.45rem;
  653. animation: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein; }
  654. .main-menu .navbar-header .modern-nav-toggle {
  655. animation: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein; }
  656. .main-menu .main-menu-content {
  657. height: calc(100% - 4.45rem) !important;
  658. position: relative; }
  659. .main-menu .main-menu-content .ps__rail-y {
  660. z-index: 3; }
  661. .main-menu ul {
  662. list-style: none;
  663. margin: 0;
  664. padding: 0; }
  665. .main-menu ul.navigation-main {
  666. overflow-x: hidden;
  667. padding-bottom: 0.75rem; }
  668. .main-menu ul.navigation-main > li:first-child {
  669. margin-top: 0.5rem; }
  670. .main-menu a {
  671. outline: none; }
  672. .main-menu a:hover, .main-menu a:focus {
  673. text-decoration: none; }
  674. .navigation {
  675. font-size: 1.1rem;
  676. font-family: "Montserrat", Helvetica, Arial, serif;
  677. font-weight: 400;
  678. overflow-y: hidden;
  679. padding-bottom: 20px; }
  680. .navigation .navigation-header {
  681. font-family: "Montserrat", Helvetica, Arial, serif;
  682. font-weight: 500;
  683. line-height: 1.2;
  684. padding: 12px 22px;
  685. font-size: 0.9rem;
  686. text-transform: uppercase; }
  687. .navigation li {
  688. position: relative;
  689. white-space: nowrap; }
  690. .navigation li a {
  691. display: block;
  692. text-overflow: ellipsis;
  693. overflow: hidden; }
  694. .navigation li a i,
  695. .navigation li a svg {
  696. height: 11px;
  697. width: 11px;
  698. font-size: 11px;
  699. margin-right: 1.38rem; }
  700. .navigation li.menu-item-animating {
  701. transition: height 0.25s ease-in-out; }
  702. .navigation li.disabled a {
  703. cursor: not-allowed;
  704. opacity: 0.65;
  705. pointer-events: none; }
  706. @media (max-width: 767.98px) {
  707. .menu-hide .main-menu,
  708. .menu-open .main-menu {
  709. transition: transform 0.25s, top 0.35s, height 0.35s; }
  710. .main-menu {
  711. transform: translate3d(-240px, 0, 0);
  712. backface-visibility: hidden;
  713. perspective: 1000; }
  714. .menu-open .main-menu {
  715. transform: translate3d(0, 0, 0); } }
  716. @media (min-width: 768px) {
  717. .drag-target {
  718. z-index: 0; } }
  719. .avatar {
  720. white-space: nowrap;
  721. background-color: #c3c3c3;
  722. border-radius: 50%;
  723. position: relative;
  724. cursor: pointer;
  725. color: #fff;
  726. display: inline-flex;
  727. font-size: 1rem;
  728. text-align: center;
  729. vertical-align: middle;
  730. font-weight: 600; }
  731. .avatar .avatar-content {
  732. width: 32px;
  733. height: 32px;
  734. display: flex;
  735. justify-content: center;
  736. align-items: center;
  737. border-radius: 50%;
  738. font-size: 0.857rem; }
  739. .avatar .avatar-content .avatar-icon {
  740. height: 1rem;
  741. width: 1rem; }
  742. .avatar [class*='avatar-status-'] {
  743. border-radius: 50%;
  744. width: 11px;
  745. height: 11px;
  746. position: absolute;
  747. right: 0;
  748. bottom: 0;
  749. border: 1px solid #fff; }
  750. .avatar [class*='avatar-status-'].avatar-status-lg, .avatar [class*='avatar-status-'].avatar-status-xl {
  751. width: 17px;
  752. height: 17px;
  753. border-width: 2px; }
  754. .avatar .avatar-status-online {
  755. background-color: #28c76f; }
  756. .avatar .avatar-status-busy {
  757. background-color: #ea5455; }
  758. .avatar .avatar-status-away {
  759. background-color: #ff9f43; }
  760. .avatar .avatar-status-offline {
  761. background-color: #82868b; }
  762. .avatar.avatar-tag {
  763. display: flex;
  764. align-items: center;
  765. justify-content: center;
  766. height: 42px;
  767. width: 42px;
  768. border-radius: 0.357rem; }
  769. .avatar img {
  770. border-radius: 50%; }
  771. .avatar.avatar-xl {
  772. font-size: 1.5rem; }
  773. .avatar.avatar-xl img {
  774. width: 70px;
  775. height: 70px; }
  776. .avatar.avatar-xl .avatar-content {
  777. height: 70px;
  778. width: 70px;
  779. font-size: 2.57rem; }
  780. .avatar.avatar-xl .avatar-content .avatar-icon,
  781. .avatar.avatar-xl .avatar-content i,
  782. .avatar.avatar-xl .avatar-content svg {
  783. height: 3rem;
  784. width: 3rem;
  785. font-size: 3rem; }
  786. .avatar.avatar-xl [class*='avatar-status-'] {
  787. right: 3px;
  788. bottom: 0; }
  789. .avatar.avatar-lg {
  790. font-size: 1.2rem; }
  791. .avatar.avatar-lg img {
  792. width: 50px;
  793. height: 50px; }
  794. .avatar.avatar-lg .avatar-content {
  795. width: 50px;
  796. height: 50px;
  797. font-size: 1.714rem; }
  798. .avatar.avatar-lg .avatar-content .avatar-icon,
  799. .avatar.avatar-lg .avatar-content i,
  800. .avatar.avatar-lg .avatar-content svg {
  801. height: 2rem;
  802. width: 2rem;
  803. font-size: 2rem; }
  804. .avatar.avatar-lg [class*='avatar-status-'] {
  805. right: 3px;
  806. bottom: 1px; }
  807. .avatar.avatar-sm .avatar-content {
  808. width: 24px;
  809. height: 24px; }
  810. .avatar.avatar-sm .avatar-content .avatar-icon,
  811. .avatar.avatar-sm .avatar-content i,
  812. .avatar.avatar-sm .avatar-content svg {
  813. height: 1rem;
  814. width: 1rem;
  815. font-size: 1rem; }
  816. .avatar.avatar-sm img {
  817. width: 24px;
  818. height: 24px; }
  819. .avatar.avatar-sm [class*='avatar-status-'] {
  820. right: -3px;
  821. bottom: -2px; }
  822. .avatar-group {
  823. display: flex;
  824. justify-content: flex-start; }
  825. .avatar-group .avatar {
  826. transition: all 0.25s ease; }
  827. .avatar-group .avatar img,
  828. .avatar-group .avatar .avatar-content {
  829. box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px rgba(34, 41, 47, 0.07); }
  830. .avatar-group .avatar .avatar-content {
  831. background-color: #9b9ea2 !important; }
  832. .avatar-group .avatar:hover {
  833. transition: all 0.25s ease; }
  834. .avatar-group .avatar.pull-up:hover {
  835. transform: translateY(-4px) scale(1.07); }
  836. .avatar-group .avatar:not(:first-child) {
  837. margin-left: -0.55rem; }
  838. .avatar-group .avatar-sm:not(:first-child) {
  839. margin-left: -0.4rem; }
  840. .avatar-group .avatar-lg:not(:first-child) {
  841. margin-left: -1rem; }
  842. .avatar-group .avatar-xl:not(:first-child) {
  843. margin-left: -1.5rem; }
  844. /*=========================================================================================
  845. File Name: search.scss
  846. Description: Search functionality.
  847. ----------------------------------------------------------------------------------------
  848. Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
  849. Author: PIXINVENT
  850. Author URL: http://www.themeforest.net/user/pixinvent
  851. ==========================================================================================*/
  852. .navbar-container a.nav-link-search {
  853. float: left; }
  854. .navbar-container .search-input {
  855. width: 0;
  856. float: left;
  857. display: none; }
  858. .navbar-container .search-input input {
  859. width: 0;
  860. border: none;
  861. background: none;
  862. transition: all 0.2s ease-out;
  863. line-height: 16px;
  864. padding: 1.6rem 3.6rem; }
  865. .navbar-container .search-input.open {
  866. position: absolute;
  867. top: 0;
  868. left: 0;
  869. z-index: 1000;
  870. width: 100%;
  871. display: block;
  872. background: #fff;
  873. border-radius: 0.5rem; }
  874. .navbar-container .search-input.open .search-input-close,
  875. .navbar-container .search-input.open .search-input-icon {
  876. display: block; }
  877. .navbar-container .search-input.open input {
  878. width: 100%;
  879. outline: none;
  880. background: none;
  881. height: auto;
  882. box-shadow: none;
  883. transition: all 0.3s ease-out; }
  884. .navbar-container .search-input .search-list {
  885. max-height: 450px;
  886. height: auto;
  887. position: absolute;
  888. top: 100%;
  889. left: 0;
  890. background: #fff;
  891. width: 100%;
  892. margin-top: 0.5rem;
  893. padding-left: 0;
  894. border-radius: 0.357rem;
  895. display: none; }
  896. @media only screen and (min-device-width: 320px) and (max-device-width: 875px) and (orientation: landscape) {
  897. .navbar-container .search-input .search-list {
  898. max-height: 250px; } }
  899. .navbar-container .search-input .search-list.search-list-bookmark {
  900. height: auto !important; }
  901. .navbar-container .search-input .search-list.search-list-bookmark i,
  902. .navbar-container .search-input .search-list.search-list-bookmark svg {
  903. font-size: 1.2rem;
  904. height: 1.2rem;
  905. width: 1.2rem; }
  906. .navbar-container .search-input .search-list.show {
  907. display: block;
  908. min-height: 3rem; }
  909. .navbar-container .search-input .search-list li a {
  910. padding: 0.9rem 1rem;
  911. color: #6e6b7b; }
  912. .navbar-container .search-input .search-list li a i,
  913. .navbar-container .search-input .search-list li a svg[class*='feather feather-'] {
  914. height: 1.25rem;
  915. width: 1.25rem;
  916. font-size: 1.25rem; }
  917. .navbar-container .search-input .search-list li:first-child {
  918. border-top-left-radius: 0.357rem;
  919. border-top-right-radius: 0.357rem; }
  920. .navbar-container .search-input .search-list li:last-child {
  921. border-bottom-left-radius: 0.357rem;
  922. border-bottom-right-radius: 0.357rem; }
  923. .navbar-container .search-input .search-list li.auto-suggestion {
  924. display: flex;
  925. align-items: center;
  926. cursor: pointer; }
  927. .navbar-container .search-input .search-list li.auto-suggestion:hover, .navbar-container .search-input .search-list li.auto-suggestion.current_item {
  928. background-color: #f8f8f8; }
  929. .navbar-container .search-input .search-input-icon {
  930. z-index: 2;
  931. display: none;
  932. position: absolute;
  933. left: 1.5rem;
  934. top: 32%;
  935. cursor: pointer; }
  936. .navbar-container .search-input .search-input-icon i,
  937. .navbar-container .search-input .search-input-icon svg {
  938. height: 1.25rem;
  939. width: 1.25rem;
  940. font-size: 1.25rem; }
  941. .navbar-container .search-input .search-input-close {
  942. z-index: 1;
  943. display: none;
  944. position: absolute;
  945. right: 2rem;
  946. top: 32%;
  947. cursor: pointer; }
  948. .navbar-container .search-input .search-input-close i,
  949. .navbar-container .search-input .search-input-close svg {
  950. height: 1.25rem;
  951. width: 1.25rem;
  952. font-size: 1.25rem; }
  953. .navbar-container .bookmark-input {
  954. position: absolute;
  955. top: 102%;
  956. width: 25%;
  957. display: none;
  958. background: #fff;
  959. border-radius: 0.357rem;
  960. box-shadow: 0 15px 30px 0 rgba(34, 41, 47, 0.11), 0 5px 15px 0 rgba(34, 41, 47, 0.08); }
  961. .navbar-container .bookmark-input.show {
  962. display: block; }
  963. .navbar-container .bookmark-input .bookmark-input-icon {
  964. position: absolute;
  965. z-index: 1;
  966. top: 20px;
  967. left: 24px; }
  968. .navbar-container .bookmark-input input {
  969. padding: 0.7rem 0.7rem 0.7rem 2.5rem;
  970. margin: 12px;
  971. width: calc(100% - 24px);
  972. background: #fff;
  973. border: 1px solid rgba(34, 41, 47, 0.2); }
  974. .navbar-container .bookmark-input input:focus {
  975. border: 1px solid #7367f0; }
  976. .navbar-container .bookmark-input .search-list {
  977. position: relative; }
  978. .navbar-container .bookmark-icon {
  979. cursor: pointer; }
  980. .navbar-container .dropdown.bookmark-dropdown {
  981. padding: 1.4rem 0.5rem 1.35rem; }
  982. .navbar-container .dropdown.bookmark-dropdown .dropdown-toggle:after {
  983. display: none; }
  984. .navbar-container .search-data-title {
  985. line-height: 1.25rem; }
  986. .navbar-dark .search-input .input {
  987. color: #f5f7fa;
  988. border-radius: 0.5rem; }
  989. .navbar-dark .search-input.open .input {
  990. color: #f5f7fa;
  991. border: 1px solid #f5f7fa; }
  992. .navbar-static .navbar-container .search-input.open {
  993. border-radius: 0; }
  994. .btn-social, .btn-social-icon {
  995. position: relative;
  996. padding-left: 4.95rem;
  997. text-align: left;
  998. white-space: nowrap;
  999. overflow: hidden;
  1000. text-overflow: ellipsis; }
  1001. .btn-social > :first-child, .btn-social-icon > :first-child {
  1002. position: absolute;
  1003. left: 0;
  1004. top: 2px;
  1005. bottom: 0;
  1006. width: 2.95rem;
  1007. line-height: 2.7rem;
  1008. font-size: 1rem;
  1009. text-align: center;
  1010. border-right: 1px solid rgba(34, 41, 47, 0.2); }
  1011. .btn-social-icon {
  1012. height: 2.95rem;
  1013. width: 2.95rem;
  1014. padding: 0; }
  1015. .btn-social-icon > :first-child {
  1016. border: none;
  1017. text-align: center;
  1018. width: 100% !important; }
  1019. .btn-adn {
  1020. color: #fff;
  1021. background-color: #d87a68;
  1022. border-color: transparent;
  1023. color: #fff !important;
  1024. border: none; }
  1025. .btn-adn:hover {
  1026. color: #fff;
  1027. background-color: #b86858;
  1028. border-color: rgba(0, 0, 0, 0.2); }
  1029. .btn-check:focus + .btn-adn, .btn-adn:focus {
  1030. color: #fff;
  1031. background-color: #b86858;
  1032. border-color: rgba(0, 0, 0, 0.2);
  1033. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1034. .btn-check:checked + .btn-adn,
  1035. .btn-check:active + .btn-adn, .btn-adn:active, .btn-adn.active,
  1036. .show > .btn-adn.dropdown-toggle {
  1037. color: #fff;
  1038. background-color: #ad6253;
  1039. border-color: rgba(0, 0, 0, 0.25); }
  1040. .btn-check:checked + .btn-adn:focus,
  1041. .btn-check:active + .btn-adn:focus, .btn-adn:active:focus, .btn-adn.active:focus,
  1042. .show > .btn-adn.dropdown-toggle:focus {
  1043. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1044. .btn-adn:disabled, .btn-adn.disabled {
  1045. color: #fff;
  1046. background-color: #d87a68;
  1047. border-color: transparent; }
  1048. .btn-bitbucket {
  1049. color: #fff;
  1050. background-color: #205081;
  1051. border-color: transparent;
  1052. color: #fff !important;
  1053. border: none; }
  1054. .btn-bitbucket:hover {
  1055. color: #fff;
  1056. background-color: #1b446e;
  1057. border-color: rgba(0, 0, 0, 0.2); }
  1058. .btn-check:focus + .btn-bitbucket, .btn-bitbucket:focus {
  1059. color: #fff;
  1060. background-color: #1b446e;
  1061. border-color: rgba(0, 0, 0, 0.2);
  1062. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1063. .btn-check:checked + .btn-bitbucket,
  1064. .btn-check:active + .btn-bitbucket, .btn-bitbucket:active, .btn-bitbucket.active,
  1065. .show > .btn-bitbucket.dropdown-toggle {
  1066. color: #fff;
  1067. background-color: #1a4067;
  1068. border-color: rgba(0, 0, 0, 0.25); }
  1069. .btn-check:checked + .btn-bitbucket:focus,
  1070. .btn-check:active + .btn-bitbucket:focus, .btn-bitbucket:active:focus, .btn-bitbucket.active:focus,
  1071. .show > .btn-bitbucket.dropdown-toggle:focus {
  1072. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1073. .btn-bitbucket:disabled, .btn-bitbucket.disabled {
  1074. color: #fff;
  1075. background-color: #205081;
  1076. border-color: transparent; }
  1077. .btn-dropbox {
  1078. color: #fff;
  1079. background-color: #1087dd;
  1080. border-color: transparent;
  1081. color: #fff !important;
  1082. border: none; }
  1083. .btn-dropbox:hover {
  1084. color: #fff;
  1085. background-color: #0e73bc;
  1086. border-color: rgba(0, 0, 0, 0.2); }
  1087. .btn-check:focus + .btn-dropbox, .btn-dropbox:focus {
  1088. color: #fff;
  1089. background-color: #0e73bc;
  1090. border-color: rgba(0, 0, 0, 0.2);
  1091. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1092. .btn-check:checked + .btn-dropbox,
  1093. .btn-check:active + .btn-dropbox, .btn-dropbox:active, .btn-dropbox.active,
  1094. .show > .btn-dropbox.dropdown-toggle {
  1095. color: #fff;
  1096. background-color: #0d6cb1;
  1097. border-color: rgba(0, 0, 0, 0.25); }
  1098. .btn-check:checked + .btn-dropbox:focus,
  1099. .btn-check:active + .btn-dropbox:focus, .btn-dropbox:active:focus, .btn-dropbox.active:focus,
  1100. .show > .btn-dropbox.dropdown-toggle:focus {
  1101. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1102. .btn-dropbox:disabled, .btn-dropbox.disabled {
  1103. color: #fff;
  1104. background-color: #1087dd;
  1105. border-color: transparent; }
  1106. .btn-facebook {
  1107. color: #fff;
  1108. background-color: #3b5998;
  1109. border-color: transparent;
  1110. color: #fff !important;
  1111. border: none; }
  1112. .btn-facebook:hover {
  1113. color: #fff;
  1114. background-color: #324c81;
  1115. border-color: rgba(0, 0, 0, 0.2); }
  1116. .btn-check:focus + .btn-facebook, .btn-facebook:focus {
  1117. color: #fff;
  1118. background-color: #324c81;
  1119. border-color: rgba(0, 0, 0, 0.2);
  1120. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1121. .btn-check:checked + .btn-facebook,
  1122. .btn-check:active + .btn-facebook, .btn-facebook:active, .btn-facebook.active,
  1123. .show > .btn-facebook.dropdown-toggle {
  1124. color: #fff;
  1125. background-color: #2f477a;
  1126. border-color: rgba(0, 0, 0, 0.25); }
  1127. .btn-check:checked + .btn-facebook:focus,
  1128. .btn-check:active + .btn-facebook:focus, .btn-facebook:active:focus, .btn-facebook.active:focus,
  1129. .show > .btn-facebook.dropdown-toggle:focus {
  1130. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1131. .btn-facebook:disabled, .btn-facebook.disabled {
  1132. color: #fff;
  1133. background-color: #3b5998;
  1134. border-color: transparent; }
  1135. .btn-flickr {
  1136. color: #fff;
  1137. background-color: #ff0084;
  1138. border-color: transparent;
  1139. color: #fff !important;
  1140. border: none; }
  1141. .btn-flickr:hover {
  1142. color: #fff;
  1143. background-color: #d90070;
  1144. border-color: rgba(0, 0, 0, 0.2); }
  1145. .btn-check:focus + .btn-flickr, .btn-flickr:focus {
  1146. color: #fff;
  1147. background-color: #d90070;
  1148. border-color: rgba(0, 0, 0, 0.2);
  1149. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1150. .btn-check:checked + .btn-flickr,
  1151. .btn-check:active + .btn-flickr, .btn-flickr:active, .btn-flickr.active,
  1152. .show > .btn-flickr.dropdown-toggle {
  1153. color: #fff;
  1154. background-color: #cc006a;
  1155. border-color: rgba(0, 0, 0, 0.25); }
  1156. .btn-check:checked + .btn-flickr:focus,
  1157. .btn-check:active + .btn-flickr:focus, .btn-flickr:active:focus, .btn-flickr.active:focus,
  1158. .show > .btn-flickr.dropdown-toggle:focus {
  1159. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1160. .btn-flickr:disabled, .btn-flickr.disabled {
  1161. color: #fff;
  1162. background-color: #ff0084;
  1163. border-color: transparent; }
  1164. .btn-foursquare {
  1165. color: #fff;
  1166. background-color: #f94877;
  1167. border-color: transparent;
  1168. color: #fff !important;
  1169. border: none; }
  1170. .btn-foursquare:hover {
  1171. color: #fff;
  1172. background-color: #d43d65;
  1173. border-color: rgba(0, 0, 0, 0.2); }
  1174. .btn-check:focus + .btn-foursquare, .btn-foursquare:focus {
  1175. color: #fff;
  1176. background-color: #d43d65;
  1177. border-color: rgba(0, 0, 0, 0.2);
  1178. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1179. .btn-check:checked + .btn-foursquare,
  1180. .btn-check:active + .btn-foursquare, .btn-foursquare:active, .btn-foursquare.active,
  1181. .show > .btn-foursquare.dropdown-toggle {
  1182. color: #fff;
  1183. background-color: #c73a5f;
  1184. border-color: rgba(0, 0, 0, 0.25); }
  1185. .btn-check:checked + .btn-foursquare:focus,
  1186. .btn-check:active + .btn-foursquare:focus, .btn-foursquare:active:focus, .btn-foursquare.active:focus,
  1187. .show > .btn-foursquare.dropdown-toggle:focus {
  1188. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1189. .btn-foursquare:disabled, .btn-foursquare.disabled {
  1190. color: #fff;
  1191. background-color: #f94877;
  1192. border-color: transparent; }
  1193. .btn-github {
  1194. color: #fff;
  1195. background-color: #444444;
  1196. border-color: transparent;
  1197. color: #fff !important;
  1198. border: none; }
  1199. .btn-github:hover {
  1200. color: #fff;
  1201. background-color: #3a3a3a;
  1202. border-color: rgba(0, 0, 0, 0.2); }
  1203. .btn-check:focus + .btn-github, .btn-github:focus {
  1204. color: #fff;
  1205. background-color: #3a3a3a;
  1206. border-color: rgba(0, 0, 0, 0.2);
  1207. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1208. .btn-check:checked + .btn-github,
  1209. .btn-check:active + .btn-github, .btn-github:active, .btn-github.active,
  1210. .show > .btn-github.dropdown-toggle {
  1211. color: #fff;
  1212. background-color: #363636;
  1213. border-color: rgba(0, 0, 0, 0.25); }
  1214. .btn-check:checked + .btn-github:focus,
  1215. .btn-check:active + .btn-github:focus, .btn-github:active:focus, .btn-github.active:focus,
  1216. .show > .btn-github.dropdown-toggle:focus {
  1217. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1218. .btn-github:disabled, .btn-github.disabled {
  1219. color: #fff;
  1220. background-color: #444444;
  1221. border-color: transparent; }
  1222. .btn-google {
  1223. color: #fff;
  1224. background-color: #dd4b39;
  1225. border-color: transparent;
  1226. color: #fff !important;
  1227. border: none; }
  1228. .btn-google:hover {
  1229. color: #fff;
  1230. background-color: #bc4030;
  1231. border-color: rgba(0, 0, 0, 0.2); }
  1232. .btn-check:focus + .btn-google, .btn-google:focus {
  1233. color: #fff;
  1234. background-color: #bc4030;
  1235. border-color: rgba(0, 0, 0, 0.2);
  1236. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1237. .btn-check:checked + .btn-google,
  1238. .btn-check:active + .btn-google, .btn-google:active, .btn-google.active,
  1239. .show > .btn-google.dropdown-toggle {
  1240. color: #fff;
  1241. background-color: #b13c2e;
  1242. border-color: rgba(0, 0, 0, 0.25); }
  1243. .btn-check:checked + .btn-google:focus,
  1244. .btn-check:active + .btn-google:focus, .btn-google:active:focus, .btn-google.active:focus,
  1245. .show > .btn-google.dropdown-toggle:focus {
  1246. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1247. .btn-google:disabled, .btn-google.disabled {
  1248. color: #fff;
  1249. background-color: #dd4b39;
  1250. border-color: transparent; }
  1251. .btn-instagram {
  1252. color: #fff;
  1253. background-color: #3f729b;
  1254. border-color: transparent;
  1255. color: #fff !important;
  1256. border: none; }
  1257. .btn-instagram:hover {
  1258. color: #fff;
  1259. background-color: #366184;
  1260. border-color: rgba(0, 0, 0, 0.2); }
  1261. .btn-check:focus + .btn-instagram, .btn-instagram:focus {
  1262. color: #fff;
  1263. background-color: #366184;
  1264. border-color: rgba(0, 0, 0, 0.2);
  1265. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1266. .btn-check:checked + .btn-instagram,
  1267. .btn-check:active + .btn-instagram, .btn-instagram:active, .btn-instagram.active,
  1268. .show > .btn-instagram.dropdown-toggle {
  1269. color: #fff;
  1270. background-color: #325b7c;
  1271. border-color: rgba(0, 0, 0, 0.25); }
  1272. .btn-check:checked + .btn-instagram:focus,
  1273. .btn-check:active + .btn-instagram:focus, .btn-instagram:active:focus, .btn-instagram.active:focus,
  1274. .show > .btn-instagram.dropdown-toggle:focus {
  1275. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1276. .btn-instagram:disabled, .btn-instagram.disabled {
  1277. color: #fff;
  1278. background-color: #3f729b;
  1279. border-color: transparent; }
  1280. .btn-linkedin {
  1281. color: #fff;
  1282. background-color: #007bb6;
  1283. border-color: transparent;
  1284. color: #fff !important;
  1285. border: none; }
  1286. .btn-linkedin:hover {
  1287. color: #fff;
  1288. background-color: #00699b;
  1289. border-color: rgba(0, 0, 0, 0.2); }
  1290. .btn-check:focus + .btn-linkedin, .btn-linkedin:focus {
  1291. color: #fff;
  1292. background-color: #00699b;
  1293. border-color: rgba(0, 0, 0, 0.2);
  1294. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1295. .btn-check:checked + .btn-linkedin,
  1296. .btn-check:active + .btn-linkedin, .btn-linkedin:active, .btn-linkedin.active,
  1297. .show > .btn-linkedin.dropdown-toggle {
  1298. color: #fff;
  1299. background-color: #006292;
  1300. border-color: rgba(0, 0, 0, 0.25); }
  1301. .btn-check:checked + .btn-linkedin:focus,
  1302. .btn-check:active + .btn-linkedin:focus, .btn-linkedin:active:focus, .btn-linkedin.active:focus,
  1303. .show > .btn-linkedin.dropdown-toggle:focus {
  1304. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1305. .btn-linkedin:disabled, .btn-linkedin.disabled {
  1306. color: #fff;
  1307. background-color: #007bb6;
  1308. border-color: transparent; }
  1309. .btn-microsoft {
  1310. color: #fff;
  1311. background-color: #2672ec;
  1312. border-color: transparent;
  1313. color: #fff !important;
  1314. border: none; }
  1315. .btn-microsoft:hover {
  1316. color: #fff;
  1317. background-color: #2061c9;
  1318. border-color: rgba(0, 0, 0, 0.2); }
  1319. .btn-check:focus + .btn-microsoft, .btn-microsoft:focus {
  1320. color: #fff;
  1321. background-color: #2061c9;
  1322. border-color: rgba(0, 0, 0, 0.2);
  1323. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1324. .btn-check:checked + .btn-microsoft,
  1325. .btn-check:active + .btn-microsoft, .btn-microsoft:active, .btn-microsoft.active,
  1326. .show > .btn-microsoft.dropdown-toggle {
  1327. color: #fff;
  1328. background-color: #1e5bbd;
  1329. border-color: rgba(0, 0, 0, 0.25); }
  1330. .btn-check:checked + .btn-microsoft:focus,
  1331. .btn-check:active + .btn-microsoft:focus, .btn-microsoft:active:focus, .btn-microsoft.active:focus,
  1332. .show > .btn-microsoft.dropdown-toggle:focus {
  1333. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1334. .btn-microsoft:disabled, .btn-microsoft.disabled {
  1335. color: #fff;
  1336. background-color: #2672ec;
  1337. border-color: transparent; }
  1338. .btn-odnoklassniki {
  1339. color: #22292f;
  1340. background-color: #f4731c;
  1341. border-color: transparent;
  1342. color: #fff !important;
  1343. border: none; }
  1344. .btn-odnoklassniki:hover {
  1345. color: #22292f;
  1346. background-color: #f6883e;
  1347. border-color: rgba(255, 255, 255, 0.1); }
  1348. .btn-check:focus + .btn-odnoklassniki, .btn-odnoklassniki:focus {
  1349. color: #22292f;
  1350. background-color: #f6883e;
  1351. border-color: rgba(255, 255, 255, 0.1);
  1352. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1353. .btn-check:checked + .btn-odnoklassniki,
  1354. .btn-check:active + .btn-odnoklassniki, .btn-odnoklassniki:active, .btn-odnoklassniki.active,
  1355. .show > .btn-odnoklassniki.dropdown-toggle {
  1356. color: #22292f;
  1357. background-color: #f68f49;
  1358. border-color: rgba(255, 255, 255, 0.1); }
  1359. .btn-check:checked + .btn-odnoklassniki:focus,
  1360. .btn-check:active + .btn-odnoklassniki:focus, .btn-odnoklassniki:active:focus, .btn-odnoklassniki.active:focus,
  1361. .show > .btn-odnoklassniki.dropdown-toggle:focus {
  1362. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1363. .btn-odnoklassniki:disabled, .btn-odnoklassniki.disabled {
  1364. color: #22292f;
  1365. background-color: #f4731c;
  1366. border-color: transparent; }
  1367. .btn-openid {
  1368. color: #22292f;
  1369. background-color: #f7931e;
  1370. border-color: transparent;
  1371. color: #fff !important;
  1372. border: none; }
  1373. .btn-openid:hover {
  1374. color: #22292f;
  1375. background-color: #f8a340;
  1376. border-color: rgba(255, 255, 255, 0.1); }
  1377. .btn-check:focus + .btn-openid, .btn-openid:focus {
  1378. color: #22292f;
  1379. background-color: #f8a340;
  1380. border-color: rgba(255, 255, 255, 0.1);
  1381. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1382. .btn-check:checked + .btn-openid,
  1383. .btn-check:active + .btn-openid, .btn-openid:active, .btn-openid.active,
  1384. .show > .btn-openid.dropdown-toggle {
  1385. color: #22292f;
  1386. background-color: #f9a94b;
  1387. border-color: rgba(255, 255, 255, 0.1); }
  1388. .btn-check:checked + .btn-openid:focus,
  1389. .btn-check:active + .btn-openid:focus, .btn-openid:active:focus, .btn-openid.active:focus,
  1390. .show > .btn-openid.dropdown-toggle:focus {
  1391. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1392. .btn-openid:disabled, .btn-openid.disabled {
  1393. color: #22292f;
  1394. background-color: #f7931e;
  1395. border-color: transparent; }
  1396. .btn-pinterest {
  1397. color: #fff;
  1398. background-color: #cb2027;
  1399. border-color: transparent;
  1400. color: #fff !important;
  1401. border: none; }
  1402. .btn-pinterest:hover {
  1403. color: #fff;
  1404. background-color: #ad1b21;
  1405. border-color: rgba(0, 0, 0, 0.2); }
  1406. .btn-check:focus + .btn-pinterest, .btn-pinterest:focus {
  1407. color: #fff;
  1408. background-color: #ad1b21;
  1409. border-color: rgba(0, 0, 0, 0.2);
  1410. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1411. .btn-check:checked + .btn-pinterest,
  1412. .btn-check:active + .btn-pinterest, .btn-pinterest:active, .btn-pinterest.active,
  1413. .show > .btn-pinterest.dropdown-toggle {
  1414. color: #fff;
  1415. background-color: #a21a1f;
  1416. border-color: rgba(0, 0, 0, 0.25); }
  1417. .btn-check:checked + .btn-pinterest:focus,
  1418. .btn-check:active + .btn-pinterest:focus, .btn-pinterest:active:focus, .btn-pinterest.active:focus,
  1419. .show > .btn-pinterest.dropdown-toggle:focus {
  1420. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1421. .btn-pinterest:disabled, .btn-pinterest.disabled {
  1422. color: #fff;
  1423. background-color: #cb2027;
  1424. border-color: transparent; }
  1425. .btn-reddit {
  1426. color: #22292f;
  1427. background-color: #eff7ff;
  1428. border-color: transparent;
  1429. color: #fff !important;
  1430. border: none; }
  1431. .btn-reddit:hover {
  1432. color: #22292f;
  1433. background-color: #f1f8ff;
  1434. border-color: rgba(255, 255, 255, 0.1); }
  1435. .btn-check:focus + .btn-reddit, .btn-reddit:focus {
  1436. color: #22292f;
  1437. background-color: #f1f8ff;
  1438. border-color: rgba(255, 255, 255, 0.1);
  1439. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1440. .btn-check:checked + .btn-reddit,
  1441. .btn-check:active + .btn-reddit, .btn-reddit:active, .btn-reddit.active,
  1442. .show > .btn-reddit.dropdown-toggle {
  1443. color: #22292f;
  1444. background-color: #f2f9ff;
  1445. border-color: rgba(255, 255, 255, 0.1); }
  1446. .btn-check:checked + .btn-reddit:focus,
  1447. .btn-check:active + .btn-reddit:focus, .btn-reddit:active:focus, .btn-reddit.active:focus,
  1448. .show > .btn-reddit.dropdown-toggle:focus {
  1449. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1450. .btn-reddit:disabled, .btn-reddit.disabled {
  1451. color: #22292f;
  1452. background-color: #eff7ff;
  1453. border-color: transparent; }
  1454. .btn-soundcloud {
  1455. color: #fff;
  1456. background-color: #ff5500;
  1457. border-color: transparent;
  1458. color: #fff !important;
  1459. border: none; }
  1460. .btn-soundcloud:hover {
  1461. color: #fff;
  1462. background-color: #d94800;
  1463. border-color: rgba(0, 0, 0, 0.2); }
  1464. .btn-check:focus + .btn-soundcloud, .btn-soundcloud:focus {
  1465. color: #fff;
  1466. background-color: #d94800;
  1467. border-color: rgba(0, 0, 0, 0.2);
  1468. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1469. .btn-check:checked + .btn-soundcloud,
  1470. .btn-check:active + .btn-soundcloud, .btn-soundcloud:active, .btn-soundcloud.active,
  1471. .show > .btn-soundcloud.dropdown-toggle {
  1472. color: #fff;
  1473. background-color: #cc4400;
  1474. border-color: rgba(0, 0, 0, 0.25); }
  1475. .btn-check:checked + .btn-soundcloud:focus,
  1476. .btn-check:active + .btn-soundcloud:focus, .btn-soundcloud:active:focus, .btn-soundcloud.active:focus,
  1477. .show > .btn-soundcloud.dropdown-toggle:focus {
  1478. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1479. .btn-soundcloud:disabled, .btn-soundcloud.disabled {
  1480. color: #fff;
  1481. background-color: #ff5500;
  1482. border-color: transparent; }
  1483. .btn-tumblr {
  1484. color: #fff;
  1485. background-color: #2c4762;
  1486. border-color: transparent;
  1487. color: #fff !important;
  1488. border: none; }
  1489. .btn-tumblr:hover {
  1490. color: #fff;
  1491. background-color: #253c53;
  1492. border-color: rgba(0, 0, 0, 0.2); }
  1493. .btn-check:focus + .btn-tumblr, .btn-tumblr:focus {
  1494. color: #fff;
  1495. background-color: #253c53;
  1496. border-color: rgba(0, 0, 0, 0.2);
  1497. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1498. .btn-check:checked + .btn-tumblr,
  1499. .btn-check:active + .btn-tumblr, .btn-tumblr:active, .btn-tumblr.active,
  1500. .show > .btn-tumblr.dropdown-toggle {
  1501. color: #fff;
  1502. background-color: #23394e;
  1503. border-color: rgba(0, 0, 0, 0.25); }
  1504. .btn-check:checked + .btn-tumblr:focus,
  1505. .btn-check:active + .btn-tumblr:focus, .btn-tumblr:active:focus, .btn-tumblr.active:focus,
  1506. .show > .btn-tumblr.dropdown-toggle:focus {
  1507. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1508. .btn-tumblr:disabled, .btn-tumblr.disabled {
  1509. color: #fff;
  1510. background-color: #2c4762;
  1511. border-color: transparent; }
  1512. .btn-twitter {
  1513. color: #22292f;
  1514. background-color: #55acee;
  1515. border-color: transparent;
  1516. color: #fff !important;
  1517. border: none; }
  1518. .btn-twitter:hover {
  1519. color: #22292f;
  1520. background-color: #6fb8f1;
  1521. border-color: rgba(255, 255, 255, 0.1); }
  1522. .btn-check:focus + .btn-twitter, .btn-twitter:focus {
  1523. color: #22292f;
  1524. background-color: #6fb8f1;
  1525. border-color: rgba(255, 255, 255, 0.1);
  1526. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1527. .btn-check:checked + .btn-twitter,
  1528. .btn-check:active + .btn-twitter, .btn-twitter:active, .btn-twitter.active,
  1529. .show > .btn-twitter.dropdown-toggle {
  1530. color: #22292f;
  1531. background-color: #77bdf1;
  1532. border-color: rgba(255, 255, 255, 0.1); }
  1533. .btn-check:checked + .btn-twitter:focus,
  1534. .btn-check:active + .btn-twitter:focus, .btn-twitter:active:focus, .btn-twitter.active:focus,
  1535. .show > .btn-twitter.dropdown-toggle:focus {
  1536. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1537. .btn-twitter:disabled, .btn-twitter.disabled {
  1538. color: #22292f;
  1539. background-color: #55acee;
  1540. border-color: transparent; }
  1541. .btn-vimeo {
  1542. color: #22292f;
  1543. background-color: #1ab7ea;
  1544. border-color: transparent;
  1545. color: #fff !important;
  1546. border: none; }
  1547. .btn-vimeo:hover {
  1548. color: #22292f;
  1549. background-color: #3cc2ed;
  1550. border-color: rgba(255, 255, 255, 0.1); }
  1551. .btn-check:focus + .btn-vimeo, .btn-vimeo:focus {
  1552. color: #22292f;
  1553. background-color: #3cc2ed;
  1554. border-color: rgba(255, 255, 255, 0.1);
  1555. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1556. .btn-check:checked + .btn-vimeo,
  1557. .btn-check:active + .btn-vimeo, .btn-vimeo:active, .btn-vimeo.active,
  1558. .show > .btn-vimeo.dropdown-toggle {
  1559. color: #22292f;
  1560. background-color: #48c5ee;
  1561. border-color: rgba(255, 255, 255, 0.1); }
  1562. .btn-check:checked + .btn-vimeo:focus,
  1563. .btn-check:active + .btn-vimeo:focus, .btn-vimeo:active:focus, .btn-vimeo.active:focus,
  1564. .show > .btn-vimeo.dropdown-toggle:focus {
  1565. box-shadow: 0 0 0 0.25rem rgba(34, 41, 47, 0.5); }
  1566. .btn-vimeo:disabled, .btn-vimeo.disabled {
  1567. color: #22292f;
  1568. background-color: #1ab7ea;
  1569. border-color: transparent; }
  1570. .btn-vk {
  1571. color: #fff;
  1572. background-color: #587ea3;
  1573. border-color: transparent;
  1574. color: #fff !important;
  1575. border: none; }
  1576. .btn-vk:hover {
  1577. color: #fff;
  1578. background-color: #4b6b8b;
  1579. border-color: rgba(0, 0, 0, 0.2); }
  1580. .btn-check:focus + .btn-vk, .btn-vk:focus {
  1581. color: #fff;
  1582. background-color: #4b6b8b;
  1583. border-color: rgba(0, 0, 0, 0.2);
  1584. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1585. .btn-check:checked + .btn-vk,
  1586. .btn-check:active + .btn-vk, .btn-vk:active, .btn-vk.active,
  1587. .show > .btn-vk.dropdown-toggle {
  1588. color: #fff;
  1589. background-color: #466582;
  1590. border-color: rgba(0, 0, 0, 0.25); }
  1591. .btn-check:checked + .btn-vk:focus,
  1592. .btn-check:active + .btn-vk:focus, .btn-vk:active:focus, .btn-vk.active:focus,
  1593. .show > .btn-vk.dropdown-toggle:focus {
  1594. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1595. .btn-vk:disabled, .btn-vk.disabled {
  1596. color: #fff;
  1597. background-color: #587ea3;
  1598. border-color: transparent; }
  1599. .btn-yahoo {
  1600. color: #fff;
  1601. background-color: #720e9e;
  1602. border-color: transparent;
  1603. color: #fff !important;
  1604. border: none; }
  1605. .btn-yahoo:hover {
  1606. color: #fff;
  1607. background-color: #610c86;
  1608. border-color: rgba(0, 0, 0, 0.2); }
  1609. .btn-check:focus + .btn-yahoo, .btn-yahoo:focus {
  1610. color: #fff;
  1611. background-color: #610c86;
  1612. border-color: rgba(0, 0, 0, 0.2);
  1613. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1614. .btn-check:checked + .btn-yahoo,
  1615. .btn-check:active + .btn-yahoo, .btn-yahoo:active, .btn-yahoo.active,
  1616. .show > .btn-yahoo.dropdown-toggle {
  1617. color: #fff;
  1618. background-color: #5b0b7e;
  1619. border-color: rgba(0, 0, 0, 0.25); }
  1620. .btn-check:checked + .btn-yahoo:focus,
  1621. .btn-check:active + .btn-yahoo:focus, .btn-yahoo:active:focus, .btn-yahoo.active:focus,
  1622. .show > .btn-yahoo.dropdown-toggle:focus {
  1623. box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); }
  1624. .btn-yahoo:disabled, .btn-yahoo.disabled {
  1625. color: #fff;
  1626. background-color: #720e9e;
  1627. border-color: transparent; }
  1628. .btn-outline-adn {
  1629. border: 1px solid #d87a68 !important;
  1630. color: #d87a68; }
  1631. .btn-outline-bitbucket {
  1632. border: 1px solid #205081 !important;
  1633. color: #205081; }
  1634. .btn-outline-dropbox {
  1635. border: 1px solid #1087dd !important;
  1636. color: #1087dd; }
  1637. .btn-outline-facebook {
  1638. border: 1px solid #3b5998 !important;
  1639. color: #3b5998; }
  1640. .btn-outline-flickr {
  1641. border: 1px solid #ff0084 !important;
  1642. color: #ff0084; }
  1643. .btn-outline-foursquare {
  1644. border: 1px solid #f94877 !important;
  1645. color: #f94877; }
  1646. .btn-outline-github {
  1647. border: 1px solid #444444 !important;
  1648. color: #444444; }
  1649. .btn-outline-google {
  1650. border: 1px solid #dd4b39 !important;
  1651. color: #dd4b39; }
  1652. .btn-outline-instagram {
  1653. border: 1px solid #3f729b !important;
  1654. color: #3f729b; }
  1655. .btn-outline-linkedin {
  1656. border: 1px solid #007bb6 !important;
  1657. color: #007bb6; }
  1658. .btn-outline-microsoft {
  1659. border: 1px solid #2672ec !important;
  1660. color: #2672ec; }
  1661. .btn-outline-odnoklassniki {
  1662. border: 1px solid #f4731c !important;
  1663. color: #f4731c; }
  1664. .btn-outline-openid {
  1665. border: 1px solid #f7931e !important;
  1666. color: #f7931e; }
  1667. .btn-outline-pinterest {
  1668. border: 1px solid #cb2027 !important;
  1669. color: #cb2027; }
  1670. .btn-outline-reddit {
  1671. border: 1px solid #ff4500 !important;
  1672. color: #ff4500; }
  1673. .btn-outline-soundcloud {
  1674. border: 1px solid #ff5500 !important;
  1675. color: #ff5500; }
  1676. .btn-outline-tumblr {
  1677. border: 1px solid #2c4762 !important;
  1678. color: #2c4762; }
  1679. .btn-outline-twitter {
  1680. border: 1px solid #55acee !important;
  1681. color: #55acee; }
  1682. .btn-outline-vimeo {
  1683. border: 1px solid #1ab7ea !important;
  1684. color: #1ab7ea; }
  1685. .btn-outline-vk {
  1686. border: 1px solid #587ea3 !important;
  1687. color: #587ea3; }
  1688. .btn-outline-yahoo {
  1689. border: 1px solid #720e9e !important;
  1690. color: #720e9e; }
  1691. .btn-outline-adn:hover {
  1692. color: #ad6253;
  1693. border: 1px solid #ad6253 !important; }
  1694. .btn-outline-bitbucket:hover {
  1695. color: #1a4067;
  1696. border: 1px solid #1a4067 !important; }
  1697. .btn-outline-dropbox:hover {
  1698. color: #0d6cb1;
  1699. border: 1px solid #0d6cb1 !important; }
  1700. .btn-outline-facebook:hover {
  1701. color: #2f477a;
  1702. border: 1px solid #2f477a !important; }
  1703. .btn-outline-flickr:hover {
  1704. color: #cc006a;
  1705. border: 1px solid #cc006a !important; }
  1706. .btn-outline-foursquare:hover {
  1707. color: #c73a5f;
  1708. border: 1px solid #c73a5f !important; }
  1709. .btn-outline-github:hover {
  1710. color: #363636;
  1711. border: 1px solid #363636 !important; }
  1712. .btn-outline-google:hover {
  1713. color: #b13c2e;
  1714. border: 1px solid #b13c2e !important; }
  1715. .btn-outline-instagram:hover {
  1716. color: #325b7c;
  1717. border: 1px solid #325b7c !important; }
  1718. .btn-outline-linkedin:hover {
  1719. color: #006292;
  1720. border: 1px solid #006292 !important; }
  1721. .btn-outline-microsoft:hover {
  1722. color: #1e5bbd;
  1723. border: 1px solid #1e5bbd !important; }
  1724. .btn-outline-odnoklassniki:hover {
  1725. color: #c35c16;
  1726. border: 1px solid #c35c16 !important; }
  1727. .btn-outline-openid:hover {
  1728. color: #c67618;
  1729. border: 1px solid #c67618 !important; }
  1730. .btn-outline-pinterest:hover {
  1731. color: #a21a1f;
  1732. border: 1px solid #a21a1f !important; }
  1733. .btn-outline-reddit:hover {
  1734. color: #cc3700;
  1735. border: 1px solid #cc3700 !important; }
  1736. .btn-outline-soundcloud:hover {
  1737. color: #cc4400;
  1738. border: 1px solid #cc4400 !important; }
  1739. .btn-outline-tumblr:hover {
  1740. color: #23394e;
  1741. border: 1px solid #23394e !important; }
  1742. .btn-outline-twitter:hover {
  1743. color: #448abe;
  1744. border: 1px solid #448abe !important; }
  1745. .btn-outline-vimeo:hover {
  1746. color: #1592bb;
  1747. border: 1px solid #1592bb !important; }
  1748. .btn-outline-vk:hover {
  1749. color: #466582;
  1750. border: 1px solid #466582 !important; }
  1751. .btn-outline-yahoo:hover {
  1752. color: #5b0b7e;
  1753. border: 1px solid #5b0b7e !important; }
  1754. .bg-adn {
  1755. background-color: #d87a68; }
  1756. .bg-bitbucket {
  1757. background-color: #205081; }
  1758. .bg-dropbox {
  1759. background-color: #1087dd; }
  1760. .bg-facebook {
  1761. background-color: #3b5998; }
  1762. .bg-flickr {
  1763. background-color: #ff0084; }
  1764. .bg-foursquare {
  1765. background-color: #f94877; }
  1766. .bg-github {
  1767. background-color: #444444; }
  1768. .bg-google {
  1769. background-color: #dd4b39; }
  1770. .bg-instagram {
  1771. background-color: #3f729b; }
  1772. .bg-linkedin {
  1773. background-color: #007bb6; }
  1774. .bg-microsoft {
  1775. background-color: #2672ec; }
  1776. .bg-odnoklassniki {
  1777. background-color: #f4731c; }
  1778. .bg-openid {
  1779. background-color: #f7931e; }
  1780. .bg-pinterest {
  1781. background-color: #cb2027; }
  1782. .bg-reddit {
  1783. background-color: #ff4500; }
  1784. .bg-soundcloud {
  1785. background-color: #ff5500; }
  1786. .bg-tumblr {
  1787. background-color: #2c4762; }
  1788. .bg-twitter {
  1789. background-color: #55acee; }
  1790. .bg-vimeo {
  1791. background-color: #1ab7ea; }
  1792. .bg-vk {
  1793. background-color: #587ea3; }
  1794. .bg-yahoo {
  1795. background-color: #720e9e; }
  1796. /*=========================================================================================
  1797. File Name: demo.scss
  1798. Description: CSS used for demo purpose only. Remove this css from your project.
  1799. ----------------------------------------------------------------------------------------
  1800. Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
  1801. Author: PIXINVENT
  1802. Author URL: http://www.themeforest.net/user/pixinvent
  1803. ==========================================================================================*/
  1804. .demo-inline-spacing {
  1805. display: flex;
  1806. flex-wrap: wrap;
  1807. justify-content: flex-start;
  1808. align-items: center; }
  1809. .demo-inline-spacing > * {
  1810. margin-right: 1.5rem;
  1811. margin-top: 1.5rem; }
  1812. .demo-vertical-spacing > * {
  1813. margin: 0;
  1814. margin-bottom: 1.5rem; }
  1815. .demo-vertical-spacing > *:last-child {
  1816. margin: 0; }
  1817. .demo-spacing-0 > *:last-child {
  1818. margin: 0; }
  1819. .icon-wrapper .feather {
  1820. height: 24px;
  1821. width: 24px; }
  1822. .scroll-example {
  1823. padding: 0.5rem;
  1824. position: relative;
  1825. border: 2px solid #dfdfdf;
  1826. overflow: auto; }
  1827. .scroll-example .horz-scroll-content {
  1828. width: 1200px; }
  1829. .browser {
  1830. background: #e0e0e0;
  1831. border: 4px solid #e0e0e0;
  1832. width: 100%;
  1833. height: 12rem;
  1834. padding-top: 20px;
  1835. margin: 0 0 10px;
  1836. -webkit-box-sizing: border-box;
  1837. -moz-box-sizing: border-box;
  1838. box-sizing: border-box; }
  1839. .browser iframe {
  1840. border: 0;
  1841. background: #fff;
  1842. height: 100%;
  1843. width: 100%; }
  1844. .loader-wrapper {
  1845. height: 8em; }
  1846. .maintenance-icon {
  1847. font-size: 4rem; }
  1848. .animationIcon {
  1849. right: 30px;
  1850. bottom: 10px; }
  1851. #component-breadcrumbs .breadcrumb:not(last-child) {
  1852. margin-bottom: .5rem; }
  1853. #breadcrumb-alignment .breadcrumb-wrapper {
  1854. box-shadow: 1px 1px 10px rgba(34, 41, 47, 0.1);
  1855. padding: 1px;
  1856. border-radius: 0.357rem; }
  1857. #breadcrumb-alignment .breadcrumb-wrapper .breadcrumb {
  1858. margin-top: 0.8rem;
  1859. margin-bottom: 0.8rem; }
  1860. .dark-layout #breadcrumb-alignment .breadcrumb-wrapper {
  1861. box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.24); }
  1862. .buy-now {
  1863. position: fixed;
  1864. bottom: 5%;
  1865. right: 79px;
  1866. z-index: 1031; }
  1867. .buy-now .btn {
  1868. box-shadow: 0 1px 20px 1px #ea5455 !important; }
  1869. .buy-now .btn:hover {
  1870. box-shadow: none !important; }
  1871. /*=========================================================================================
  1872. File Name: customizer.scss
  1873. Description: CSS used for demo purpose only. Remove this css from your project.
  1874. ----------------------------------------------------------------------------------------
  1875. Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
  1876. Author: PIXINVENT
  1877. Author URL: http://www.themeforest.net/user/pixinvent
  1878. ==========================================================================================*/
  1879. .customizer {
  1880. width: 400px;
  1881. right: -400px;
  1882. padding: 0;
  1883. background-color: #fff;
  1884. z-index: 1051;
  1885. position: fixed;
  1886. top: 0;
  1887. bottom: 0;
  1888. height: 100vh;
  1889. height: calc(var(--vh, 1vh) * 100);
  1890. transition: right 0.4s cubic-bezier(0.05, 0.74, 0.2, 0.99);
  1891. backface-visibility: hidden;
  1892. border-left: 1px solid rgba(34, 41, 47, 0.05); }
  1893. .customizer.open {
  1894. box-shadow: 0 15px 30px 0 rgba(34, 41, 47, 0.11), 0 5px 15px 0 rgba(34, 41, 47, 0.08);
  1895. right: 0; }
  1896. .customizer .customizer-content {
  1897. position: relative;
  1898. height: 100%; }
  1899. .customizer .customizer-close {
  1900. position: absolute;
  1901. right: 0.6rem;
  1902. top: 0.6rem;
  1903. padding: 7px;
  1904. width: auto;
  1905. z-index: 10;
  1906. color: #5e5873; }
  1907. .customizer .customizer-close i,
  1908. .customizer .customizer-close svg {
  1909. font-size: 1.5rem;
  1910. height: 1.5rem;
  1911. width: 1.5rem; }
  1912. .customizer .customizer-toggle {
  1913. background: #7367f0;
  1914. color: #fff !important;
  1915. display: block;
  1916. box-shadow: -3px 0px 8px rgba(34, 41, 47, 0.1);
  1917. border-top-left-radius: 6px;
  1918. border-bottom-left-radius: 6px;
  1919. position: absolute;
  1920. top: 50%;
  1921. width: 38px;
  1922. height: 38px;
  1923. left: -39px;
  1924. text-align: center;
  1925. line-height: 40px;
  1926. cursor: pointer; }
  1927. .customizer .color-box {
  1928. height: 24px;
  1929. width: 24px;
  1930. margin: 0.5rem;
  1931. border-radius: 0.5rem;
  1932. cursor: pointer;
  1933. position: relative; }
  1934. .customizer .color-box.selected:after {
  1935. content: '';
  1936. border: 1px solid #7367f0;
  1937. height: 30px;
  1938. width: 30px;
  1939. top: -3px;
  1940. left: -3px;
  1941. position: absolute;
  1942. border-radius: 0.5rem; }
  1943. .customizer .color-box.selected.border:after {
  1944. top: -4px;
  1945. left: -4px; }
  1946. .divider {
  1947. display: block;
  1948. text-align: center;
  1949. overflow: hidden;
  1950. white-space: nowrap;
  1951. margin: 1rem 0; }
  1952. .divider .divider-text {
  1953. position: relative;
  1954. display: inline-block;
  1955. font-size: 0.9375rem;
  1956. padding: 0 1rem; }
  1957. .divider .divider-text i,
  1958. .divider .divider-text svg {
  1959. height: 1rem;
  1960. width: 1rem;
  1961. font-size: 1rem; }
  1962. .divider .divider-text:before, .divider .divider-text:after {
  1963. content: '';
  1964. position: absolute;
  1965. top: 50%;
  1966. width: 9999px;
  1967. border-top: 1px solid #ebe9f1; }
  1968. .divider .divider-text:before {
  1969. right: 100%; }
  1970. .divider .divider-text:after {
  1971. left: 100%; }
  1972. .divider.divider-start .divider-text {
  1973. float: left;
  1974. padding-left: 0; }
  1975. .divider.divider-start .divider-text:before {
  1976. display: none; }
  1977. .divider.divider-start-center .divider-text {
  1978. left: -25%; }
  1979. .divider.divider-end .divider-text {
  1980. float: right;
  1981. padding-right: 0; }
  1982. .divider.divider-end .divider-text:after {
  1983. display: none; }
  1984. .divider.divider-end-center .divider-text {
  1985. right: -25%; }
  1986. .divider.divider-dotted .divider-text:before, .divider.divider-dotted .divider-text:after {
  1987. border-style: dotted;
  1988. border-width: 1px;
  1989. border-top-width: 0;
  1990. border-color: #ebe9f1; }
  1991. .divider.divider-dashed .divider-text:before, .divider.divider-dashed .divider-text:after {
  1992. border-style: dashed;
  1993. border-width: 1px;
  1994. border-top-width: 0;
  1995. border-color: #ebe9f1; }
  1996. .timeline {
  1997. padding: 0;
  1998. margin-bottom: 0;
  1999. margin-left: 1rem;
  2000. list-style: none; }
  2001. .timeline .timeline-item {
  2002. position: relative;
  2003. padding-left: 2.5rem;
  2004. border-left: 1px solid #ebe9f1; }
  2005. .timeline .timeline-item:not(:last-child) {
  2006. padding-bottom: 1.8rem; }
  2007. .timeline .timeline-item .timeline-point {
  2008. position: absolute;
  2009. left: -0.85rem;
  2010. top: 0;
  2011. z-index: 2;
  2012. display: flex;
  2013. justify-content: center;
  2014. align-items: center;
  2015. height: 1.75rem;
  2016. width: 1.75rem;
  2017. text-align: center;
  2018. border-radius: 50%;
  2019. border: 1px solid #7367f0;
  2020. background-color: #fff; }
  2021. .timeline .timeline-item .timeline-point.timeline-point-indicator {
  2022. left: -0.412rem;
  2023. top: 0.07rem;
  2024. height: 12px;
  2025. width: 12px;
  2026. border: 0;
  2027. background-color: #7367f0; }
  2028. .timeline .timeline-item .timeline-point.timeline-point-indicator:before {
  2029. content: '';
  2030. background: rgba(115, 103, 240, 0.12);
  2031. height: 20px;
  2032. width: 20px;
  2033. display: block;
  2034. position: absolute;
  2035. top: -0.285rem;
  2036. left: -0.285rem;
  2037. border-radius: 50%; }
  2038. .timeline .timeline-item .timeline-point i,
  2039. .timeline .timeline-item .timeline-point svg {
  2040. color: #7367f0;
  2041. font-size: 0.85rem;
  2042. vertical-align: baseline; }
  2043. .timeline .timeline-item .timeline-event {
  2044. position: relative;
  2045. width: 100%;
  2046. min-height: 4rem; }
  2047. .timeline .timeline-item .timeline-event .timeline-event-time {
  2048. font-size: 0.85rem;
  2049. color: #b9b9c3; }
  2050. .timeline .timeline-item:last-of-type {
  2051. border-left-color: transparent !important; }
  2052. .timeline .timeline-item:last-of-type:after {
  2053. content: '';
  2054. position: absolute;
  2055. left: -1px;
  2056. bottom: 0;
  2057. width: 1px;
  2058. height: 100%;
  2059. background: linear-gradient(#ebe9f1, transparent); }
  2060. @media screen and (min-width: 0px) {
  2061. head {
  2062. font-family: "xs 0px"; }
  2063. body:after {
  2064. content: "xs - min-width: 0px"; } }
  2065. @media screen and (min-width: 544px) {
  2066. head {
  2067. font-family: "sm 544px"; }
  2068. body:after {
  2069. content: "sm - min-width: 544px"; } }
  2070. @media screen and (min-width: 768px) {
  2071. head {
  2072. font-family: "md 768px"; }
  2073. body:after {
  2074. content: "md - min-width: 768px"; } }
  2075. @media screen and (min-width: 992px) {
  2076. head {
  2077. font-family: "lg 992px"; }
  2078. body:after {
  2079. content: "lg - min-width: 992px"; } }
  2080. @media screen and (min-width: 1200px) {
  2081. head {
  2082. font-family: "xl 1200px"; }
  2083. body:after {
  2084. content: "xl - min-width: 1200px"; } }
  2085. head {
  2086. clear: both; }
  2087. head title {
  2088. font-family: "xs 0px, sm 544px, md 768px, lg 992px, xl 1200px"; }
  2089. body:after {
  2090. display: none; }
  2091. *[data-usn-if] {
  2092. display: none; }
  2093. .select2-container {
  2094. width: 100% !important;
  2095. margin: 0;
  2096. display: inline-block;
  2097. position: relative;
  2098. vertical-align: middle;
  2099. box-sizing: border-box; }
  2100. .select2-container--classic:focus,
  2101. .select2-container--default:focus {
  2102. outline: none; }
  2103. .select2-container--classic .select2-selection__choice,
  2104. .select2-container--default .select2-selection__choice {
  2105. font-size: 0.9rem;
  2106. margin-top: 6px !important; }
  2107. .select2-container--classic .select2-selection--single,
  2108. .select2-container--default .select2-selection--single {
  2109. min-height: 2.714rem;
  2110. padding: 5px;
  2111. border: 1px solid #d8d6de; }
  2112. .select2-container--classic .select2-selection--single:focus,
  2113. .select2-container--default .select2-selection--single:focus {
  2114. outline: 0;
  2115. border-color: #7367f0 !important;
  2116. box-shadow: 0 3px 10px 0 rgba(34, 41, 47, 0.1) !important; }
  2117. .select2-container--classic .select2-selection--single .select2-selection__rendered i,
  2118. .select2-container--classic .select2-selection--single .select2-selection__rendered svg,
  2119. .select2-container--default .select2-selection--single .select2-selection__rendered i,
  2120. .select2-container--default .select2-selection--single .select2-selection__rendered svg {
  2121. font-size: 1.15rem;
  2122. height: 1.15rem;
  2123. width: 1.15rem;
  2124. margin-right: 0.5rem; }
  2125. .select2-container--classic .select2-selection--single .select2-selection__arrow b,
  2126. .select2-container--default .select2-selection--single .select2-selection__arrow b {
  2127. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d8d6de' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  2128. background-size: 18px 14px, 18px 14px;
  2129. background-repeat: no-repeat;
  2130. height: 1rem;
  2131. padding-right: 1.5rem;
  2132. margin-left: 0;
  2133. margin-top: 0;
  2134. left: -8px;
  2135. border-style: none; }
  2136. .select2-container--classic.select2-container--open,
  2137. .select2-container--default.select2-container--open {
  2138. box-shadow: 0 5px 25px rgba(34, 41, 47, 0.1); }
  2139. .select2-container--classic.select2-container--open .select2-selection--single,
  2140. .select2-container--default.select2-container--open .select2-selection--single {
  2141. border-color: #7367f0 !important;
  2142. outline: 0; }
  2143. .select2-container--classic.select2-container--focus,
  2144. .select2-container--default.select2-container--focus {
  2145. outline: 0; }
  2146. .select2-container--classic.select2-container--focus .select2-selection--multiple,
  2147. .select2-container--default.select2-container--focus .select2-selection--multiple {
  2148. border-color: #7367f0 !important;
  2149. outline: 0; }
  2150. .select2-container--classic .select2-dropdown,
  2151. .select2-container--default .select2-dropdown {
  2152. border-color: #d8d6de;
  2153. z-index: 1060; }
  2154. .select2-container--classic .select2-search--dropdown,
  2155. .select2-container--default .select2-search--dropdown {
  2156. padding: 0.5rem; }
  2157. .select2-container--classic .select2-search--dropdown .select2-search__field,
  2158. .select2-container--default .select2-search--dropdown .select2-search__field {
  2159. outline: none !important;
  2160. border-radius: 0.357rem;
  2161. border-color: #d8d6de;
  2162. padding: 0.571rem 1rem; }
  2163. .select2-container--classic .select2-selection--multiple,
  2164. .select2-container--default .select2-selection--multiple {
  2165. min-height: 38px !important;
  2166. border: 1px solid #d8d6de; }
  2167. .select2-container--classic .select2-selection--multiple:focus,
  2168. .select2-container--default .select2-selection--multiple:focus {
  2169. outline: 0;
  2170. border-color: #7367f0 !important;
  2171. box-shadow: 0 3px 10px 0 rgba(34, 41, 47, 0.1) !important; }
  2172. .select2-container--classic .select2-selection--multiple .select2-selection__choice,
  2173. .select2-container--default .select2-selection--multiple .select2-selection__choice {
  2174. background-color: #7367f0 !important;
  2175. border-color: #7367f0 !important;
  2176. color: #fff;
  2177. padding: 2px 5px; }
  2178. .select2-container--classic .select2-selection--multiple .select2-selection__rendered,
  2179. .select2-container--default .select2-selection--multiple .select2-selection__rendered {
  2180. padding: 0 6px; }
  2181. .select2-container--classic .select2-selection--multiple .select2-selection__rendered li .select2-search__field,
  2182. .select2-container--default .select2-selection--multiple .select2-selection__rendered li .select2-search__field {
  2183. margin-top: 7px; }
  2184. .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove,
  2185. .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  2186. float: right;
  2187. margin-left: 0.7rem;
  2188. margin-right: 0.5rem;
  2189. font-size: 0px;
  2190. display: inline-block;
  2191. position: relative;
  2192. line-height: 1rem; }
  2193. .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:before,
  2194. .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:before {
  2195. content: '';
  2196. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
  2197. background-size: 0.85rem;
  2198. height: 0.85rem;
  2199. width: 0.85rem;
  2200. position: absolute;
  2201. top: 22%;
  2202. left: -4px; }
  2203. .select2-container--classic .select2-selection--multiple i,
  2204. .select2-container--classic .select2-selection--multiple svg,
  2205. .select2-container--default .select2-selection--multiple i,
  2206. .select2-container--default .select2-selection--multiple svg {
  2207. position: relative;
  2208. top: 1px;
  2209. margin-right: 0.5rem;
  2210. height: 1.15rem;
  2211. width: 1.15rem;
  2212. font-size: 1.15rem;
  2213. padding-left: 1px; }
  2214. .select2-container--classic .select2-results__group,
  2215. .select2-container--default .select2-results__group {
  2216. padding: 6px 9px;
  2217. font-weight: 600; }
  2218. .select2-container--classic .select2-results__option,
  2219. .select2-container--default .select2-results__option {
  2220. padding: 0.428rem 1rem; }
  2221. .select2-container--classic .select2-results__option[role='group'],
  2222. .select2-container--default .select2-results__option[role='group'] {
  2223. padding: 0; }
  2224. .select2-container--classic .select2-results__option[aria-selected='true'],
  2225. .select2-container--default .select2-results__option[aria-selected='true'] {
  2226. background-color: #7367f0 !important;
  2227. color: #fff !important; }
  2228. .select2-container--classic .select2-results__option i,
  2229. .select2-container--classic .select2-results__option svg,
  2230. .select2-container--default .select2-results__option i,
  2231. .select2-container--default .select2-results__option svg {
  2232. height: 1.15rem;
  2233. width: 1.15rem;
  2234. font-size: 1.15rem;
  2235. margin-right: 0.5rem; }
  2236. .select2-container--classic .select2-results__option--highlighted,
  2237. .select2-container--default .select2-results__option--highlighted {
  2238. background-color: rgba(115, 103, 240, 0.12) !important;
  2239. color: #7367f0 !important; }
  2240. .select2-container--classic .select2-result-repository__avatar img,
  2241. .select2-container--default .select2-result-repository__avatar img {
  2242. width: 50px; }
  2243. .select2-container--classic .select-lg,
  2244. .select2-container--default .select-lg {
  2245. min-height: 2.714rem !important;
  2246. font-size: 1.2rem;
  2247. margin-bottom: 0 !important;
  2248. padding: 0.3rem 0.7rem; }
  2249. .select2-container--classic .select-lg.select2-selection--single .select2-selection__rendered,
  2250. .select2-container--default .select-lg.select2-selection--single .select2-selection__rendered {
  2251. padding-top: -0.1rem; }
  2252. .select2-container--classic .select-lg.select2-selection--single .select2-selection__arrow,
  2253. .select2-container--default .select-lg.select2-selection--single .select2-selection__arrow {
  2254. top: 0rem !important; }
  2255. .select2-container--classic .select-lg.select2-selection--multiple,
  2256. .select2-container--default .select-lg.select2-selection--multiple {
  2257. padding: 0 0.2rem; }
  2258. .select2-container--classic .select-lg.select2-selection--multiple .select2-selection__rendered,
  2259. .select2-container--default .select-lg.select2-selection--multiple .select2-selection__rendered {
  2260. padding-top: 0 !important; }
  2261. .select2-container--classic .select-lg.select2-selection--multiple .select2-selection__rendered li,
  2262. .select2-container--default .select-lg.select2-selection--multiple .select2-selection__rendered li {
  2263. font-size: 1.2rem; }
  2264. .select2-container--classic .select-lg.select2-selection--multiple .select2-selection__rendered li .select2-search__field,
  2265. .select2-container--default .select-lg.select2-selection--multiple .select2-selection__rendered li .select2-search__field {
  2266. margin-top: 10px; }
  2267. .select2-container--classic .select-lg.select2-selection--multiple .select2-selection__rendered .select2-selection__choice,
  2268. .select2-container--default .select-lg.select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
  2269. padding: 5px; }
  2270. .select2-container--classic .select-lg.select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove:before,
  2271. .select2-container--default .select-lg.select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove:before {
  2272. top: 46%; }
  2273. .select2-container--classic .select-sm,
  2274. .select2-container--default .select-sm {
  2275. min-height: 2.142rem !important;
  2276. padding: 0 0.2rem;
  2277. font-size: 0.75rem;
  2278. margin-bottom: 0 !important;
  2279. line-height: 1.45; }
  2280. .select2-container--classic .select-sm.select2-selection--single .select2-selection__arrow,
  2281. .select2-container--default .select-sm.select2-selection--single .select2-selection__arrow {
  2282. top: -0.3rem !important; }
  2283. .select2-container--classic .select-sm.select2-selection--multiple,
  2284. .select2-container--default .select-sm.select2-selection--multiple {
  2285. line-height: 1.25; }
  2286. .select2-container--classic .select-sm.select2-selection--multiple .select2-selection__rendered,
  2287. .select2-container--default .select-sm.select2-selection--multiple .select2-selection__rendered {
  2288. padding: 3px; }
  2289. .select2-container--classic .select-sm.select2-selection--multiple .select2-selection__rendered li,
  2290. .select2-container--default .select-sm.select2-selection--multiple .select2-selection__rendered li {
  2291. font-size: 0.75rem;
  2292. margin-top: 2px; }
  2293. .select2-container--classic .select-sm.select2-selection--multiple .select2-selection__rendered li .select2-search__field,
  2294. .select2-container--default .select-sm.select2-selection--multiple .select2-selection__rendered li .select2-search__field {
  2295. margin-top: 4px; }
  2296. .select2-container--classic .select-sm.select2-selection--multiple .select2-selection__choice,
  2297. .select2-container--default .select-sm.select2-selection--multiple .select2-selection__choice {
  2298. padding: 0 0.2rem;
  2299. margin-top: 4px !important; }
  2300. .select2-container--classic .select-sm.select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove:before,
  2301. .select2-container--default .select-sm.select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove:before {
  2302. top: 5%; }
  2303. .select2-container--classic .select-sm.select2-selection--multiple .select2-search--inline .select2-search__field,
  2304. .select2-container--default .select-sm.select2-selection--multiple .select2-search--inline .select2-search__field {
  2305. margin-top: 0; }
  2306. .dark-layout .select2-container .select2-selection,
  2307. .dark-layout .select2-container .select2-search__field,
  2308. .dark-layout .select2-container .select2-selection__placeholder {
  2309. background: #283046;
  2310. border-color: #3b4253;
  2311. color: #b4b7bd; }
  2312. .dark-layout .select2-container .select2-selection__rendered {
  2313. color: #b4b7bd; }
  2314. .dark-layout .select2-container .select2-dropdown {
  2315. background-color: #283046;
  2316. border-color: #3b4253; }
  2317. .dark-layout .select2-container .select2-selection--multiple .select2-selection__choice {
  2318. background: rgba(115, 103, 240, 0.12) !important;
  2319. color: #7367f0 !important;
  2320. border: none; }
  2321. .dark-layout .select2-container .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove {
  2322. color: #7367f0 !important; }
  2323. .dark-layout .select2-container .select2-selection--multiple .select2-selection__choice__remove:before {
  2324. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237367f0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E"); }
  2325. .dark-layout .select2-container .select2-results__option[aria-disabled='true'] {
  2326. color: #676d7d; }
  2327. .dark-layout .select2-container .select2-selection__arrow b {
  2328. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b4b7bd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); }
  2329. .dark-layout .select2-container--disabled .select2-selection {
  2330. opacity: 0.5; }
  2331. table.dataTable {
  2332. width: 100% !important;
  2333. border-collapse: collapse !important; }
  2334. table.dataTable.table-responsive:not(.datatables-ajax) {
  2335. display: block; }
  2336. table.dataTable td,
  2337. table.dataTable th {
  2338. padding: 0.72rem 1.5rem;
  2339. vertical-align: middle; }
  2340. table.dataTable thead .sorting,
  2341. table.dataTable thead .sorting_asc,
  2342. table.dataTable thead .sorting_desc {
  2343. padding-right: inherit; }
  2344. table.dataTable thead .sorting:before,
  2345. table.dataTable thead .sorting_asc:before,
  2346. table.dataTable thead .sorting_desc:before {
  2347. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235e5873' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-up'%3E%3Cpolyline points='18 15 12 9 6 15'%3E%3C/polyline%3E%3C/svg%3E");
  2348. background-repeat: no-repeat;
  2349. background-position: center;
  2350. background-size: 12px;
  2351. color: #6e6b7b;
  2352. width: 14px;
  2353. height: 14px;
  2354. content: '';
  2355. right: 0.3rem;
  2356. top: 0.5rem; }
  2357. table.dataTable thead .sorting:after,
  2358. table.dataTable thead .sorting_asc:after,
  2359. table.dataTable thead .sorting_desc:after {
  2360. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235e5873' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  2361. background-repeat: no-repeat;
  2362. background-position: center;
  2363. background-size: 12px;
  2364. color: #6e6b7b;
  2365. width: 14px;
  2366. height: 14px;
  2367. content: '';
  2368. right: 0.3rem;
  2369. top: 1.3rem; }
  2370. div.dtr-modal {
  2371. z-index: 1060; }
  2372. div.dataTables_wrapper .dt-button-collection {
  2373. background-color: #fff; }
  2374. div.dataTables_wrapper .dt-button-collection > div[role='menu'] {
  2375. text-align: left;
  2376. box-shadow: 0px 5px 16px -8px;
  2377. min-width: 8rem; }
  2378. div.dataTables_wrapper .dt-button-collection [class*='buttons-']:focus {
  2379. outline: 0; }
  2380. table.dataTable.dtr-column > tbody > tr > td.control:before,
  2381. table.dataTable.dtr-column > tbody > tr > th.control:before {
  2382. line-height: 19px; }
  2383. div.dataTables_wrapper div.dataTables_filter label,
  2384. div.dataTables_wrapper div.dataTables_length label {
  2385. margin-top: 1rem;
  2386. margin-bottom: 0.5rem; }
  2387. div.dataTables_wrapper div.dataTables_filter select,
  2388. div.dataTables_wrapper div.dataTables_length select {
  2389. background-position: calc(100% - 3px) 11px, calc(100% - 20px) 13px, 100% 0;
  2390. width: 5rem;
  2391. margin: 0 0.5rem; }
  2392. div.dataTables_wrapper div.dataTables_filter input {
  2393. margin-left: 0.75rem; }
  2394. div.dataTables_wrapper div.dataTables_paginate ul.pagination {
  2395. margin-top: 1rem;
  2396. margin-bottom: 1.5rem; }
  2397. div.dataTables_wrapper .dataTables_info {
  2398. padding-top: 1.25rem !important;
  2399. color: #b9b9c3; }
  2400. tr.group {
  2401. background-color: #fafafc; }
  2402. @media only screen and (max-width: 992px) {
  2403. table.dataTable.table-responsive.datatables-ajax {
  2404. display: block; } }
  2405. @media only screen and (max-width: 768px) {
  2406. div.dataTables_wrapper div.dataTables_paginate ul.pagination {
  2407. justify-content: center; }
  2408. div.dataTables_wrapper div.dataTables_info {
  2409. white-space: inherit; }
  2410. div.dt-buttons {
  2411. justify-content: center;
  2412. margin-top: 1rem; }
  2413. div.dt-buttons button {
  2414. margin-bottom: 0.5rem; } }
  2415. @media (max-width: 575.98px) {
  2416. .dtr-bs-modal .modal-body {
  2417. padding-left: 0;
  2418. padding-right: 0;
  2419. overflow-x: scroll; }
  2420. .dtr-bs-modal .table.dtr-details {
  2421. margin: 0 auto 1rem; }
  2422. .dtr-bs-modal .table.dtr-details td {
  2423. padding-left: 0;
  2424. padding-right: 0; }
  2425. .dtr-bs-modal .table.dtr-details tr td:first-child {
  2426. padding-left: 0.75rem; }
  2427. div.dataTables_wrapper {
  2428. overflow: scroll; } }
  2429. /* Bootstrap Touchspin */
  2430. .bootstrap-touchspin.input-group {
  2431. width: 8.4rem;
  2432. align-items: center; }
  2433. .bootstrap-touchspin.input-group .form-control {
  2434. padding: 5px;
  2435. height: auto;
  2436. border: 0;
  2437. background-color: #f8f8f8;
  2438. border-radius: 0.357rem !important;
  2439. text-align: center;
  2440. font-weight: 500; }
  2441. .bootstrap-touchspin.input-group .form-control:focus {
  2442. z-index: 1;
  2443. box-shadow: none; }
  2444. .bootstrap-touchspin.input-group > .input-group-btn:first-child {
  2445. left: 12px !important;
  2446. position: inherit; }
  2447. .bootstrap-touchspin.input-group > .input-group-btn:last-child {
  2448. right: 12px !important;
  2449. position: inherit; }
  2450. .bootstrap-touchspin .bootstrap-touchspin-injected {
  2451. margin: 0 !important; }
  2452. .bootstrap-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-down,
  2453. .bootstrap-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-up {
  2454. padding: 0;
  2455. min-width: 20px;
  2456. min-height: 20px;
  2457. border-radius: 0.357rem !important; }
  2458. .bootstrap-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-down i,
  2459. .bootstrap-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-down svg,
  2460. .bootstrap-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-up i,
  2461. .bootstrap-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-up svg {
  2462. height: 0.8rem;
  2463. width: 0.8rem;
  2464. font-size: 0.8rem;
  2465. position: relative;
  2466. top: -1px; }
  2467. .bootstrap-touchspin.disabled-touchspin .bootstrap-touchspin-down,
  2468. .bootstrap-touchspin.disabled-touchspin .bootstrap-touchspin-up {
  2469. background-color: rgba(34, 41, 47, 0.5) !important;
  2470. cursor: default;
  2471. opacity: 0.5; }
  2472. .bootstrap-touchspin.input-group-lg {
  2473. width: 9.375rem; }
  2474. .bootstrap-touchspin.input-group-lg .touchspin.form-control {
  2475. height: auto !important; }
  2476. .bootstrap-touchspin.input-group-lg .bootstrap-touchspin-down,
  2477. .bootstrap-touchspin.input-group-lg .bootstrap-touchspin-up {
  2478. min-width: 24px;
  2479. min-height: 24px; }
  2480. .bootstrap-touchspin.input-group-lg .bootstrap-touchspin-down i,
  2481. .bootstrap-touchspin.input-group-lg .bootstrap-touchspin-down svg,
  2482. .bootstrap-touchspin.input-group-lg .bootstrap-touchspin-up i,
  2483. .bootstrap-touchspin.input-group-lg .bootstrap-touchspin-up svg {
  2484. height: 1rem;
  2485. width: 1rem;
  2486. font-size: 1rem;
  2487. top: 0; }
  2488. .bootstrap-touchspin.input-group-sm {
  2489. width: 6.25rem; }
  2490. .bootstrap-touchspin.input-group-sm .touchspin.form-control {
  2491. height: auto !important; }
  2492. .bootstrap-touchspin.input-group-sm .bootstrap-touchspin-injected .bootstrap-touchspin-down,
  2493. .bootstrap-touchspin.input-group-sm .bootstrap-touchspin-injected .bootstrap-touchspin-up {
  2494. min-width: 16px;
  2495. min-height: 16px; }
  2496. .bootstrap-touchspin.input-group-sm .bootstrap-touchspin-injected .bootstrap-touchspin-down i,
  2497. .bootstrap-touchspin.input-group-sm .bootstrap-touchspin-injected .bootstrap-touchspin-down svg,
  2498. .bootstrap-touchspin.input-group-sm .bootstrap-touchspin-injected .bootstrap-touchspin-up i,
  2499. .bootstrap-touchspin.input-group-sm .bootstrap-touchspin-injected .bootstrap-touchspin-up svg {
  2500. height: 0.6rem;
  2501. width: 0.6rem;
  2502. font-size: 0.6rem;
  2503. top: -3px; }
  2504. /* Number Type Input Box Scss for Touchspin - Remove arrow for firefox */
  2505. .bootstrap-touchspin.input-group input[type='number'] {
  2506. -moz-appearance: textfield; }
  2507. .dark-layout .bootstrap-touchspin.input-group .form-control {
  2508. background-color: #161d31; }
  2509. .dark-layout .bootstrap-touchspin.disabled-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-down,
  2510. .dark-layout .bootstrap-touchspin.disabled-touchspin .bootstrap-touchspin-injected .bootstrap-touchspin-up,
  2511. .dark-layout .bootstrap-touchspin.disabled-touchspin .bootstrap-touchspin-injected .disabled-max-min {
  2512. background-color: #b8c2cc !important;
  2513. opacity: 1; }
  2514. .dark-layout .bootstrap-touchspin .bootstrap-touchspin-injected .disabled-max-min {
  2515. background-color: #b8c2cc !important;
  2516. opacity: 1; }