froala_editor.pkgd.css 70 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907
  1. /*!
  2. * froala_editor v2.7.5 (https://www.froala.com/wysiwyg-editor)
  3. * License https://froala.com/wysiwyg-editor/terms/
  4. * Copyright 2014-2018 Froala Labs
  5. */
  6. .clearfix::after {
  7. clear: both;
  8. display: block;
  9. content: "";
  10. height: 0;
  11. }
  12. .hide-by-clipping {
  13. position: absolute;
  14. width: 1px;
  15. height: 1px;
  16. padding: 0;
  17. margin: -1px;
  18. overflow: hidden;
  19. clip: rect(0, 0, 0, 0);
  20. border: 0;
  21. }
  22. .fr-element,
  23. .fr-element:focus {
  24. outline: 0px solid transparent;
  25. }
  26. .fr-box.fr-basic .fr-element {
  27. color: #000000;
  28. padding: 16px;
  29. -webkit-box-sizing: border-box;
  30. -moz-box-sizing: border-box;
  31. box-sizing: border-box;
  32. overflow-x: auto;
  33. min-height: 52px;
  34. }
  35. .fr-box.fr-basic.fr-rtl .fr-element {
  36. text-align: right;
  37. }
  38. .fr-element {
  39. background: transparent;
  40. position: relative;
  41. z-index: 2;
  42. -webkit-user-select: auto;
  43. }
  44. .fr-element a {
  45. user-select: auto;
  46. -o-user-select: auto;
  47. -moz-user-select: auto;
  48. -khtml-user-select: auto;
  49. -webkit-user-select: auto;
  50. -ms-user-select: auto;
  51. }
  52. .fr-element.fr-disabled {
  53. user-select: none;
  54. -o-user-select: none;
  55. -moz-user-select: none;
  56. -khtml-user-select: none;
  57. -webkit-user-select: none;
  58. -ms-user-select: none;
  59. }
  60. .fr-element [contenteditable="true"] {
  61. outline: 0px solid transparent;
  62. user-select: text;
  63. -o-user-select: text;
  64. -moz-user-select: text;
  65. -khtml-user-select: text;
  66. -webkit-user-select: text;
  67. -ms-user-select: text;
  68. }
  69. .fr-box a.fr-floating-btn {
  70. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  71. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  72. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  73. border-radius: 100%;
  74. -moz-border-radius: 100%;
  75. -webkit-border-radius: 100%;
  76. -moz-background-clip: padding;
  77. -webkit-background-clip: padding-box;
  78. background-clip: padding-box;
  79. height: 32px;
  80. width: 32px;
  81. background: #ffffff;
  82. color: #1e88e5;
  83. -webkit-transition: background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;
  84. -moz-transition: background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;
  85. -ms-transition: background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;
  86. -o-transition: background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;
  87. outline: none;
  88. left: 0;
  89. top: 0;
  90. line-height: 32px;
  91. -webkit-transform: scale(0);
  92. -moz-transform: scale(0);
  93. -ms-transform: scale(0);
  94. -o-transform: scale(0);
  95. text-align: center;
  96. display: block;
  97. -webkit-box-sizing: border-box;
  98. -moz-box-sizing: border-box;
  99. box-sizing: border-box;
  100. border: none;
  101. }
  102. .fr-box a.fr-floating-btn svg {
  103. -webkit-transition: transform 0.2s ease 0s;
  104. -moz-transition: transform 0.2s ease 0s;
  105. -ms-transition: transform 0.2s ease 0s;
  106. -o-transition: transform 0.2s ease 0s;
  107. fill: #1e88e5;
  108. }
  109. .fr-box a.fr-floating-btn i,
  110. .fr-box a.fr-floating-btn svg {
  111. font-size: 14px;
  112. line-height: 32px;
  113. }
  114. .fr-box a.fr-floating-btn.fr-btn + .fr-btn {
  115. margin-left: 10px;
  116. }
  117. .fr-box a.fr-floating-btn:hover {
  118. background: #ebebeb;
  119. cursor: pointer;
  120. }
  121. .fr-box a.fr-floating-btn:hover svg {
  122. fill: #1e88e5;
  123. }
  124. .fr-box .fr-visible a.fr-floating-btn {
  125. -webkit-transform: scale(1);
  126. -moz-transform: scale(1);
  127. -ms-transform: scale(1);
  128. -o-transform: scale(1);
  129. }
  130. iframe.fr-iframe {
  131. width: 100%;
  132. border: none;
  133. position: relative;
  134. display: block;
  135. z-index: 2;
  136. -webkit-box-sizing: border-box;
  137. -moz-box-sizing: border-box;
  138. box-sizing: border-box;
  139. }
  140. .fr-wrapper {
  141. position: relative;
  142. z-index: 1;
  143. }
  144. .fr-wrapper::after {
  145. clear: both;
  146. display: block;
  147. content: "";
  148. height: 0;
  149. }
  150. .fr-wrapper .fr-placeholder {
  151. position: absolute;
  152. font-size: 12px;
  153. color: #aaaaaa;
  154. z-index: 1;
  155. display: none;
  156. top: 0;
  157. left: 0;
  158. right: 0;
  159. overflow: hidden;
  160. }
  161. .fr-wrapper.show-placeholder .fr-placeholder {
  162. display: block;
  163. }
  164. .fr-wrapper ::-moz-selection {
  165. background: #b5d6fd;
  166. color: #000000;
  167. }
  168. .fr-wrapper ::selection {
  169. background: #b5d6fd;
  170. color: #000000;
  171. }
  172. .fr-box.fr-basic .fr-wrapper {
  173. background: #ffffff;
  174. border: 0px;
  175. border-top: 0;
  176. top: 0;
  177. left: 0;
  178. }
  179. .fr-box.fr-basic.fr-top .fr-wrapper {
  180. border-top: 0;
  181. border-radius: 0 0 2px 2px;
  182. -moz-border-radius: 0 0 2px 2px;
  183. -webkit-border-radius: 0 0 2px 2px;
  184. -moz-background-clip: padding;
  185. -webkit-background-clip: padding-box;
  186. background-clip: padding-box;
  187. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  188. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  189. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  190. }
  191. .fr-box.fr-basic.fr-bottom .fr-wrapper {
  192. border-bottom: 0;
  193. border-radius: 2px 2px 0 0;
  194. -moz-border-radius: 2px 2px 0 0;
  195. -webkit-border-radius: 2px 2px 0 0;
  196. -moz-background-clip: padding;
  197. -webkit-background-clip: padding-box;
  198. background-clip: padding-box;
  199. -webkit-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  200. -moz-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  201. box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  202. }
  203. .fr-tooltip {
  204. position: absolute;
  205. top: 0;
  206. left: 0;
  207. padding: 0 8px;
  208. border-radius: 2px;
  209. -moz-border-radius: 2px;
  210. -webkit-border-radius: 2px;
  211. -moz-background-clip: padding;
  212. -webkit-background-clip: padding-box;
  213. background-clip: padding-box;
  214. -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  215. -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  216. box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  217. background: #222222;
  218. color: #ffffff;
  219. font-size: 11px;
  220. line-height: 22px;
  221. font-family: Arial, Helvetica, sans-serif;
  222. -webkit-transition: opacity 0.2s ease 0s;
  223. -moz-transition: opacity 0.2s ease 0s;
  224. -ms-transition: opacity 0.2s ease 0s;
  225. -o-transition: opacity 0.2s ease 0s;
  226. -webkit-opacity: 0;
  227. -moz-opacity: 0;
  228. opacity: 0;
  229. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  230. left: -3000px;
  231. user-select: none;
  232. -o-user-select: none;
  233. -moz-user-select: none;
  234. -khtml-user-select: none;
  235. -webkit-user-select: none;
  236. -ms-user-select: none;
  237. z-index: 2147483647;
  238. text-rendering: optimizelegibility;
  239. -webkit-font-smoothing: antialiased;
  240. -moz-osx-font-smoothing: grayscale;
  241. }
  242. .fr-tooltip.fr-visible {
  243. -webkit-opacity: 1;
  244. -moz-opacity: 1;
  245. opacity: 1;
  246. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  247. }
  248. .fr-toolbar .fr-command.fr-btn,
  249. .fr-popup .fr-command.fr-btn {
  250. background: transparent;
  251. color: #222222;
  252. -moz-outline: 0;
  253. outline: 0;
  254. border: 0;
  255. line-height: 1;
  256. cursor: pointer;
  257. text-align: left;
  258. margin: 0px 2px;
  259. -webkit-transition: background 0.2s ease 0s;
  260. -moz-transition: background 0.2s ease 0s;
  261. -ms-transition: background 0.2s ease 0s;
  262. -o-transition: background 0.2s ease 0s;
  263. border-radius: 0;
  264. -moz-border-radius: 0;
  265. -webkit-border-radius: 0;
  266. -moz-background-clip: padding;
  267. -webkit-background-clip: padding-box;
  268. background-clip: padding-box;
  269. z-index: 2;
  270. position: relative;
  271. -webkit-box-sizing: border-box;
  272. -moz-box-sizing: border-box;
  273. box-sizing: border-box;
  274. text-decoration: none;
  275. user-select: none;
  276. -o-user-select: none;
  277. -moz-user-select: none;
  278. -khtml-user-select: none;
  279. -webkit-user-select: none;
  280. -ms-user-select: none;
  281. float: left;
  282. padding: 0;
  283. width: 38px;
  284. height: 38px;
  285. }
  286. .fr-toolbar .fr-command.fr-btn::-moz-focus-inner,
  287. .fr-popup .fr-command.fr-btn::-moz-focus-inner {
  288. border: 0;
  289. padding: 0;
  290. }
  291. .fr-toolbar .fr-command.fr-btn.fr-btn-text,
  292. .fr-popup .fr-command.fr-btn.fr-btn-text {
  293. width: auto;
  294. }
  295. .fr-toolbar .fr-command.fr-btn i,
  296. .fr-popup .fr-command.fr-btn i,
  297. .fr-toolbar .fr-command.fr-btn svg,
  298. .fr-popup .fr-command.fr-btn svg {
  299. display: block;
  300. font-size: 14px;
  301. width: 14px;
  302. margin: 12px 12px;
  303. text-align: center;
  304. float: none;
  305. }
  306. .fr-toolbar .fr-command.fr-btn span.fr-sr-only,
  307. .fr-popup .fr-command.fr-btn span.fr-sr-only {
  308. position: absolute;
  309. width: 1px;
  310. height: 1px;
  311. padding: 0;
  312. margin: -1px;
  313. overflow: hidden;
  314. clip: rect(0, 0, 0, 0);
  315. border: 0;
  316. }
  317. .fr-toolbar .fr-command.fr-btn span,
  318. .fr-popup .fr-command.fr-btn span {
  319. font-size: 14px;
  320. display: block;
  321. line-height: 17px;
  322. min-width: 34px;
  323. float: left;
  324. text-overflow: ellipsis;
  325. overflow: hidden;
  326. white-space: nowrap;
  327. height: 17px;
  328. font-weight: bold;
  329. padding: 0 2px;
  330. }
  331. .fr-toolbar .fr-command.fr-btn img,
  332. .fr-popup .fr-command.fr-btn img {
  333. margin: 12px 12px;
  334. width: 14px;
  335. }
  336. .fr-toolbar .fr-command.fr-btn.fr-active,
  337. .fr-popup .fr-command.fr-btn.fr-active {
  338. color: #1e88e5;
  339. background: transparent;
  340. }
  341. .fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-selection,
  342. .fr-popup .fr-command.fr-btn.fr-dropdown.fr-selection {
  343. width: auto;
  344. }
  345. .fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-selection span,
  346. .fr-popup .fr-command.fr-btn.fr-dropdown.fr-selection span {
  347. font-weight: normal;
  348. }
  349. .fr-toolbar .fr-command.fr-btn.fr-dropdown i,
  350. .fr-popup .fr-command.fr-btn.fr-dropdown i,
  351. .fr-toolbar .fr-command.fr-btn.fr-dropdown span,
  352. .fr-popup .fr-command.fr-btn.fr-dropdown span,
  353. .fr-toolbar .fr-command.fr-btn.fr-dropdown img,
  354. .fr-popup .fr-command.fr-btn.fr-dropdown img,
  355. .fr-toolbar .fr-command.fr-btn.fr-dropdown svg,
  356. .fr-popup .fr-command.fr-btn.fr-dropdown svg {
  357. margin-left: 8px;
  358. margin-right: 16px;
  359. }
  360. .fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active,
  361. .fr-popup .fr-command.fr-btn.fr-dropdown.fr-active {
  362. color: #222222;
  363. background: #d6d6d6;
  364. }
  365. .fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:hover,
  366. .fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:hover,
  367. .fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:focus,
  368. .fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:focus {
  369. background: #d6d6d6 !important;
  370. color: #222222 !important;
  371. }
  372. .fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:hover::after,
  373. .fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:hover::after,
  374. .fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:focus::after,
  375. .fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:focus::after {
  376. border-top-color: #222222 !important;
  377. }
  378. .fr-toolbar .fr-command.fr-btn.fr-dropdown::after,
  379. .fr-popup .fr-command.fr-btn.fr-dropdown::after {
  380. position: absolute;
  381. width: 0;
  382. height: 0;
  383. border-left: 4px solid transparent;
  384. border-right: 4px solid transparent;
  385. border-top: 4px solid #222222;
  386. right: 4px;
  387. top: 17px;
  388. content: "";
  389. }
  390. .fr-toolbar .fr-command.fr-btn.fr-disabled,
  391. .fr-popup .fr-command.fr-btn.fr-disabled {
  392. color: #bdbdbd;
  393. cursor: default;
  394. }
  395. .fr-toolbar .fr-command.fr-btn.fr-disabled::after,
  396. .fr-popup .fr-command.fr-btn.fr-disabled::after {
  397. border-top-color: #bdbdbd !important;
  398. }
  399. .fr-toolbar .fr-command.fr-btn.fr-hidden,
  400. .fr-popup .fr-command.fr-btn.fr-hidden {
  401. display: none;
  402. }
  403. .fr-toolbar.fr-disabled .fr-btn,
  404. .fr-popup.fr-disabled .fr-btn,
  405. .fr-toolbar.fr-disabled .fr-btn.fr-active,
  406. .fr-popup.fr-disabled .fr-btn.fr-active {
  407. color: #bdbdbd;
  408. }
  409. .fr-toolbar.fr-disabled .fr-btn.fr-dropdown::after,
  410. .fr-popup.fr-disabled .fr-btn.fr-dropdown::after,
  411. .fr-toolbar.fr-disabled .fr-btn.fr-active.fr-dropdown::after,
  412. .fr-popup.fr-disabled .fr-btn.fr-active.fr-dropdown::after {
  413. border-top-color: #bdbdbd;
  414. }
  415. .fr-toolbar.fr-rtl .fr-command.fr-btn,
  416. .fr-popup.fr-rtl .fr-command.fr-btn {
  417. float: right;
  418. }
  419. .fr-toolbar.fr-inline .fr-command.fr-btn:not(.fr-hidden) {
  420. display: -webkit-inline-flex;
  421. display: -ms-inline-flexbox;
  422. display: inline-flex;
  423. float: none;
  424. }
  425. .fr-desktop .fr-command:hover,
  426. .fr-desktop .fr-command:focus {
  427. outline: 0;
  428. color: #222222;
  429. background: #ebebeb;
  430. }
  431. .fr-desktop .fr-command:hover::after,
  432. .fr-desktop .fr-command:focus::after {
  433. border-top-color: #222222 !important;
  434. }
  435. .fr-desktop .fr-command.fr-selected {
  436. color: #222222;
  437. background: #d6d6d6;
  438. }
  439. .fr-desktop .fr-command.fr-active:hover,
  440. .fr-desktop .fr-command.fr-active:focus {
  441. color: #1e88e5;
  442. background: #ebebeb;
  443. }
  444. .fr-desktop .fr-command.fr-active.fr-selected {
  445. color: #1e88e5;
  446. background: #d6d6d6;
  447. }
  448. .fr-desktop .fr-command.fr-disabled:hover,
  449. .fr-desktop .fr-command.fr-disabled:focus,
  450. .fr-desktop .fr-command.fr-disabled.fr-selected {
  451. background: transparent;
  452. }
  453. .fr-desktop.fr-disabled .fr-command:hover,
  454. .fr-desktop.fr-disabled .fr-command:focus,
  455. .fr-desktop.fr-disabled .fr-command.fr-selected {
  456. background: transparent;
  457. }
  458. .fr-toolbar.fr-mobile .fr-command.fr-blink,
  459. .fr-popup.fr-mobile .fr-command.fr-blink {
  460. background: transparent;
  461. }
  462. .fr-command.fr-btn + .fr-dropdown-menu {
  463. display: inline-block;
  464. position: absolute;
  465. right: auto;
  466. bottom: auto;
  467. height: auto;
  468. z-index: 4;
  469. -webkit-overflow-scrolling: touch;
  470. overflow: hidden;
  471. zoom: 1;
  472. border-radius: 0 0 2px 2px;
  473. -moz-border-radius: 0 0 2px 2px;
  474. -webkit-border-radius: 0 0 2px 2px;
  475. -moz-background-clip: padding;
  476. -webkit-background-clip: padding-box;
  477. background-clip: padding-box;
  478. }
  479. .fr-command.fr-btn + .fr-dropdown-menu.test-height .fr-dropdown-wrapper {
  480. -webkit-transition: none;
  481. -moz-transition: none;
  482. -ms-transition: none;
  483. -o-transition: none;
  484. height: auto;
  485. max-height: 275px;
  486. }
  487. .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper {
  488. background: #ffffff;
  489. padding: 0;
  490. margin: auto;
  491. display: inline-block;
  492. text-align: left;
  493. position: relative;
  494. -webkit-box-sizing: border-box;
  495. -moz-box-sizing: border-box;
  496. box-sizing: border-box;
  497. -webkit-transition: max-height 0.2s ease 0s;
  498. -moz-transition: max-height 0.2s ease 0s;
  499. -ms-transition: max-height 0.2s ease 0s;
  500. -o-transition: max-height 0.2s ease 0s;
  501. margin-top: 0;
  502. float: left;
  503. max-height: 0;
  504. height: 0;
  505. margin-top: 0 !important;
  506. }
  507. .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content {
  508. overflow: auto;
  509. position: relative;
  510. max-height: 275px;
  511. }
  512. .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list {
  513. list-style-type: none;
  514. margin: 0;
  515. padding: 0;
  516. }
  517. .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li {
  518. padding: 0;
  519. margin: 0;
  520. font-size: 15px;
  521. }
  522. .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a {
  523. padding: 0 24px;
  524. line-height: 200%;
  525. display: block;
  526. cursor: pointer;
  527. white-space: nowrap;
  528. color: inherit;
  529. text-decoration: none;
  530. }
  531. .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a.fr-active {
  532. background: #d6d6d6;
  533. }
  534. .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a.fr-disabled {
  535. color: #bdbdbd;
  536. cursor: default;
  537. }
  538. .fr-command.fr-btn:not(.fr-active) + .fr-dropdown-menu {
  539. left: -3000px !important;
  540. }
  541. .fr-command.fr-btn.fr-active + .fr-dropdown-menu {
  542. display: inline-block;
  543. -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  544. -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  545. box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  546. }
  547. .fr-command.fr-btn.fr-active + .fr-dropdown-menu .fr-dropdown-wrapper {
  548. height: auto;
  549. max-height: 275px;
  550. }
  551. .fr-bottom > .fr-command.fr-btn + .fr-dropdown-menu {
  552. border-radius: 2px 2px 0 0;
  553. -moz-border-radius: 2px 2px 0 0;
  554. -webkit-border-radius: 2px 2px 0 0;
  555. -moz-background-clip: padding;
  556. -webkit-background-clip: padding-box;
  557. background-clip: padding-box;
  558. }
  559. .fr-toolbar.fr-rtl .fr-dropdown-wrapper,
  560. .fr-popup.fr-rtl .fr-dropdown-wrapper {
  561. text-align: right !important;
  562. }
  563. body.prevent-scroll {
  564. overflow: hidden;
  565. }
  566. body.prevent-scroll.fr-mobile {
  567. position: fixed;
  568. -webkit-overflow-scrolling: touch;
  569. }
  570. .fr-modal {
  571. color: #222222;
  572. font-family: Arial, Helvetica, sans-serif;
  573. position: fixed;
  574. overflow-x: auto;
  575. overflow-y: scroll;
  576. top: 0;
  577. left: 0;
  578. bottom: 0;
  579. right: 0;
  580. width: 100%;
  581. z-index: 2147483640;
  582. text-rendering: optimizelegibility;
  583. -webkit-font-smoothing: antialiased;
  584. -moz-osx-font-smoothing: grayscale;
  585. text-align: center;
  586. line-height: 1.2;
  587. }
  588. .fr-modal.fr-middle .fr-modal-wrapper {
  589. margin-top: 0;
  590. margin-bottom: 0;
  591. margin-left: auto;
  592. margin-right: auto;
  593. top: 50%;
  594. left: 50%;
  595. -webkit-transform: translate(-50%, -50%);
  596. -moz-transform: translate(-50%, -50%);
  597. -ms-transform: translate(-50%, -50%);
  598. -o-transform: translate(-50%, -50%);
  599. position: absolute;
  600. }
  601. .fr-modal .fr-modal-wrapper {
  602. border-radius: 2px;
  603. -moz-border-radius: 2px;
  604. -webkit-border-radius: 2px;
  605. -moz-background-clip: padding;
  606. -webkit-background-clip: padding-box;
  607. background-clip: padding-box;
  608. margin: 20px auto;
  609. display: inline-block;
  610. background: #ffffff;
  611. min-width: 300px;
  612. -webkit-box-shadow: 0 5px 8px rgba(0, 0, 0, 0.19), 0 4px 3px 1px rgba(0, 0, 0, 0.14);
  613. -moz-box-shadow: 0 5px 8px rgba(0, 0, 0, 0.19), 0 4px 3px 1px rgba(0, 0, 0, 0.14);
  614. box-shadow: 0 5px 8px rgba(0, 0, 0, 0.19), 0 4px 3px 1px rgba(0, 0, 0, 0.14);
  615. border: 0px;
  616. border-top: 5px solid #222222;
  617. overflow: hidden;
  618. width: 90%;
  619. position: relative;
  620. }
  621. @media (min-width: 768px) and (max-width: 991px) {
  622. .fr-modal .fr-modal-wrapper {
  623. margin: 30px auto;
  624. width: 70%;
  625. }
  626. }
  627. @media (min-width: 992px) {
  628. .fr-modal .fr-modal-wrapper {
  629. margin: 50px auto;
  630. width: 600px;
  631. }
  632. }
  633. .fr-modal .fr-modal-wrapper .fr-modal-head {
  634. background: #ffffff;
  635. -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  636. -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  637. box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 2px 2px 1px rgba(0, 0, 0, 0.14);
  638. border-bottom: 0px;
  639. overflow: hidden;
  640. position: absolute;
  641. width: 100%;
  642. min-height: 42px;
  643. z-index: 3;
  644. -webkit-transition: height 0.2s ease 0s;
  645. -moz-transition: height 0.2s ease 0s;
  646. -ms-transition: height 0.2s ease 0s;
  647. -o-transition: height 0.2s ease 0s;
  648. }
  649. .fr-modal .fr-modal-wrapper .fr-modal-head .fr-modal-close {
  650. padding: 12px;
  651. width: 20px;
  652. font-size: 16px;
  653. cursor: pointer;
  654. line-height: 18px;
  655. color: #222222;
  656. -webkit-box-sizing: content-box;
  657. -moz-box-sizing: content-box;
  658. box-sizing: content-box;
  659. position: absolute;
  660. top: 0;
  661. right: 0;
  662. -webkit-transition: color 0.2s ease 0s;
  663. -moz-transition: color 0.2s ease 0s;
  664. -ms-transition: color 0.2s ease 0s;
  665. -o-transition: color 0.2s ease 0s;
  666. }
  667. .fr-modal .fr-modal-wrapper .fr-modal-head h4 {
  668. font-size: 18px;
  669. padding: 12px 10px;
  670. margin: 0;
  671. font-weight: 400;
  672. line-height: 18px;
  673. display: inline-block;
  674. float: left;
  675. }
  676. .fr-modal .fr-modal-wrapper div.fr-modal-body {
  677. height: 100%;
  678. min-height: 150px;
  679. overflow-y: scroll;
  680. padding-bottom: 10px;
  681. }
  682. .fr-modal .fr-modal-wrapper div.fr-modal-body:focus {
  683. outline: 0;
  684. }
  685. .fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command {
  686. height: 36px;
  687. line-height: 1;
  688. color: #1e88e5;
  689. padding: 10px;
  690. cursor: pointer;
  691. text-decoration: none;
  692. border: none;
  693. background: none;
  694. font-size: 16px;
  695. outline: none;
  696. -webkit-transition: background 0.2s ease 0s;
  697. -moz-transition: background 0.2s ease 0s;
  698. -ms-transition: background 0.2s ease 0s;
  699. -o-transition: background 0.2s ease 0s;
  700. border-radius: 2px;
  701. -moz-border-radius: 2px;
  702. -webkit-border-radius: 2px;
  703. -moz-background-clip: padding;
  704. -webkit-background-clip: padding-box;
  705. background-clip: padding-box;
  706. }
  707. .fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command + button {
  708. margin-left: 24px;
  709. }
  710. .fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command:hover,
  711. .fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command:focus {
  712. background: #ebebeb;
  713. color: #1e88e5;
  714. }
  715. .fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command:active {
  716. background: #d6d6d6;
  717. color: #1e88e5;
  718. }
  719. .fr-modal .fr-modal-wrapper div.fr-modal-body button::-moz-focus-inner {
  720. border: 0;
  721. }
  722. .fr-desktop .fr-modal-wrapper .fr-modal-head i:hover {
  723. background: #ebebeb;
  724. }
  725. .fr-overlay {
  726. position: fixed;
  727. top: 0;
  728. bottom: 0;
  729. left: 0;
  730. right: 0;
  731. background: #000000;
  732. -webkit-opacity: 0.5;
  733. -moz-opacity: 0.5;
  734. opacity: 0.5;
  735. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  736. z-index: 2147483639;
  737. }
  738. .fr-popup {
  739. position: absolute;
  740. display: none;
  741. color: #222222;
  742. background: #ffffff;
  743. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  744. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  745. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  746. border-radius: 2px;
  747. -moz-border-radius: 2px;
  748. -webkit-border-radius: 2px;
  749. -moz-background-clip: padding;
  750. -webkit-background-clip: padding-box;
  751. background-clip: padding-box;
  752. font-family: Arial, Helvetica, sans-serif;
  753. -webkit-box-sizing: border-box;
  754. -moz-box-sizing: border-box;
  755. box-sizing: border-box;
  756. user-select: none;
  757. -o-user-select: none;
  758. -moz-user-select: none;
  759. -khtml-user-select: none;
  760. -webkit-user-select: none;
  761. -ms-user-select: none;
  762. margin-top: 10px;
  763. z-index: 2147483635;
  764. text-align: left;
  765. border: 0px;
  766. border-top: 5px solid #222222;
  767. text-rendering: optimizelegibility;
  768. -webkit-font-smoothing: antialiased;
  769. -moz-osx-font-smoothing: grayscale;
  770. line-height: 1.2;
  771. }
  772. .fr-popup .fr-input-focus {
  773. background: #f5f5f5;
  774. }
  775. .fr-popup.fr-above {
  776. margin-top: -10px;
  777. border-top: 0;
  778. border-bottom: 5px solid #222222;
  779. -webkit-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  780. -moz-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  781. box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  782. }
  783. .fr-popup.fr-active {
  784. display: block;
  785. }
  786. .fr-popup.fr-hidden {
  787. -webkit-opacity: 0;
  788. -moz-opacity: 0;
  789. opacity: 0;
  790. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  791. }
  792. .fr-popup.fr-empty {
  793. display: none !important;
  794. }
  795. .fr-popup .fr-hs {
  796. display: block !important;
  797. }
  798. .fr-popup .fr-hs.fr-hidden {
  799. display: none !important;
  800. }
  801. .fr-popup .fr-input-line {
  802. position: relative;
  803. padding: 8px 0;
  804. }
  805. .fr-popup .fr-input-line input[type="text"],
  806. .fr-popup .fr-input-line textarea {
  807. width: 100%;
  808. margin: 0px 0 1px 0;
  809. border: none;
  810. border-bottom: solid 1px #bdbdbd;
  811. color: #222222;
  812. font-size: 14px;
  813. padding: 6px 0 2px;
  814. background: rgba(0, 0, 0, 0);
  815. position: relative;
  816. z-index: 2;
  817. -webkit-box-sizing: border-box;
  818. -moz-box-sizing: border-box;
  819. box-sizing: border-box;
  820. }
  821. .fr-popup .fr-input-line input[type="text"]:focus,
  822. .fr-popup .fr-input-line textarea:focus {
  823. border-bottom: solid 2px #1e88e5;
  824. margin-bottom: 0px;
  825. }
  826. .fr-popup .fr-input-line input + label,
  827. .fr-popup .fr-input-line textarea + label {
  828. position: absolute;
  829. top: 0;
  830. left: 0;
  831. font-size: 12px;
  832. color: rgba(0, 0, 0, 0);
  833. -webkit-transition: color 0.2s ease 0s;
  834. -moz-transition: color 0.2s ease 0s;
  835. -ms-transition: color 0.2s ease 0s;
  836. -o-transition: color 0.2s ease 0s;
  837. z-index: 3;
  838. width: 100%;
  839. display: block;
  840. background: #ffffff;
  841. }
  842. .fr-popup .fr-input-line input.fr-not-empty:focus + label,
  843. .fr-popup .fr-input-line textarea.fr-not-empty:focus + label {
  844. color: #1e88e5;
  845. }
  846. .fr-popup .fr-input-line input.fr-not-empty + label,
  847. .fr-popup .fr-input-line textarea.fr-not-empty + label {
  848. color: #808080;
  849. }
  850. .fr-popup input,
  851. .fr-popup textarea {
  852. user-select: text;
  853. -o-user-select: text;
  854. -moz-user-select: text;
  855. -khtml-user-select: text;
  856. -webkit-user-select: text;
  857. -ms-user-select: text;
  858. border-radius: 0;
  859. -moz-border-radius: 0;
  860. -webkit-border-radius: 0;
  861. -moz-background-clip: padding;
  862. -webkit-background-clip: padding-box;
  863. background-clip: padding-box;
  864. outline: none;
  865. }
  866. .fr-popup textarea {
  867. resize: none;
  868. }
  869. .fr-popup .fr-buttons {
  870. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  871. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  872. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  873. padding: 0 2px;
  874. white-space: nowrap;
  875. line-height: 0;
  876. border-bottom: 0px;
  877. }
  878. .fr-popup .fr-buttons::after {
  879. clear: both;
  880. display: block;
  881. content: "";
  882. height: 0;
  883. }
  884. .fr-popup .fr-buttons .fr-btn {
  885. display: inline-block;
  886. float: none;
  887. }
  888. .fr-popup .fr-buttons .fr-btn i {
  889. float: left;
  890. }
  891. .fr-popup .fr-buttons .fr-separator {
  892. display: inline-block;
  893. float: none;
  894. }
  895. .fr-popup .fr-layer {
  896. width: 225px;
  897. -webkit-box-sizing: border-box;
  898. -moz-box-sizing: border-box;
  899. box-sizing: border-box;
  900. margin: 10px;
  901. display: none;
  902. }
  903. @media (min-width: 768px) {
  904. .fr-popup .fr-layer {
  905. width: 300px;
  906. }
  907. }
  908. .fr-popup .fr-layer.fr-active {
  909. display: inline-block;
  910. }
  911. .fr-popup .fr-action-buttons {
  912. z-index: 7;
  913. height: 36px;
  914. text-align: right;
  915. }
  916. .fr-popup .fr-action-buttons button.fr-command {
  917. height: 36px;
  918. line-height: 1;
  919. color: #1e88e5;
  920. padding: 10px;
  921. cursor: pointer;
  922. text-decoration: none;
  923. border: none;
  924. background: none;
  925. font-size: 16px;
  926. outline: none;
  927. -webkit-transition: background 0.2s ease 0s;
  928. -moz-transition: background 0.2s ease 0s;
  929. -ms-transition: background 0.2s ease 0s;
  930. -o-transition: background 0.2s ease 0s;
  931. border-radius: 2px;
  932. -moz-border-radius: 2px;
  933. -webkit-border-radius: 2px;
  934. -moz-background-clip: padding;
  935. -webkit-background-clip: padding-box;
  936. background-clip: padding-box;
  937. }
  938. .fr-popup .fr-action-buttons button.fr-command + button {
  939. margin-left: 24px;
  940. }
  941. .fr-popup .fr-action-buttons button.fr-command:hover,
  942. .fr-popup .fr-action-buttons button.fr-command:focus {
  943. background: #ebebeb;
  944. color: #1e88e5;
  945. }
  946. .fr-popup .fr-action-buttons button.fr-command:active {
  947. background: #d6d6d6;
  948. color: #1e88e5;
  949. }
  950. .fr-popup .fr-action-buttons button::-moz-focus-inner {
  951. border: 0;
  952. }
  953. .fr-popup .fr-checkbox {
  954. position: relative;
  955. display: inline-block;
  956. width: 16px;
  957. height: 16px;
  958. line-height: 1;
  959. -webkit-box-sizing: content-box;
  960. -moz-box-sizing: content-box;
  961. box-sizing: content-box;
  962. vertical-align: middle;
  963. }
  964. .fr-popup .fr-checkbox svg {
  965. margin-left: 2px;
  966. margin-top: 2px;
  967. display: none;
  968. width: 10px;
  969. height: 10px;
  970. }
  971. .fr-popup .fr-checkbox span {
  972. border: solid 1px #222222;
  973. border-radius: 2px;
  974. -moz-border-radius: 2px;
  975. -webkit-border-radius: 2px;
  976. -moz-background-clip: padding;
  977. -webkit-background-clip: padding-box;
  978. background-clip: padding-box;
  979. width: 16px;
  980. height: 16px;
  981. display: inline-block;
  982. position: relative;
  983. z-index: 1;
  984. -webkit-box-sizing: border-box;
  985. -moz-box-sizing: border-box;
  986. box-sizing: border-box;
  987. -webkit-transition: background 0.2s ease 0s, border-color 0.2s ease 0s;
  988. -moz-transition: background 0.2s ease 0s, border-color 0.2s ease 0s;
  989. -ms-transition: background 0.2s ease 0s, border-color 0.2s ease 0s;
  990. -o-transition: background 0.2s ease 0s, border-color 0.2s ease 0s;
  991. }
  992. .fr-popup .fr-checkbox input {
  993. position: absolute;
  994. z-index: 2;
  995. -webkit-opacity: 0;
  996. -moz-opacity: 0;
  997. opacity: 0;
  998. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  999. border: 0 none;
  1000. cursor: pointer;
  1001. height: 16px;
  1002. margin: 0;
  1003. padding: 0;
  1004. width: 16px;
  1005. top: 1px;
  1006. left: 1px;
  1007. }
  1008. .fr-popup .fr-checkbox input:checked + span {
  1009. background: #1e88e5;
  1010. border-color: #1e88e5;
  1011. }
  1012. .fr-popup .fr-checkbox input:checked + span svg {
  1013. display: block;
  1014. }
  1015. .fr-popup .fr-checkbox input:focus + span {
  1016. border-color: #1e88e5;
  1017. }
  1018. .fr-popup .fr-checkbox-line {
  1019. font-size: 14px;
  1020. line-height: 1.4px;
  1021. margin-top: 10px;
  1022. }
  1023. .fr-popup .fr-checkbox-line label {
  1024. cursor: pointer;
  1025. margin: 0 5px;
  1026. vertical-align: middle;
  1027. }
  1028. .fr-popup.fr-rtl {
  1029. direction: rtl;
  1030. text-align: right;
  1031. }
  1032. .fr-popup.fr-rtl .fr-action-buttons {
  1033. text-align: left;
  1034. }
  1035. .fr-popup.fr-rtl .fr-input-line input + label,
  1036. .fr-popup.fr-rtl .fr-input-line textarea + label {
  1037. left: auto;
  1038. right: 0;
  1039. }
  1040. .fr-popup.fr-rtl .fr-buttons .fr-separator.fr-vs {
  1041. float: right;
  1042. }
  1043. .fr-popup .fr-arrow {
  1044. width: 0;
  1045. height: 0;
  1046. border-left: 5px solid transparent;
  1047. border-right: 5px solid transparent;
  1048. border-bottom: 5px solid #222222;
  1049. position: absolute;
  1050. top: -9px;
  1051. left: 50%;
  1052. margin-left: -5px;
  1053. display: inline-block;
  1054. }
  1055. .fr-popup.fr-above .fr-arrow {
  1056. top: auto;
  1057. bottom: -9px;
  1058. border-bottom: 0;
  1059. border-top: 5px solid #222222;
  1060. }
  1061. .fr-text-edit-layer {
  1062. width: 250px;
  1063. -webkit-box-sizing: border-box;
  1064. -moz-box-sizing: border-box;
  1065. box-sizing: border-box;
  1066. display: block !important;
  1067. }
  1068. .fr-toolbar {
  1069. color: #222222;
  1070. background: #ffffff;
  1071. position: relative;
  1072. z-index: 4;
  1073. font-family: Arial, Helvetica, sans-serif;
  1074. -webkit-box-sizing: border-box;
  1075. -moz-box-sizing: border-box;
  1076. box-sizing: border-box;
  1077. user-select: none;
  1078. -o-user-select: none;
  1079. -moz-user-select: none;
  1080. -khtml-user-select: none;
  1081. -webkit-user-select: none;
  1082. -ms-user-select: none;
  1083. padding: 0 2px;
  1084. border-radius: 2px;
  1085. -moz-border-radius: 2px;
  1086. -webkit-border-radius: 2px;
  1087. -moz-background-clip: padding;
  1088. -webkit-background-clip: padding-box;
  1089. background-clip: padding-box;
  1090. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1091. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1092. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1093. text-align: left;
  1094. border: 0px;
  1095. border-top: 5px solid #222222;
  1096. text-rendering: optimizelegibility;
  1097. -webkit-font-smoothing: antialiased;
  1098. -moz-osx-font-smoothing: grayscale;
  1099. line-height: 1.2;
  1100. }
  1101. .fr-toolbar::after {
  1102. clear: both;
  1103. display: block;
  1104. content: "";
  1105. height: 0;
  1106. }
  1107. .fr-toolbar.fr-rtl {
  1108. text-align: right;
  1109. }
  1110. .fr-toolbar.fr-inline {
  1111. display: none;
  1112. white-space: nowrap;
  1113. position: absolute;
  1114. margin-top: 10px;
  1115. }
  1116. .fr-toolbar.fr-inline .fr-arrow {
  1117. width: 0;
  1118. height: 0;
  1119. border-left: 5px solid transparent;
  1120. border-right: 5px solid transparent;
  1121. border-bottom: 5px solid #222222;
  1122. position: absolute;
  1123. top: -9px;
  1124. left: 50%;
  1125. margin-left: -5px;
  1126. display: inline-block;
  1127. }
  1128. .fr-toolbar.fr-inline.fr-above {
  1129. margin-top: -10px;
  1130. -webkit-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  1131. -moz-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  1132. box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.12), 0 -1px 1px 1px rgba(0, 0, 0, 0.16);
  1133. border-bottom: 5px solid #222222;
  1134. border-top: 0;
  1135. }
  1136. .fr-toolbar.fr-inline.fr-above .fr-arrow {
  1137. top: auto;
  1138. bottom: -9px;
  1139. border-bottom: 0;
  1140. border-top-color: inherit;
  1141. border-top-style: solid;
  1142. border-top-width: 5px;
  1143. }
  1144. .fr-toolbar.fr-top {
  1145. top: 0;
  1146. border-radius: 2px 2px 0 0;
  1147. -moz-border-radius: 2px 2px 0 0;
  1148. -webkit-border-radius: 2px 2px 0 0;
  1149. -moz-background-clip: padding;
  1150. -webkit-background-clip: padding-box;
  1151. background-clip: padding-box;
  1152. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1153. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1154. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1155. }
  1156. .fr-toolbar.fr-bottom {
  1157. bottom: 0;
  1158. border-radius: 0 0 2px 2px;
  1159. -moz-border-radius: 0 0 2px 2px;
  1160. -webkit-border-radius: 0 0 2px 2px;
  1161. -moz-background-clip: padding;
  1162. -webkit-background-clip: padding-box;
  1163. background-clip: padding-box;
  1164. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1165. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1166. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1167. }
  1168. .fr-separator {
  1169. background: #ebebeb;
  1170. display: block;
  1171. vertical-align: top;
  1172. float: left;
  1173. }
  1174. .fr-separator + .fr-separator {
  1175. display: none;
  1176. }
  1177. .fr-separator.fr-vs {
  1178. height: 34px;
  1179. width: 1px;
  1180. margin: 2px;
  1181. }
  1182. .fr-separator.fr-hs {
  1183. clear: both;
  1184. height: 1px;
  1185. width: calc(100% - (2 * 2px));
  1186. margin: 0 2px;
  1187. }
  1188. .fr-separator.fr-hidden {
  1189. display: none !important;
  1190. }
  1191. .fr-rtl .fr-separator {
  1192. float: right;
  1193. }
  1194. .fr-toolbar.fr-inline .fr-separator.fr-hs {
  1195. float: none;
  1196. }
  1197. .fr-toolbar.fr-inline .fr-separator.fr-vs {
  1198. float: none;
  1199. display: inline-block;
  1200. }
  1201. .fr-visibility-helper {
  1202. display: none;
  1203. margin-left: 0px !important;
  1204. }
  1205. @media (min-width: 768px) {
  1206. .fr-visibility-helper {
  1207. margin-left: 1px !important;
  1208. }
  1209. }
  1210. @media (min-width: 992px) {
  1211. .fr-visibility-helper {
  1212. margin-left: 2px !important;
  1213. }
  1214. }
  1215. @media (min-width: 1200px) {
  1216. .fr-visibility-helper {
  1217. margin-left: 3px !important;
  1218. }
  1219. }
  1220. .fr-opacity-0 {
  1221. -webkit-opacity: 0;
  1222. -moz-opacity: 0;
  1223. opacity: 0;
  1224. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  1225. }
  1226. .fr-box {
  1227. position: relative;
  1228. }
  1229. /**
  1230. * Postion sticky hacks.
  1231. */
  1232. .fr-sticky {
  1233. position: -webkit-sticky;
  1234. position: -moz-sticky;
  1235. position: -ms-sticky;
  1236. position: -o-sticky;
  1237. position: sticky;
  1238. }
  1239. .fr-sticky-off {
  1240. position: relative;
  1241. }
  1242. .fr-sticky-on {
  1243. position: fixed;
  1244. }
  1245. .fr-sticky-on.fr-sticky-ios {
  1246. position: absolute;
  1247. left: 0;
  1248. right: 0;
  1249. width: auto !important;
  1250. }
  1251. .fr-sticky-dummy {
  1252. display: none;
  1253. }
  1254. .fr-sticky-on + .fr-sticky-dummy,
  1255. .fr-sticky-box > .fr-sticky-dummy {
  1256. display: block;
  1257. }
  1258. span.fr-sr-only {
  1259. position: absolute;
  1260. width: 1px;
  1261. height: 1px;
  1262. padding: 0;
  1263. margin: -1px;
  1264. overflow: hidden;
  1265. clip: rect(0, 0, 0, 0);
  1266. border: 0;
  1267. }
  1268. .clearfix::after {
  1269. clear: both;
  1270. display: block;
  1271. content: "";
  1272. height: 0;
  1273. }
  1274. .hide-by-clipping {
  1275. position: absolute;
  1276. width: 1px;
  1277. height: 1px;
  1278. padding: 0;
  1279. margin: -1px;
  1280. overflow: hidden;
  1281. clip: rect(0, 0, 0, 0);
  1282. border: 0;
  1283. }
  1284. .fr-box .fr-counter {
  1285. position: absolute;
  1286. bottom: 0px;
  1287. padding: 5px;
  1288. right: 0px;
  1289. color: #cccccc;
  1290. content: attr(data-chars);
  1291. font-size: 15px;
  1292. font-family: "Times New Roman", Georgia, Serif;
  1293. z-index: 1;
  1294. background: #ffffff;
  1295. border-top: solid 1px #ebebeb;
  1296. border-left: solid 1px #ebebeb;
  1297. border-radius: 2px 0 0 0;
  1298. -moz-border-radius: 2px 0 0 0;
  1299. -webkit-border-radius: 2px 0 0 0;
  1300. -moz-background-clip: padding;
  1301. -webkit-background-clip: padding-box;
  1302. background-clip: padding-box;
  1303. }
  1304. .fr-box.fr-rtl .fr-counter {
  1305. left: 0px;
  1306. right: auto;
  1307. border-left: none;
  1308. border-right: solid 1px #ebebeb;
  1309. border-radius: 0 2px 0 0;
  1310. -moz-border-radius: 0 2px 0 0;
  1311. -webkit-border-radius: 0 2px 0 0;
  1312. -moz-background-clip: padding;
  1313. -webkit-background-clip: padding-box;
  1314. background-clip: padding-box;
  1315. }
  1316. .fr-box.fr-code-view .fr-counter {
  1317. display: none;
  1318. }
  1319. .clearfix::after {
  1320. clear: both;
  1321. display: block;
  1322. content: "";
  1323. height: 0;
  1324. }
  1325. .hide-by-clipping {
  1326. position: absolute;
  1327. width: 1px;
  1328. height: 1px;
  1329. padding: 0;
  1330. margin: -1px;
  1331. overflow: hidden;
  1332. clip: rect(0, 0, 0, 0);
  1333. border: 0;
  1334. }
  1335. textarea.fr-code {
  1336. display: none;
  1337. width: 100%;
  1338. resize: none;
  1339. -moz-resize: none;
  1340. -webkit-resize: none;
  1341. -webkit-box-sizing: border-box;
  1342. -moz-box-sizing: border-box;
  1343. box-sizing: border-box;
  1344. border: none;
  1345. padding: 10px;
  1346. margin: 0px;
  1347. font-family: "Courier New", monospace;
  1348. font-size: 14px;
  1349. background: #ffffff;
  1350. color: #000000;
  1351. outline: none;
  1352. }
  1353. .fr-box.fr-rtl textarea.fr-code {
  1354. direction: rtl;
  1355. }
  1356. .fr-box .CodeMirror {
  1357. display: none;
  1358. }
  1359. .fr-box.fr-code-view textarea.fr-code {
  1360. display: block;
  1361. }
  1362. .fr-box.fr-code-view.fr-inline {
  1363. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1364. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1365. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1366. }
  1367. .fr-box.fr-code-view .fr-element,
  1368. .fr-box.fr-code-view .fr-placeholder,
  1369. .fr-box.fr-code-view .fr-iframe {
  1370. display: none;
  1371. }
  1372. .fr-box.fr-code-view .CodeMirror {
  1373. display: block;
  1374. }
  1375. .fr-box.fr-inline.fr-code-view .fr-command.fr-btn.html-switch {
  1376. display: block;
  1377. }
  1378. .fr-box.fr-inline .fr-command.fr-btn.html-switch {
  1379. position: absolute;
  1380. top: 0;
  1381. right: 0;
  1382. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1383. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1384. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1385. display: none;
  1386. background: #ffffff;
  1387. color: #222222;
  1388. -moz-outline: 0;
  1389. outline: 0;
  1390. border: 0;
  1391. line-height: 1;
  1392. cursor: pointer;
  1393. text-align: left;
  1394. padding: 12px 12px;
  1395. -webkit-transition: background 0.2s ease 0s;
  1396. -moz-transition: background 0.2s ease 0s;
  1397. -ms-transition: background 0.2s ease 0s;
  1398. -o-transition: background 0.2s ease 0s;
  1399. border-radius: 0;
  1400. -moz-border-radius: 0;
  1401. -webkit-border-radius: 0;
  1402. -moz-background-clip: padding;
  1403. -webkit-background-clip: padding-box;
  1404. background-clip: padding-box;
  1405. z-index: 2;
  1406. -webkit-box-sizing: border-box;
  1407. -moz-box-sizing: border-box;
  1408. box-sizing: border-box;
  1409. text-decoration: none;
  1410. user-select: none;
  1411. -o-user-select: none;
  1412. -moz-user-select: none;
  1413. -khtml-user-select: none;
  1414. -webkit-user-select: none;
  1415. -ms-user-select: none;
  1416. }
  1417. .fr-box.fr-inline .fr-command.fr-btn.html-switch i {
  1418. font-size: 14px;
  1419. width: 14px;
  1420. text-align: center;
  1421. }
  1422. .fr-box.fr-inline .fr-command.fr-btn.html-switch.fr-desktop:hover {
  1423. background: #ebebeb;
  1424. }
  1425. .clearfix::after {
  1426. clear: both;
  1427. display: block;
  1428. content: "";
  1429. height: 0;
  1430. }
  1431. .hide-by-clipping {
  1432. position: absolute;
  1433. width: 1px;
  1434. height: 1px;
  1435. padding: 0;
  1436. margin: -1px;
  1437. overflow: hidden;
  1438. clip: rect(0, 0, 0, 0);
  1439. border: 0;
  1440. }
  1441. .fr-popup .fr-colors-tabs {
  1442. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1443. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1444. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  1445. margin-bottom: 5px;
  1446. line-height: 16px;
  1447. margin-left: -2px;
  1448. margin-right: -2px;
  1449. }
  1450. .fr-popup .fr-colors-tabs .fr-colors-tab {
  1451. display: inline-block;
  1452. width: 50%;
  1453. cursor: pointer;
  1454. text-align: center;
  1455. color: #222222;
  1456. font-size: 13px;
  1457. padding: 8px 0;
  1458. position: relative;
  1459. }
  1460. .fr-popup .fr-colors-tabs .fr-colors-tab:hover,
  1461. .fr-popup .fr-colors-tabs .fr-colors-tab:focus {
  1462. color: #1e88e5;
  1463. }
  1464. .fr-popup .fr-colors-tabs .fr-colors-tab[data-param1="background"]::after {
  1465. position: absolute;
  1466. bottom: 0;
  1467. left: 0;
  1468. width: 100%;
  1469. height: 2px;
  1470. background: #1e88e5;
  1471. content: '';
  1472. -webkit-transition: transform 0.2s ease 0s;
  1473. -moz-transition: transform 0.2s ease 0s;
  1474. -ms-transition: transform 0.2s ease 0s;
  1475. -o-transition: transform 0.2s ease 0s;
  1476. }
  1477. .fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab {
  1478. color: #1e88e5;
  1479. }
  1480. .fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab[data-param1="text"] ~ [data-param1="background"]::after {
  1481. -webkit-transform: translate3d(-100%, 0, 0);
  1482. -moz-transform: translate3d(-100%, 0, 0);
  1483. -ms-transform: translate3d(-100%, 0, 0);
  1484. -o-transform: translate3d(-100%, 0, 0);
  1485. }
  1486. .fr-popup .fr-color-hex-layer {
  1487. width: 100%;
  1488. margin: 0px;
  1489. padding: 10px;
  1490. }
  1491. .fr-popup .fr-color-hex-layer .fr-input-line {
  1492. float: left;
  1493. width: calc(100% - 50px);
  1494. padding: 8px 0 0;
  1495. }
  1496. .fr-popup .fr-color-hex-layer .fr-action-buttons {
  1497. float: right;
  1498. width: 50px;
  1499. }
  1500. .fr-popup .fr-color-hex-layer .fr-action-buttons button {
  1501. background-color: #1e88e5;
  1502. color: #FFF;
  1503. border-radius: 2px;
  1504. -moz-border-radius: 2px;
  1505. -webkit-border-radius: 2px;
  1506. -moz-background-clip: padding;
  1507. -webkit-background-clip: padding-box;
  1508. background-clip: padding-box;
  1509. font-size: 13px;
  1510. height: 32px;
  1511. }
  1512. .fr-popup .fr-color-hex-layer .fr-action-buttons button:hover {
  1513. background-color: #166dba;
  1514. color: #FFF;
  1515. }
  1516. .fr-popup .fr-separator + .fr-colors-tabs {
  1517. -webkit-box-shadow: none;
  1518. -moz-box-shadow: none;
  1519. box-shadow: none;
  1520. margin-left: 2px;
  1521. margin-right: 2px;
  1522. }
  1523. .fr-popup .fr-color-set {
  1524. line-height: 0;
  1525. display: none;
  1526. }
  1527. .fr-popup .fr-color-set.fr-selected-set {
  1528. display: block;
  1529. }
  1530. .fr-popup .fr-color-set > span {
  1531. display: inline-block;
  1532. width: 32px;
  1533. height: 32px;
  1534. position: relative;
  1535. z-index: 1;
  1536. }
  1537. .fr-popup .fr-color-set > span > i,
  1538. .fr-popup .fr-color-set > span > svg {
  1539. text-align: center;
  1540. line-height: 32px;
  1541. height: 32px;
  1542. width: 32px;
  1543. font-size: 13px;
  1544. position: absolute;
  1545. bottom: 0;
  1546. cursor: default;
  1547. left: 0;
  1548. }
  1549. .fr-popup .fr-color-set > span .fr-selected-color {
  1550. color: #ffffff;
  1551. font-family: FontAwesome;
  1552. font-size: 13px;
  1553. font-weight: 400;
  1554. line-height: 32px;
  1555. position: absolute;
  1556. top: 0;
  1557. bottom: 0;
  1558. right: 0;
  1559. left: 0;
  1560. text-align: center;
  1561. cursor: default;
  1562. }
  1563. .fr-popup .fr-color-set > span:hover,
  1564. .fr-popup .fr-color-set > span:focus {
  1565. outline: 1px solid #222222;
  1566. z-index: 2;
  1567. }
  1568. .fr-rtl .fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab[data-param1="text"] ~ [data-param1="background"]::after {
  1569. -webkit-transform: translate3d(100%, 0, 0);
  1570. -moz-transform: translate3d(100%, 0, 0);
  1571. -ms-transform: translate3d(100%, 0, 0);
  1572. -o-transform: translate3d(100%, 0, 0);
  1573. }
  1574. .clearfix::after {
  1575. clear: both;
  1576. display: block;
  1577. content: "";
  1578. height: 0;
  1579. }
  1580. .hide-by-clipping {
  1581. position: absolute;
  1582. width: 1px;
  1583. height: 1px;
  1584. padding: 0;
  1585. margin: -1px;
  1586. overflow: hidden;
  1587. clip: rect(0, 0, 0, 0);
  1588. border: 0;
  1589. }
  1590. .fr-drag-helper {
  1591. background: #1e88e5;
  1592. height: 2px;
  1593. margin-top: -1px;
  1594. -webkit-opacity: 0.2;
  1595. -moz-opacity: 0.2;
  1596. opacity: 0.2;
  1597. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  1598. position: absolute;
  1599. z-index: 2147483640;
  1600. display: none;
  1601. }
  1602. .fr-drag-helper.fr-visible {
  1603. display: block;
  1604. }
  1605. .fr-dragging {
  1606. -webkit-opacity: 0.4;
  1607. -moz-opacity: 0.4;
  1608. opacity: 0.4;
  1609. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  1610. }
  1611. .clearfix::after {
  1612. clear: both;
  1613. display: block;
  1614. content: "";
  1615. height: 0;
  1616. }
  1617. .hide-by-clipping {
  1618. position: absolute;
  1619. width: 1px;
  1620. height: 1px;
  1621. padding: 0;
  1622. margin: -1px;
  1623. overflow: hidden;
  1624. clip: rect(0, 0, 0, 0);
  1625. border: 0;
  1626. }
  1627. .fr-popup .fr-emoticon {
  1628. display: inline-block;
  1629. font-size: 20px;
  1630. width: 20px;
  1631. padding: 5px;
  1632. line-height: 1;
  1633. cursor: default;
  1634. font-weight: normal;
  1635. font-family: "Apple Color Emoji", "Segoe UI Emoji", "NotoColorEmoji", "Segoe UI Symbol", "Android Emoji", "EmojiSymbols";
  1636. -webkit-box-sizing: content-box;
  1637. -moz-box-sizing: content-box;
  1638. box-sizing: content-box;
  1639. }
  1640. .fr-popup .fr-emoticon img {
  1641. height: 20px;
  1642. }
  1643. .fr-popup .fr-link:focus {
  1644. outline: 0;
  1645. background: #ebebeb;
  1646. }
  1647. .clearfix::after {
  1648. clear: both;
  1649. display: block;
  1650. content: "";
  1651. height: 0;
  1652. }
  1653. .hide-by-clipping {
  1654. position: absolute;
  1655. width: 1px;
  1656. height: 1px;
  1657. padding: 0;
  1658. margin: -1px;
  1659. overflow: hidden;
  1660. clip: rect(0, 0, 0, 0);
  1661. border: 0;
  1662. }
  1663. .fr-popup .fr-file-upload-layer {
  1664. border: dashed 2px #bdbdbd;
  1665. padding: 25px 0;
  1666. position: relative;
  1667. font-size: 14px;
  1668. letter-spacing: 1px;
  1669. line-height: 140%;
  1670. -webkit-box-sizing: border-box;
  1671. -moz-box-sizing: border-box;
  1672. box-sizing: border-box;
  1673. text-align: center;
  1674. }
  1675. .fr-popup .fr-file-upload-layer:hover {
  1676. background: #ebebeb;
  1677. }
  1678. .fr-popup .fr-file-upload-layer.fr-drop {
  1679. background: #ebebeb;
  1680. border-color: #1e88e5;
  1681. }
  1682. .fr-popup .fr-file-upload-layer .fr-form {
  1683. -webkit-opacity: 0;
  1684. -moz-opacity: 0;
  1685. opacity: 0;
  1686. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  1687. position: absolute;
  1688. top: 0;
  1689. bottom: 0;
  1690. left: 0;
  1691. right: 0;
  1692. z-index: 2147483640;
  1693. overflow: hidden;
  1694. margin: 0 !important;
  1695. padding: 0 !important;
  1696. width: 100% !important;
  1697. }
  1698. .fr-popup .fr-file-upload-layer .fr-form input {
  1699. cursor: pointer;
  1700. position: absolute;
  1701. right: 0px;
  1702. top: 0px;
  1703. bottom: 0px;
  1704. width: 500%;
  1705. height: 100%;
  1706. margin: 0px;
  1707. font-size: 400px;
  1708. }
  1709. .fr-popup .fr-file-progress-bar-layer {
  1710. -webkit-box-sizing: border-box;
  1711. -moz-box-sizing: border-box;
  1712. box-sizing: border-box;
  1713. }
  1714. .fr-popup .fr-file-progress-bar-layer > h3 {
  1715. font-size: 16px;
  1716. margin: 10px 0;
  1717. font-weight: normal;
  1718. }
  1719. .fr-popup .fr-file-progress-bar-layer > div.fr-action-buttons {
  1720. display: none;
  1721. }
  1722. .fr-popup .fr-file-progress-bar-layer > div.fr-loader {
  1723. background: #bcdbf7;
  1724. height: 10px;
  1725. width: 100%;
  1726. margin-top: 20px;
  1727. overflow: hidden;
  1728. position: relative;
  1729. }
  1730. .fr-popup .fr-file-progress-bar-layer > div.fr-loader span {
  1731. display: block;
  1732. height: 100%;
  1733. width: 0%;
  1734. background: #1e88e5;
  1735. -webkit-transition: width 0.2s ease 0s;
  1736. -moz-transition: width 0.2s ease 0s;
  1737. -ms-transition: width 0.2s ease 0s;
  1738. -o-transition: width 0.2s ease 0s;
  1739. }
  1740. .fr-popup .fr-file-progress-bar-layer > div.fr-loader.fr-indeterminate span {
  1741. width: 30% !important;
  1742. position: absolute;
  1743. top: 0;
  1744. -webkit-animation: loading 2s linear infinite;
  1745. -moz-animation: loading 2s linear infinite;
  1746. -o-animation: loading 2s linear infinite;
  1747. animation: loading 2s linear infinite;
  1748. }
  1749. .fr-popup .fr-file-progress-bar-layer.fr-error > div.fr-loader {
  1750. display: none;
  1751. }
  1752. .fr-popup .fr-file-progress-bar-layer.fr-error > div.fr-action-buttons {
  1753. display: block;
  1754. }
  1755. @keyframes loading {
  1756. from {
  1757. left: -25%;
  1758. }
  1759. to {
  1760. left: 100%;
  1761. }
  1762. }
  1763. @-webkit-keyframes loading {
  1764. from {
  1765. left: -25%;
  1766. }
  1767. to {
  1768. left: 100%;
  1769. }
  1770. }
  1771. @-moz-keyframes loading {
  1772. from {
  1773. left: -25%;
  1774. }
  1775. to {
  1776. left: 100%;
  1777. }
  1778. }
  1779. @-o-keyframes loading {
  1780. from {
  1781. left: -25%;
  1782. }
  1783. to {
  1784. left: 100%;
  1785. }
  1786. }
  1787. body.fr-fullscreen {
  1788. overflow: hidden;
  1789. height: 100%;
  1790. width: 100%;
  1791. position: fixed;
  1792. }
  1793. .fr-box.fr-fullscreen {
  1794. margin: 0 !important;
  1795. position: fixed;
  1796. top: 0;
  1797. left: 0;
  1798. bottom: 0;
  1799. right: 0;
  1800. z-index: 2147483630 !important;
  1801. width: auto !important;
  1802. }
  1803. .fr-box.fr-fullscreen .fr-toolbar.fr-top {
  1804. top: 0 !important;
  1805. }
  1806. .fr-box.fr-fullscreen .fr-toolbar.fr-bottom {
  1807. bottom: 0 !important;
  1808. }
  1809. .clearfix::after {
  1810. clear: both;
  1811. display: block;
  1812. content: "";
  1813. height: 0;
  1814. }
  1815. .hide-by-clipping {
  1816. position: absolute;
  1817. width: 1px;
  1818. height: 1px;
  1819. padding: 0;
  1820. margin: -1px;
  1821. overflow: hidden;
  1822. clip: rect(0, 0, 0, 0);
  1823. border: 0;
  1824. }
  1825. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal {
  1826. text-align: left;
  1827. padding: 20px 20px 10px;
  1828. }
  1829. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table {
  1830. border-collapse: collapse;
  1831. font-size: 14px;
  1832. line-height: 1.5;
  1833. width: 100%;
  1834. }
  1835. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table + table {
  1836. margin-top: 20px;
  1837. }
  1838. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tr {
  1839. border: 0;
  1840. }
  1841. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table th,
  1842. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table td {
  1843. padding: 6px 0 4px;
  1844. }
  1845. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody tr {
  1846. border-bottom: solid 1px #ebebeb;
  1847. }
  1848. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:first-child {
  1849. width: 60%;
  1850. color: #646464;
  1851. }
  1852. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:nth-child(n+2) {
  1853. letter-spacing: 0.5px;
  1854. }
  1855. .clearfix::after {
  1856. clear: both;
  1857. display: block;
  1858. content: "";
  1859. height: 0;
  1860. }
  1861. .hide-by-clipping {
  1862. position: absolute;
  1863. width: 1px;
  1864. height: 1px;
  1865. padding: 0;
  1866. margin: -1px;
  1867. overflow: hidden;
  1868. clip: rect(0, 0, 0, 0);
  1869. border: 0;
  1870. }
  1871. .fr-element img {
  1872. cursor: pointer;
  1873. }
  1874. .fr-image-resizer {
  1875. position: absolute;
  1876. border: solid 1px #1e88e5;
  1877. display: none;
  1878. user-select: none;
  1879. -o-user-select: none;
  1880. -moz-user-select: none;
  1881. -khtml-user-select: none;
  1882. -webkit-user-select: none;
  1883. -ms-user-select: none;
  1884. -webkit-box-sizing: content-box;
  1885. -moz-box-sizing: content-box;
  1886. box-sizing: content-box;
  1887. }
  1888. .fr-image-resizer.fr-active {
  1889. display: block;
  1890. }
  1891. .fr-image-resizer .fr-handler {
  1892. display: block;
  1893. position: absolute;
  1894. background: #1e88e5;
  1895. border: solid 1px #ffffff;
  1896. z-index: 4;
  1897. -webkit-box-sizing: border-box;
  1898. -moz-box-sizing: border-box;
  1899. box-sizing: border-box;
  1900. }
  1901. .fr-image-resizer .fr-handler.fr-hnw {
  1902. cursor: nw-resize;
  1903. }
  1904. .fr-image-resizer .fr-handler.fr-hne {
  1905. cursor: ne-resize;
  1906. }
  1907. .fr-image-resizer .fr-handler.fr-hsw {
  1908. cursor: sw-resize;
  1909. }
  1910. .fr-image-resizer .fr-handler.fr-hse {
  1911. cursor: se-resize;
  1912. }
  1913. .fr-image-resizer .fr-handler {
  1914. width: 12px;
  1915. height: 12px;
  1916. }
  1917. .fr-image-resizer .fr-handler.fr-hnw {
  1918. left: -6px;
  1919. top: -6px;
  1920. }
  1921. .fr-image-resizer .fr-handler.fr-hne {
  1922. right: -6px;
  1923. top: -6px;
  1924. }
  1925. .fr-image-resizer .fr-handler.fr-hsw {
  1926. left: -6px;
  1927. bottom: -6px;
  1928. }
  1929. .fr-image-resizer .fr-handler.fr-hse {
  1930. right: -6px;
  1931. bottom: -6px;
  1932. }
  1933. @media (min-width: 1200px) {
  1934. .fr-image-resizer .fr-handler {
  1935. width: 10px;
  1936. height: 10px;
  1937. }
  1938. .fr-image-resizer .fr-handler.fr-hnw {
  1939. left: -5px;
  1940. top: -5px;
  1941. }
  1942. .fr-image-resizer .fr-handler.fr-hne {
  1943. right: -5px;
  1944. top: -5px;
  1945. }
  1946. .fr-image-resizer .fr-handler.fr-hsw {
  1947. left: -5px;
  1948. bottom: -5px;
  1949. }
  1950. .fr-image-resizer .fr-handler.fr-hse {
  1951. right: -5px;
  1952. bottom: -5px;
  1953. }
  1954. }
  1955. .fr-image-overlay {
  1956. position: fixed;
  1957. top: 0;
  1958. left: 0;
  1959. bottom: 0;
  1960. right: 0;
  1961. z-index: 2147483640;
  1962. display: none;
  1963. }
  1964. .fr-popup .fr-image-upload-layer {
  1965. border: dashed 2px #bdbdbd;
  1966. padding: 25px 0;
  1967. position: relative;
  1968. font-size: 14px;
  1969. letter-spacing: 1px;
  1970. line-height: 140%;
  1971. text-align: center;
  1972. }
  1973. .fr-popup .fr-image-upload-layer:hover {
  1974. background: #ebebeb;
  1975. }
  1976. .fr-popup .fr-image-upload-layer.fr-drop {
  1977. background: #ebebeb;
  1978. border-color: #1e88e5;
  1979. }
  1980. .fr-popup .fr-image-upload-layer .fr-form {
  1981. -webkit-opacity: 0;
  1982. -moz-opacity: 0;
  1983. opacity: 0;
  1984. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  1985. position: absolute;
  1986. top: 0;
  1987. bottom: 0;
  1988. left: 0;
  1989. right: 0;
  1990. z-index: 2147483640;
  1991. overflow: hidden;
  1992. margin: 0 !important;
  1993. padding: 0 !important;
  1994. width: 100% !important;
  1995. }
  1996. .fr-popup .fr-image-upload-layer .fr-form input {
  1997. cursor: pointer;
  1998. position: absolute;
  1999. right: 0px;
  2000. top: 0px;
  2001. bottom: 0px;
  2002. width: 500%;
  2003. height: 100%;
  2004. margin: 0px;
  2005. font-size: 400px;
  2006. }
  2007. .fr-popup .fr-image-progress-bar-layer > h3 {
  2008. font-size: 16px;
  2009. margin: 10px 0;
  2010. font-weight: normal;
  2011. }
  2012. .fr-popup .fr-image-progress-bar-layer > div.fr-action-buttons {
  2013. display: none;
  2014. }
  2015. .fr-popup .fr-image-progress-bar-layer > div.fr-loader {
  2016. background: #bcdbf7;
  2017. height: 10px;
  2018. width: 100%;
  2019. margin-top: 20px;
  2020. overflow: hidden;
  2021. position: relative;
  2022. }
  2023. .fr-popup .fr-image-progress-bar-layer > div.fr-loader span {
  2024. display: block;
  2025. height: 100%;
  2026. width: 0%;
  2027. background: #1e88e5;
  2028. -webkit-transition: width 0.2s ease 0s;
  2029. -moz-transition: width 0.2s ease 0s;
  2030. -ms-transition: width 0.2s ease 0s;
  2031. -o-transition: width 0.2s ease 0s;
  2032. }
  2033. .fr-popup .fr-image-progress-bar-layer > div.fr-loader.fr-indeterminate span {
  2034. width: 30% !important;
  2035. position: absolute;
  2036. top: 0;
  2037. -webkit-animation: loading 2s linear infinite;
  2038. -moz-animation: loading 2s linear infinite;
  2039. -o-animation: loading 2s linear infinite;
  2040. animation: loading 2s linear infinite;
  2041. }
  2042. .fr-popup .fr-image-progress-bar-layer.fr-error > div.fr-loader {
  2043. display: none;
  2044. }
  2045. .fr-popup .fr-image-progress-bar-layer.fr-error > div.fr-action-buttons {
  2046. display: block;
  2047. }
  2048. .fr-image-size-layer .fr-image-group .fr-input-line {
  2049. width: calc(50% - 5px);
  2050. display: inline-block;
  2051. }
  2052. .fr-image-size-layer .fr-image-group .fr-input-line + .fr-input-line {
  2053. margin-left: 10px;
  2054. }
  2055. .fr-uploading {
  2056. -webkit-opacity: 0.4;
  2057. -moz-opacity: 0.4;
  2058. opacity: 0.4;
  2059. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2060. }
  2061. @keyframes loading {
  2062. from {
  2063. left: -25%;
  2064. }
  2065. to {
  2066. left: 100%;
  2067. }
  2068. }
  2069. @-webkit-keyframes loading {
  2070. from {
  2071. left: -25%;
  2072. }
  2073. to {
  2074. left: 100%;
  2075. }
  2076. }
  2077. @-moz-keyframes loading {
  2078. from {
  2079. left: -25%;
  2080. }
  2081. to {
  2082. left: 100%;
  2083. }
  2084. }
  2085. @-o-keyframes loading {
  2086. from {
  2087. left: -25%;
  2088. }
  2089. to {
  2090. left: 100%;
  2091. }
  2092. }
  2093. .clearfix::after {
  2094. clear: both;
  2095. display: block;
  2096. content: "";
  2097. height: 0;
  2098. }
  2099. .hide-by-clipping {
  2100. position: absolute;
  2101. width: 1px;
  2102. height: 1px;
  2103. padding: 0;
  2104. margin: -1px;
  2105. overflow: hidden;
  2106. clip: rect(0, 0, 0, 0);
  2107. border: 0;
  2108. }
  2109. .fr-modal-head .fr-modal-head-line::after {
  2110. clear: both;
  2111. display: block;
  2112. content: "";
  2113. height: 0;
  2114. }
  2115. .fr-modal-head .fr-modal-head-line i.fr-modal-more {
  2116. float: left;
  2117. opacity: 1;
  2118. -webkit-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
  2119. -moz-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
  2120. -ms-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
  2121. -o-transition: padding 0.2s ease 0s, width 0.2s ease 0s, opacity 0.2s ease 0s;
  2122. }
  2123. .fr-modal-head .fr-modal-head-line i.fr-modal-more.fr-not-available {
  2124. opacity: 0;
  2125. width: 0;
  2126. padding: 12px 0;
  2127. }
  2128. .fr-modal-head .fr-modal-tags {
  2129. display: none;
  2130. text-align: left;
  2131. }
  2132. .fr-modal-head .fr-modal-tags a {
  2133. display: inline-block;
  2134. opacity: 0;
  2135. padding: 6px 8px;
  2136. margin: 8px 0 8px 8px;
  2137. text-decoration: none;
  2138. border-radius: 2px;
  2139. -moz-border-radius: 2px;
  2140. -webkit-border-radius: 2px;
  2141. -moz-background-clip: padding;
  2142. -webkit-background-clip: padding-box;
  2143. background-clip: padding-box;
  2144. color: #1e88e5;
  2145. -webkit-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
  2146. -moz-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
  2147. -ms-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
  2148. -o-transition: opacity 0.2s ease 0s, background 0.2s ease 0s;
  2149. cursor: pointer;
  2150. }
  2151. .fr-modal-head .fr-modal-tags a:focus {
  2152. outline: none;
  2153. }
  2154. .fr-modal-head .fr-modal-tags a.fr-selected-tag {
  2155. background: #d6d6d6;
  2156. }
  2157. div.fr-modal-body .fr-preloader {
  2158. display: block;
  2159. margin: 50px auto;
  2160. }
  2161. div.fr-modal-body div.fr-image-list {
  2162. text-align: center;
  2163. margin: 0 10px;
  2164. padding: 0;
  2165. }
  2166. div.fr-modal-body div.fr-image-list::after {
  2167. clear: both;
  2168. display: block;
  2169. content: "";
  2170. height: 0;
  2171. }
  2172. div.fr-modal-body div.fr-image-list .fr-list-column {
  2173. float: left;
  2174. width: calc((100% - 10px) / 2);
  2175. }
  2176. @media (min-width: 768px) and (max-width: 1199px) {
  2177. div.fr-modal-body div.fr-image-list .fr-list-column {
  2178. width: calc((100% - 20px) / 3);
  2179. }
  2180. }
  2181. @media (min-width: 1200px) {
  2182. div.fr-modal-body div.fr-image-list .fr-list-column {
  2183. width: calc((100% - 30px) / 4);
  2184. }
  2185. }
  2186. div.fr-modal-body div.fr-image-list .fr-list-column + .fr-list-column {
  2187. margin-left: 10px;
  2188. }
  2189. div.fr-modal-body div.fr-image-list div.fr-image-container {
  2190. position: relative;
  2191. width: 100%;
  2192. display: block;
  2193. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  2194. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  2195. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  2196. border-radius: 2px;
  2197. -moz-border-radius: 2px;
  2198. -webkit-border-radius: 2px;
  2199. -moz-background-clip: padding;
  2200. -webkit-background-clip: padding-box;
  2201. background-clip: padding-box;
  2202. overflow: hidden;
  2203. }
  2204. div.fr-modal-body div.fr-image-list div.fr-image-container:first-child {
  2205. margin-top: 10px;
  2206. }
  2207. div.fr-modal-body div.fr-image-list div.fr-image-container + div {
  2208. margin-top: 10px;
  2209. }
  2210. div.fr-modal-body div.fr-image-list div.fr-image-container.fr-image-deleting::after {
  2211. position: absolute;
  2212. -webkit-opacity: 0.5;
  2213. -moz-opacity: 0.5;
  2214. opacity: 0.5;
  2215. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2216. -webkit-transition: opacity 0.2s ease 0s;
  2217. -moz-transition: opacity 0.2s ease 0s;
  2218. -ms-transition: opacity 0.2s ease 0s;
  2219. -o-transition: opacity 0.2s ease 0s;
  2220. background: #000000;
  2221. content: "";
  2222. top: 0;
  2223. left: 0;
  2224. bottom: 0;
  2225. right: 0;
  2226. z-index: 2;
  2227. }
  2228. div.fr-modal-body div.fr-image-list div.fr-image-container.fr-image-deleting::before {
  2229. content: attr(data-deleting);
  2230. color: #ffffff;
  2231. top: 0;
  2232. left: 0;
  2233. bottom: 0;
  2234. right: 0;
  2235. margin: auto;
  2236. position: absolute;
  2237. z-index: 3;
  2238. font-size: 15px;
  2239. height: 20px;
  2240. }
  2241. div.fr-modal-body div.fr-image-list div.fr-image-container.fr-empty {
  2242. height: 95px;
  2243. background: #cccccc;
  2244. z-index: 1;
  2245. }
  2246. div.fr-modal-body div.fr-image-list div.fr-image-container.fr-empty::after {
  2247. position: absolute;
  2248. margin: auto;
  2249. top: 0;
  2250. bottom: 0;
  2251. left: 0;
  2252. right: 0;
  2253. content: attr(data-loading);
  2254. display: inline-block;
  2255. height: 20px;
  2256. }
  2257. div.fr-modal-body div.fr-image-list div.fr-image-container img {
  2258. width: 100%;
  2259. vertical-align: middle;
  2260. position: relative;
  2261. z-index: 2;
  2262. -webkit-opacity: 1;
  2263. -moz-opacity: 1;
  2264. opacity: 1;
  2265. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2266. -webkit-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
  2267. -moz-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
  2268. -ms-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
  2269. -o-transition: opacity 0.2s ease 0s, filter 0.2s ease 0s;
  2270. -webkit-transform: translateZ(0);
  2271. -moz-transform: translateZ(0);
  2272. -ms-transform: translateZ(0);
  2273. -o-transform: translateZ(0);
  2274. }
  2275. div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected img {
  2276. -webkit-opacity: 0.75;
  2277. -moz-opacity: 0.75;
  2278. opacity: 0.75;
  2279. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2280. }
  2281. div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected .fr-delete-img,
  2282. div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected .fr-insert-img {
  2283. display: inline-block;
  2284. }
  2285. div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img,
  2286. div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img {
  2287. display: none;
  2288. top: 50%;
  2289. border-radius: 100%;
  2290. -moz-border-radius: 100%;
  2291. -webkit-border-radius: 100%;
  2292. -moz-background-clip: padding;
  2293. -webkit-background-clip: padding-box;
  2294. background-clip: padding-box;
  2295. -webkit-transition: background 0.2s ease 0s, color 0.2s ease 0s;
  2296. -moz-transition: background 0.2s ease 0s, color 0.2s ease 0s;
  2297. -ms-transition: background 0.2s ease 0s, color 0.2s ease 0s;
  2298. -o-transition: background 0.2s ease 0s, color 0.2s ease 0s;
  2299. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  2300. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  2301. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 1px 1px rgba(0, 0, 0, 0.16);
  2302. position: absolute;
  2303. cursor: pointer;
  2304. margin: 0;
  2305. width: 36px;
  2306. height: 36px;
  2307. line-height: 36px;
  2308. text-decoration: none;
  2309. z-index: 3;
  2310. }
  2311. div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img {
  2312. background: #b8312f;
  2313. color: #ffffff;
  2314. left: 50%;
  2315. -webkit-transform: translateY(-50%) translateX(25%);
  2316. -moz-transform: translateY(-50%) translateX(25%);
  2317. -ms-transform: translateY(-50%) translateX(25%);
  2318. -o-transform: translateY(-50%) translateX(25%);
  2319. }
  2320. div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img {
  2321. background: #ffffff;
  2322. color: #1e88e5;
  2323. left: 50%;
  2324. -webkit-transform: translateY(-50%) translateX(-125%);
  2325. -moz-transform: translateY(-50%) translateX(-125%);
  2326. -ms-transform: translateY(-50%) translateX(-125%);
  2327. -o-transform: translateY(-50%) translateX(-125%);
  2328. }
  2329. .fr-desktop .fr-modal-wrapper .fr-modal-head .fr-modal-tags a:hover {
  2330. background: #ebebeb;
  2331. }
  2332. .fr-desktop .fr-modal-wrapper .fr-modal-head .fr-modal-tags a.fr-selected-tag {
  2333. background: #d6d6d6;
  2334. }
  2335. .fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover img {
  2336. -webkit-opacity: 0.75;
  2337. -moz-opacity: 0.75;
  2338. opacity: 0.75;
  2339. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2340. }
  2341. .fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover .fr-delete-img,
  2342. .fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover .fr-insert-img {
  2343. display: inline-block;
  2344. }
  2345. .fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img:hover {
  2346. background: #bf4644;
  2347. color: #ffffff;
  2348. }
  2349. .fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img:hover {
  2350. background: #ebebeb;
  2351. }
  2352. .clearfix::after {
  2353. clear: both;
  2354. display: block;
  2355. content: "";
  2356. height: 0;
  2357. }
  2358. .hide-by-clipping {
  2359. position: absolute;
  2360. width: 1px;
  2361. height: 1px;
  2362. padding: 0;
  2363. margin: -1px;
  2364. overflow: hidden;
  2365. clip: rect(0, 0, 0, 0);
  2366. border: 0;
  2367. }
  2368. .fr-line-breaker {
  2369. cursor: text;
  2370. border-top: 1px solid #1e88e5;
  2371. position: fixed;
  2372. z-index: 2;
  2373. display: none;
  2374. }
  2375. .fr-line-breaker.fr-visible {
  2376. display: block;
  2377. }
  2378. .fr-line-breaker a.fr-floating-btn {
  2379. position: absolute;
  2380. left: calc(50% - (32px / 2));
  2381. top: -16px;
  2382. }
  2383. .clearfix::after {
  2384. clear: both;
  2385. display: block;
  2386. content: "";
  2387. height: 0;
  2388. }
  2389. .hide-by-clipping {
  2390. position: absolute;
  2391. width: 1px;
  2392. height: 1px;
  2393. padding: 0;
  2394. margin: -1px;
  2395. overflow: hidden;
  2396. clip: rect(0, 0, 0, 0);
  2397. border: 0;
  2398. }
  2399. .fr-quick-insert {
  2400. position: absolute;
  2401. z-index: 2147483639;
  2402. white-space: nowrap;
  2403. padding-right: 5px;
  2404. margin-left: -5px;
  2405. -webkit-box-sizing: content-box;
  2406. -moz-box-sizing: content-box;
  2407. box-sizing: content-box;
  2408. }
  2409. .fr-quick-insert.fr-on a.fr-floating-btn svg {
  2410. -webkit-transform: rotate(135deg);
  2411. -moz-transform: rotate(135deg);
  2412. -ms-transform: rotate(135deg);
  2413. -o-transform: rotate(135deg);
  2414. }
  2415. .fr-quick-insert.fr-hidden {
  2416. display: none;
  2417. }
  2418. .fr-qi-helper {
  2419. position: absolute;
  2420. z-index: 3;
  2421. padding-left: 16px;
  2422. white-space: nowrap;
  2423. }
  2424. .fr-qi-helper a.fr-btn.fr-floating-btn {
  2425. text-align: center;
  2426. display: inline-block;
  2427. color: #222222;
  2428. -webkit-opacity: 0;
  2429. -moz-opacity: 0;
  2430. opacity: 0;
  2431. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2432. -webkit-transform: scale(0);
  2433. -moz-transform: scale(0);
  2434. -ms-transform: scale(0);
  2435. -o-transform: scale(0);
  2436. }
  2437. .fr-qi-helper a.fr-btn.fr-floating-btn.fr-size-1 {
  2438. -webkit-opacity: 1;
  2439. -moz-opacity: 1;
  2440. opacity: 1;
  2441. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2442. -webkit-transform: scale(1);
  2443. -moz-transform: scale(1);
  2444. -ms-transform: scale(1);
  2445. -o-transform: scale(1);
  2446. }
  2447. .clearfix::after {
  2448. clear: both;
  2449. display: block;
  2450. content: "";
  2451. height: 0;
  2452. }
  2453. .hide-by-clipping {
  2454. position: absolute;
  2455. width: 1px;
  2456. height: 1px;
  2457. padding: 0;
  2458. margin: -1px;
  2459. overflow: hidden;
  2460. clip: rect(0, 0, 0, 0);
  2461. border: 0;
  2462. }
  2463. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal {
  2464. text-align: left;
  2465. padding: 20px 20px 10px;
  2466. }
  2467. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-characters-list {
  2468. margin-bottom: 20px;
  2469. }
  2470. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-characters-title {
  2471. font-weight: bold;
  2472. font-size: 14px;
  2473. padding: 6px 0 4px;
  2474. margin: 0 0 5px;
  2475. }
  2476. .fr-modal .fr-modal-wrapper .fr-modal-body .fr-special-characters-modal .fr-special-character {
  2477. display: inline-block;
  2478. font-size: 16px;
  2479. width: 20px;
  2480. height: 20px;
  2481. padding: 5px;
  2482. line-height: 20px;
  2483. cursor: default;
  2484. font-weight: normal;
  2485. -webkit-box-sizing: content-box;
  2486. -moz-box-sizing: content-box;
  2487. box-sizing: content-box;
  2488. text-align: center;
  2489. border: 1px solid #cccccc;
  2490. margin: -1px 0 0 -1px;
  2491. }
  2492. .clearfix::after {
  2493. clear: both;
  2494. display: block;
  2495. content: "";
  2496. height: 0;
  2497. }
  2498. .hide-by-clipping {
  2499. position: absolute;
  2500. width: 1px;
  2501. height: 1px;
  2502. padding: 0;
  2503. margin: -1px;
  2504. overflow: hidden;
  2505. clip: rect(0, 0, 0, 0);
  2506. border: 0;
  2507. }
  2508. .fr-element table td.fr-selected-cell,
  2509. .fr-element table th.fr-selected-cell {
  2510. border: 1px double #1e88e5;
  2511. }
  2512. .fr-element table tr {
  2513. user-select: none;
  2514. -o-user-select: none;
  2515. -moz-user-select: none;
  2516. -khtml-user-select: none;
  2517. -webkit-user-select: none;
  2518. -ms-user-select: none;
  2519. }
  2520. .fr-element table td,
  2521. .fr-element table th {
  2522. user-select: text;
  2523. -o-user-select: text;
  2524. -moz-user-select: text;
  2525. -khtml-user-select: text;
  2526. -webkit-user-select: text;
  2527. -ms-user-select: text;
  2528. }
  2529. .fr-element .fr-no-selection table td,
  2530. .fr-element .fr-no-selection table th {
  2531. user-select: none;
  2532. -o-user-select: none;
  2533. -moz-user-select: none;
  2534. -khtml-user-select: none;
  2535. -webkit-user-select: none;
  2536. -ms-user-select: none;
  2537. }
  2538. .fr-table-resizer {
  2539. cursor: col-resize;
  2540. position: absolute;
  2541. z-index: 3;
  2542. display: none;
  2543. }
  2544. .fr-table-resizer.fr-moving {
  2545. z-index: 2;
  2546. }
  2547. .fr-table-resizer div {
  2548. -webkit-opacity: 0;
  2549. -moz-opacity: 0;
  2550. opacity: 0;
  2551. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2552. border-right: 1px solid #1e88e5;
  2553. }
  2554. .fr-no-selection {
  2555. user-select: none;
  2556. -o-user-select: none;
  2557. -moz-user-select: none;
  2558. -khtml-user-select: none;
  2559. -webkit-user-select: none;
  2560. -ms-user-select: none;
  2561. }
  2562. .fr-popup .fr-table-colors-hex-layer {
  2563. width: 100%;
  2564. margin: 0px;
  2565. padding: 10px;
  2566. }
  2567. .fr-popup .fr-table-colors-hex-layer .fr-input-line {
  2568. float: left;
  2569. width: calc(100% - 50px);
  2570. padding: 8px 0 0;
  2571. }
  2572. .fr-popup .fr-table-colors-hex-layer .fr-action-buttons {
  2573. float: right;
  2574. width: 50px;
  2575. }
  2576. .fr-popup .fr-table-colors-hex-layer .fr-action-buttons button {
  2577. background-color: #1e88e5;
  2578. color: #FFF;
  2579. border-radius: 2px;
  2580. -moz-border-radius: 2px;
  2581. -webkit-border-radius: 2px;
  2582. -moz-background-clip: padding;
  2583. -webkit-background-clip: padding-box;
  2584. background-clip: padding-box;
  2585. font-size: 13px;
  2586. height: 32px;
  2587. }
  2588. .fr-popup .fr-table-colors-hex-layer .fr-action-buttons button:hover {
  2589. background-color: #166dba;
  2590. color: #FFF;
  2591. }
  2592. .fr-popup .fr-table-size .fr-table-size-info {
  2593. text-align: center;
  2594. font-size: 14px;
  2595. padding: 8px;
  2596. }
  2597. .fr-popup .fr-table-size .fr-select-table-size {
  2598. line-height: 0;
  2599. padding: 0 5px 5px;
  2600. white-space: nowrap;
  2601. }
  2602. .fr-popup .fr-table-size .fr-select-table-size > span {
  2603. display: inline-block;
  2604. padding: 0px 4px 4px 0;
  2605. background: transparent;
  2606. }
  2607. .fr-popup .fr-table-size .fr-select-table-size > span > span {
  2608. display: inline-block;
  2609. width: 18px;
  2610. height: 18px;
  2611. border: 1px solid #dddddd;
  2612. }
  2613. .fr-popup .fr-table-size .fr-select-table-size > span.hover {
  2614. background: transparent;
  2615. }
  2616. .fr-popup .fr-table-size .fr-select-table-size > span.hover > span {
  2617. background: rgba(30, 136, 229, 0.3);
  2618. border: solid 1px #1e88e5;
  2619. }
  2620. .fr-popup .fr-table-size .fr-select-table-size .new-line::after {
  2621. clear: both;
  2622. display: block;
  2623. content: "";
  2624. height: 0;
  2625. }
  2626. .fr-popup.fr-above .fr-table-size .fr-select-table-size > span {
  2627. display: inline-block !important;
  2628. }
  2629. .fr-popup .fr-table-colors-buttons {
  2630. margin-bottom: 5px;
  2631. }
  2632. .fr-popup .fr-table-colors {
  2633. line-height: 0;
  2634. display: block;
  2635. }
  2636. .fr-popup .fr-table-colors > span {
  2637. display: inline-block;
  2638. width: 32px;
  2639. height: 32px;
  2640. position: relative;
  2641. z-index: 1;
  2642. }
  2643. .fr-popup .fr-table-colors > span > i {
  2644. text-align: center;
  2645. line-height: 32px;
  2646. height: 32px;
  2647. width: 32px;
  2648. font-size: 13px;
  2649. position: absolute;
  2650. bottom: 0;
  2651. cursor: default;
  2652. left: 0;
  2653. }
  2654. .fr-popup .fr-table-colors > span:focus {
  2655. outline: 1px solid #222222;
  2656. z-index: 2;
  2657. }
  2658. .fr-popup.fr-desktop .fr-table-size .fr-select-table-size > span > span {
  2659. width: 12px;
  2660. height: 12px;
  2661. }
  2662. .fr-insert-helper {
  2663. position: absolute;
  2664. z-index: 9999;
  2665. white-space: nowrap;
  2666. }
  2667. .clearfix::after {
  2668. clear: both;
  2669. display: block;
  2670. content: "";
  2671. height: 0;
  2672. }
  2673. .hide-by-clipping {
  2674. position: absolute;
  2675. width: 1px;
  2676. height: 1px;
  2677. padding: 0;
  2678. margin: -1px;
  2679. overflow: hidden;
  2680. clip: rect(0, 0, 0, 0);
  2681. border: 0;
  2682. }
  2683. .fr-element .fr-video {
  2684. user-select: none;
  2685. -o-user-select: none;
  2686. -moz-user-select: none;
  2687. -khtml-user-select: none;
  2688. -webkit-user-select: none;
  2689. -ms-user-select: none;
  2690. }
  2691. .fr-element .fr-video::after {
  2692. position: absolute;
  2693. content: '';
  2694. z-index: 1;
  2695. top: 0;
  2696. left: 0;
  2697. right: 0;
  2698. bottom: 0;
  2699. cursor: pointer;
  2700. display: block;
  2701. background: rgba(0, 0, 0, 0);
  2702. }
  2703. .fr-element .fr-video.fr-active > * {
  2704. z-index: 2;
  2705. position: relative;
  2706. }
  2707. .fr-element .fr-video > * {
  2708. -webkit-box-sizing: content-box;
  2709. -moz-box-sizing: content-box;
  2710. box-sizing: content-box;
  2711. max-width: 100%;
  2712. border: none;
  2713. }
  2714. .fr-box .fr-video-resizer {
  2715. position: absolute;
  2716. border: solid 1px #1e88e5;
  2717. display: none;
  2718. user-select: none;
  2719. -o-user-select: none;
  2720. -moz-user-select: none;
  2721. -khtml-user-select: none;
  2722. -webkit-user-select: none;
  2723. -ms-user-select: none;
  2724. }
  2725. .fr-box .fr-video-resizer.fr-active {
  2726. display: block;
  2727. }
  2728. .fr-box .fr-video-resizer .fr-handler {
  2729. display: block;
  2730. position: absolute;
  2731. background: #1e88e5;
  2732. border: solid 1px #ffffff;
  2733. z-index: 4;
  2734. -webkit-box-sizing: border-box;
  2735. -moz-box-sizing: border-box;
  2736. box-sizing: border-box;
  2737. }
  2738. .fr-box .fr-video-resizer .fr-handler.fr-hnw {
  2739. cursor: nw-resize;
  2740. }
  2741. .fr-box .fr-video-resizer .fr-handler.fr-hne {
  2742. cursor: ne-resize;
  2743. }
  2744. .fr-box .fr-video-resizer .fr-handler.fr-hsw {
  2745. cursor: sw-resize;
  2746. }
  2747. .fr-box .fr-video-resizer .fr-handler.fr-hse {
  2748. cursor: se-resize;
  2749. }
  2750. .fr-box .fr-video-resizer .fr-handler {
  2751. width: 12px;
  2752. height: 12px;
  2753. }
  2754. .fr-box .fr-video-resizer .fr-handler.fr-hnw {
  2755. left: -6px;
  2756. top: -6px;
  2757. }
  2758. .fr-box .fr-video-resizer .fr-handler.fr-hne {
  2759. right: -6px;
  2760. top: -6px;
  2761. }
  2762. .fr-box .fr-video-resizer .fr-handler.fr-hsw {
  2763. left: -6px;
  2764. bottom: -6px;
  2765. }
  2766. .fr-box .fr-video-resizer .fr-handler.fr-hse {
  2767. right: -6px;
  2768. bottom: -6px;
  2769. }
  2770. @media (min-width: 1200px) {
  2771. .fr-box .fr-video-resizer .fr-handler {
  2772. width: 10px;
  2773. height: 10px;
  2774. }
  2775. .fr-box .fr-video-resizer .fr-handler.fr-hnw {
  2776. left: -5px;
  2777. top: -5px;
  2778. }
  2779. .fr-box .fr-video-resizer .fr-handler.fr-hne {
  2780. right: -5px;
  2781. top: -5px;
  2782. }
  2783. .fr-box .fr-video-resizer .fr-handler.fr-hsw {
  2784. left: -5px;
  2785. bottom: -5px;
  2786. }
  2787. .fr-box .fr-video-resizer .fr-handler.fr-hse {
  2788. right: -5px;
  2789. bottom: -5px;
  2790. }
  2791. }
  2792. .fr-popup .fr-video-size-layer .fr-video-group .fr-input-line {
  2793. width: calc(50% - 5px);
  2794. display: inline-block;
  2795. }
  2796. .fr-popup .fr-video-size-layer .fr-video-group .fr-input-line + .fr-input-line {
  2797. margin-left: 10px;
  2798. }
  2799. .fr-popup .fr-video-upload-layer {
  2800. border: dashed 2px #bdbdbd;
  2801. padding: 25px 0;
  2802. position: relative;
  2803. font-size: 14px;
  2804. letter-spacing: 1px;
  2805. line-height: 140%;
  2806. text-align: center;
  2807. }
  2808. .fr-popup .fr-video-upload-layer:hover {
  2809. background: #ebebeb;
  2810. }
  2811. .fr-popup .fr-video-upload-layer.fr-drop {
  2812. background: #ebebeb;
  2813. border-color: #1e88e5;
  2814. }
  2815. .fr-popup .fr-video-upload-layer .fr-form {
  2816. -webkit-opacity: 0;
  2817. -moz-opacity: 0;
  2818. opacity: 0;
  2819. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2820. position: absolute;
  2821. top: 0;
  2822. bottom: 0;
  2823. left: 0;
  2824. right: 0;
  2825. z-index: 2147483640;
  2826. overflow: hidden;
  2827. margin: 0 !important;
  2828. padding: 0 !important;
  2829. width: 100% !important;
  2830. }
  2831. .fr-popup .fr-video-upload-layer .fr-form input {
  2832. cursor: pointer;
  2833. position: absolute;
  2834. right: 0px;
  2835. top: 0px;
  2836. bottom: 0px;
  2837. width: 500%;
  2838. height: 100%;
  2839. margin: 0px;
  2840. font-size: 400px;
  2841. }
  2842. .fr-popup .fr-video-progress-bar-layer > h3 {
  2843. font-size: 16px;
  2844. margin: 10px 0;
  2845. font-weight: normal;
  2846. }
  2847. .fr-popup .fr-video-progress-bar-layer > div.fr-action-buttons {
  2848. display: none;
  2849. }
  2850. .fr-popup .fr-video-progress-bar-layer > div.fr-loader {
  2851. background: #bcdbf7;
  2852. height: 10px;
  2853. width: 100%;
  2854. margin-top: 20px;
  2855. overflow: hidden;
  2856. position: relative;
  2857. }
  2858. .fr-popup .fr-video-progress-bar-layer > div.fr-loader span {
  2859. display: block;
  2860. height: 100%;
  2861. width: 0%;
  2862. background: #1e88e5;
  2863. -webkit-transition: width 0.2s ease 0s;
  2864. -moz-transition: width 0.2s ease 0s;
  2865. -ms-transition: width 0.2s ease 0s;
  2866. -o-transition: width 0.2s ease 0s;
  2867. }
  2868. .fr-popup .fr-video-progress-bar-layer > div.fr-loader.fr-indeterminate span {
  2869. width: 30% !important;
  2870. position: absolute;
  2871. top: 0;
  2872. -webkit-animation: loading 2s linear infinite;
  2873. -moz-animation: loading 2s linear infinite;
  2874. -o-animation: loading 2s linear infinite;
  2875. animation: loading 2s linear infinite;
  2876. }
  2877. .fr-popup .fr-video-progress-bar-layer.fr-error > div.fr-loader {
  2878. display: none;
  2879. }
  2880. .fr-popup .fr-video-progress-bar-layer.fr-error > div.fr-action-buttons {
  2881. display: block;
  2882. }
  2883. .fr-video-overlay {
  2884. position: fixed;
  2885. top: 0;
  2886. left: 0;
  2887. bottom: 0;
  2888. right: 0;
  2889. z-index: 2147483640;
  2890. display: none;
  2891. }