dt-royalslider-css.css 34 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250
  1. /* v1.0.3 */
  2. /* Core RS CSS file. 95% of time you shouldn't change anything here. */
  3. .royalSlider {
  4. width: 600px;
  5. height: 400px;
  6. position: relative;
  7. direction: ltr;
  8. }
  9. .royalSlider > * {
  10. float: left;
  11. }
  12. .rsWebkit3d .rsSlide,
  13. .rsWebkit3d.slider-content .rsContainer,
  14. .rsWebkit3d.slider-content .rsOverflow/*,
  15. .rsWebkit3d .rsThumbs,
  16. .rsWebkit3d .rsPreloader,
  17. .rsWebkit3d img,
  18. .rsWebkit3d .rsOverflow,
  19. .rsWebkit3d .rsBtnCenterer,
  20. .rsWebkit3d .rsAbsoluteEl*/ {
  21. -webkit-backface-visibility: hidden;
  22. -webkit-transform: translateZ(0);
  23. }
  24. .rsFade.rsWebkit3d .rsSlide,
  25. .rsFade.rsWebkit3d img,
  26. .rsFade.rsWebkit3d .rsContainer {
  27. -webkit-transform: none;
  28. }
  29. .rsOverflow {
  30. width: 100%;
  31. height: 100%;
  32. position: relative;
  33. overflow: hidden;
  34. float: left;
  35. -webkit-tap-highlight-color:rgba(0,0,0,0);
  36. }
  37. .rsVisibleNearbyWrap {
  38. width: 100%;
  39. height: 100%;
  40. position: relative;
  41. overflow: hidden;
  42. left: 0;
  43. top: 0;
  44. -webkit-tap-highlight-color:rgba(0,0,0,0);
  45. }
  46. .rsVisibleNearbyWrap .rsOverflow {
  47. position: absolute;
  48. left: 0;
  49. top: 0;
  50. }
  51. .rsContainer {
  52. position: relative;
  53. width: 100%;
  54. height: 100%;
  55. -webkit-tap-highlight-color:rgba(0,0,0,0);
  56. }
  57. .rsArrow,
  58. .rsThumbsArrow {
  59. cursor: pointer;
  60. }
  61. .rsThumb {
  62. float: left;
  63. position: relative;
  64. }
  65. .rsArrow,
  66. .rsNav,
  67. .rsThumbsArrow {
  68. opacity: 1;
  69. -webkit-transition:opacity 0.3s linear;
  70. -moz-transition:opacity 0.3s linear;
  71. -o-transition:opacity 0.3s linear;
  72. transition:opacity 0.3s linear;
  73. }
  74. .rsHidden {
  75. opacity: 0;
  76. visibility: hidden;
  77. -webkit-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
  78. -moz-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
  79. -o-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
  80. transition:visibility 0s linear 0.3s,opacity 0.3s linear;
  81. }
  82. .rsGCaption {
  83. width: 100%;
  84. float: left;
  85. text-align: center;
  86. }
  87. /* Fullscreen options, very important ^^ */
  88. .royalSlider.rsFullscreen {
  89. position: fixed !important;
  90. height: auto !important;
  91. width: auto !important;
  92. margin: 0 !important;
  93. padding: 0 !important;
  94. z-index: 2147483647 !important;
  95. top: 0 !important;
  96. left: 0 !important;
  97. bottom: 0 !important;
  98. right: 0 !important;
  99. }
  100. .royalSlider .rsSlide.rsFakePreloader {
  101. opacity: 1 !important;
  102. -webkit-transition: 0s;
  103. -moz-transition: 0s;
  104. -o-transition: 0s;
  105. transition: 0s;
  106. display: none;
  107. }
  108. .rsSlide {
  109. position: absolute;
  110. left: 0;
  111. top: 0;
  112. display: block;
  113. overflow: hidden;
  114. height: 100%;
  115. width: 100%;
  116. }
  117. .royalSlider.rsAutoHeight,
  118. .rsAutoHeight .rsSlide {
  119. height: auto;
  120. }
  121. .rsContent {
  122. width: 100%;
  123. height: 100%;
  124. position: relative;
  125. }
  126. .rsPreloader {
  127. position:absolute;
  128. z-index: 0;
  129. }
  130. .rsNav {
  131. -moz-user-select: -moz-none;
  132. -webkit-user-select: none;
  133. user-select: none;
  134. }
  135. .rsNavItem {
  136. -webkit-tap-highlight-color:rgba(0,0,0,0.25);
  137. }
  138. .rsThumbs {
  139. cursor: pointer;
  140. position: relative;
  141. overflow: hidden;
  142. float: left;
  143. z-index: 22;
  144. }
  145. .rsTabs {
  146. float: left;
  147. background: none !important;
  148. }
  149. .rsTabs,
  150. .rsThumbs {
  151. -webkit-tap-highlight-color:rgba(0,0,0,0);
  152. -webkit-tap-highlight-color:rgba(0,0,0,0);
  153. }
  154. .rsVideoContainer {
  155. /*left: 0;
  156. top: 0;
  157. position: absolute;*/
  158. /*width: 100%;
  159. height: 100%;
  160. position: absolute;
  161. left: 0;
  162. top: 0;
  163. float: left;*/
  164. width: auto;
  165. height: auto;
  166. line-height: 0;
  167. position: relative;
  168. }
  169. .rsVideoFrameHolder {
  170. position: absolute;
  171. left: 0;
  172. top: 0;
  173. background: #141414;
  174. opacity: 0;
  175. -webkit-transition: .3s;
  176. }
  177. .rsVideoFrameHolder.rsVideoActive {
  178. opacity: 1;
  179. }
  180. .rsVideoContainer iframe,
  181. .rsVideoContainer video,
  182. .rsVideoContainer embed,
  183. .rsVideoContainer .rsVideoObj {
  184. position: absolute;
  185. z-index: 50;
  186. left: 0;
  187. top: 0;
  188. width: 100%;
  189. height: 100%;
  190. }
  191. /* ios controls over video bug, shifting video */
  192. .rsVideoContainer.rsIOSVideo iframe,
  193. .rsVideoContainer.rsIOSVideo video,
  194. .rsVideoContainer.rsIOSVideo embed {
  195. -webkit-box-sizing: border-box;
  196. -moz-box-sizing: border-box;
  197. box-sizing: border-box;
  198. padding-right: 44px;
  199. }
  200. .rsABlock {
  201. left: 0;
  202. top: 0;
  203. position: absolute;
  204. z-index: 15;
  205. -webkit-backface-visibility: hidden;
  206. }
  207. .grab-cursor {
  208. cursor:url(grab.png) 8 8, move;
  209. }
  210. .grabbing-cursor{
  211. cursor:url(grabbing.png) 8 8, move;
  212. }
  213. .rsNoDrag {
  214. cursor: auto;
  215. }
  216. .rsLink {
  217. left:0;
  218. top:0;
  219. position:absolute;
  220. width:100%;
  221. height:100%;
  222. display:block;
  223. z-index: 20;
  224. background: url(blank.gif);
  225. -webkit-backface-visibility: hidden;
  226. }
  227. /***********************************************************************************************************/
  228. /******************************
  229. *
  230. * RoyalSlider Porthole Skin
  231. *
  232. ******************************/
  233. .fixed .rsHomePorthole {
  234. background: rgba(0, 0, 0, 0.3);
  235. }
  236. .rsHomePorthole {
  237. background: #000;
  238. }
  239. #main-slideshow-content {
  240. display: none;
  241. }
  242. #main-slideshow #main-slideshow-content {
  243. display: block;
  244. }
  245. #main-slideshow {
  246. overflow: hidden;
  247. }
  248. #main-slideshow > ul > li {
  249. display: none;
  250. }
  251. /***************
  252. *
  253. * Thumbnails
  254. *
  255. ****************/
  256. .rsThumbs { z-index: 1 !important;}
  257. .rsHomePorthole .rsThumb {
  258. float: none;
  259. margin: 0 auto;
  260. }
  261. .rsHomePorthole .rsThumbsHor {
  262. width: 100%;
  263. height: auto;
  264. }
  265. .rsHomePorthole .rsThumbsVer {
  266. position: absolute;
  267. width: 98px;
  268. height: 370px;
  269. top: 50%;
  270. margin-top: -185px;
  271. right: 25px;
  272. }
  273. .rsHomePorthole.rsWithThumbsHor .rsThumbsContainer {
  274. position: relative;
  275. }
  276. .rsHomePorthole.rsWithThumbsVer .rsThumbsContainer {
  277. position: relative;
  278. width: 100%;
  279. padding-top: 120px;
  280. }
  281. .rsHomePorthole .rsThumb {
  282. overflow: hidden;
  283. width: 30px;
  284. height: 30px;
  285. opacity: 0;
  286. -webkit-border-radius: 90px;
  287. -moz-border-radius: 90px;
  288. -ms-border-radius: 90px;
  289. -o-border-radius: 90px;
  290. border-radius: 90px;
  291. -webkit-box-shadow: 0px 1px 0px rgba(117, 117, 117, 0.15), 0px 0px 3px rgba(0, 0, 0, 0.05);
  292. -moz-box-shadow: 0px 1px 0px rgba(117, 117, 117, 0.15), 0px 0px 3px rgba(0, 0, 0, 0.05);
  293. -ms-box-shadow: 0px 1px 0px rgba(117, 117, 117, 0.15), 0px 0px 3px rgba(0, 0, 0, 0.05);
  294. -o-box-shadow: 0px 1px 0px rgba(117, 117, 117, 0.15), 0px 0px 3px rgba(0, 0, 0, 0.05);
  295. box-shadow: 0px 1px 0px rgba(117, 117, 117, 0.15), 0px 0px 3px rgba(0, 0, 0, 0.05);
  296. }
  297. .no-touch .rsHomePorthole .rsThumb {
  298. -webkit-transition: all 600ms ease;
  299. -moz-transition: all 600ms ease;
  300. -ms-transition: all 600ms ease;
  301. -o-transition: all 600ms ease;
  302. transition: all 600ms ease;
  303. -webkit-transform: translate3d(0, 0, 0);
  304. -moz-transform: translate3d(0, 0, 0);
  305. -ms-transform: translate3d(0, 0, 0);
  306. -o-transform: translate3d(0, 0, 0);
  307. transform: translate3d(0, 0, 0);
  308. }
  309. .rsHomePorthole .rsThumb img {
  310. width: 100%;
  311. height: 100%;
  312. -webkit-border-radius: 90px;
  313. -moz-border-radius: 90px;
  314. -ms-border-radius: 90px;
  315. -o-border-radius: 90px;
  316. border-radius: 90px;
  317. }
  318. .rsHomePorthole .rsThumb.rsNavVis {
  319. opacity: 0.5;
  320. }
  321. .rsHomePorthole .rsThumb.rsNavPrev,
  322. .rsHomePorthole .rsThumb.rsNavNext {
  323. width: 50px;
  324. height: 50px;
  325. opacity: 0.8;
  326. }
  327. .rsHomePorthole .rsThumb.rsNavSelected {
  328. width: 90px;
  329. height: 90px;
  330. opacity: 1;
  331. }
  332. .rsHomePorthole .rsThumb.rsNavSelected img {
  333. }
  334. .rsHomePorthole .rsTmb {
  335. display: block;
  336. }
  337. /* Thumbnails with text */
  338. .rsHomePorthole .rsTmb h5 {
  339. font-size: 16px;
  340. margin: 0;
  341. padding: 0;
  342. line-height: 20px;
  343. color: #FFF;
  344. }
  345. .rsHomePorthole .rsTmb span {
  346. color: #DDD;
  347. margin: 0;
  348. padding: 0;
  349. font-size: 13px;
  350. line-height: 18px;
  351. }
  352. /***************
  353. *
  354. * Play/close video button
  355. *
  356. ****************/
  357. .rsHomePorthole .rsVideoContainer {
  358. position: absolute;
  359. }
  360. .rsHomePorthole .rsPlayBtn {
  361. -webkit-tap-highlight-color:rgba(0,0,0,0.3);
  362. width:120px;
  363. height:120px;
  364. margin-left:-60px;
  365. margin-top:-60px;
  366. cursor: pointer;
  367. -webkit-transition: .3s;
  368. -moz-transition: .3s;
  369. transition: .3s;
  370. }
  371. .rsHomePorthole .rsPlayBtnIcon {
  372. display:block;
  373. width:120px;
  374. height:120px;
  375. -webkit-transition: .3s;
  376. -moz-transition: .3s;
  377. transition: .3s;
  378. /* background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M256,92.481c44.433,0,86.18,17.068,117.553,48.064C404.794,171.411,422,212.413,422,255.999%09s-17.206,84.588-48.448,115.455c-31.372,30.994-73.12,48.064-117.552,48.064s-86.179-17.07-117.552-48.064%09C107.206,340.587,90,299.585,90,255.999s17.206-84.588,48.448-115.453C169.821,109.55,211.568,92.481,256,92.481%20M256,52.481%09c-113.771,0-206,91.117-206,203.518c0,112.398,92.229,203.52,206,203.52c113.772,0,206-91.121,206-203.52%09C462,143.599,369.772,52.481,256,52.481L256,52.481z%20M206.544,357.161V159.833l160.919,98.666L206.544,357.161z%22/%3E%3C/svg%3E") no-repeat center center; */
  379. background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M243.391,166.834l215.748-42.766l-0.145-0.727L444.558,50.5l-363.4,72.035%09C63.07,126.12,50,141.985,50,160.424c0,16.312,0,242.407,0,242.407c0,32.351,26.318,58.669,58.668,58.669h294.664%09c32.35,0,58.668-26.318,58.668-58.669V167.575v-0.741H243.391z%20M422,402.831c0,10.294-8.374,18.669-18.668,18.669H108.668%09C98.374,421.5,90,413.125,90,402.831V261.765h332V402.831z%20M339.528,186.834l-34.931,34.931h-52.426l34.931-34.931H339.528z%09%20M395.225,80.668l41.139,27.529l-51.396,10.214l-41.17-27.55L395.225,80.668z%20M293.981,100.736l41.199,27.568l-51.394,10.213%09l-41.229-27.588L293.981,100.736z%20M192.625,120.827l41.257,27.608l-51.395,10.213L141.2,131.021L192.625,120.827z%20M183.77,186.834%09h52.426l-34.931,34.931h-52.426L183.77,186.834z%20M355.385,221.765l34.931-34.931h52.426l-34.931,34.931H355.385z%20M232.923,393.31%09V284.553l88.693,54.38L232.923,393.31z%22/%3E%3C/svg%3E") no-repeat center center;
  380. background-size: 80px 80px;
  381. opacity: 0.9;
  382. }
  383. .rsHomePorthole .rsPlayBtn {
  384. background-color: #000;
  385. background-color: rgba(0,0,0,0.6);
  386. -webkit-border-radius: 120px;
  387. border-radius: 120px;
  388. }
  389. .old-ie .rsHomePorthole .rsPlayBtnIcon {
  390. background-image: url(video-ico.png);
  391. background-repeat: no-repeat;
  392. background-position: center center;
  393. }
  394. .rsHomePorthole .rsPlayBtn:hover {
  395. background-color: rgba(0,0,0,0.9);
  396. }
  397. .rsHomePorthole .rsBtnCenterer {
  398. position:absolute;
  399. left:50%;
  400. top:50%;
  401. }
  402. .rsHomePorthole .rsCloseVideoBtn {
  403. right: 0;
  404. top: 0;
  405. width: 44px;
  406. height: 44px;
  407. z-index: 500;
  408. position: absolute;
  409. cursor: pointer;
  410. -webkit-backface-visibility: hidden;
  411. -webkit-transform: translateZ(0);
  412. }
  413. .rsHomePorthole .rsCloseVideoBtn.rsiOSBtn {
  414. top: -38px;
  415. right: -6px;
  416. }
  417. .rsHomePorthole .rsCloseVideoIcn {
  418. margin: 6px;
  419. width: 32px;
  420. height: 32px;
  421. background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpolygon%20fill=%22white%22%20points=%22438.393,374.595%20319.757,255.977%20438.378,137.348%20374.595,73.607%20255.995,192.225%20137.375,73.622%20%0973.607,137.352%20192.246,255.983%2073.622,374.625%20137.352,438.393%20256.002,319.734%20374.652,438.378%20%22/%3E%3C/svg%3E") no-repeat center center;
  422. background-size: 26px 26px;
  423. background-color: rgba(0,0,0,0.75);
  424. }
  425. .rsHomePorthole .rsCloseVideoIcn:hover {
  426. background-color: rgba(0,0,0,0.9);
  427. opacity: 1;
  428. }
  429. .hide-thumbnails .rsHomePorthole .rsThumb,
  430. .hide-thumbnails .rsHomePorthole .progress-wrapper {
  431. display: none !important;
  432. }
  433. /***************
  434. *
  435. * Preloader
  436. *
  437. ****************/
  438. .rsHomePorthole .rsPreloader {
  439. width:60px;
  440. height:60px;
  441. padding: 5px;
  442. left:50%;
  443. top:50%;
  444. margin-left:-30px;
  445. margin-top:-30px;
  446. -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  447. -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  448. -ms-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  449. -o-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  450. box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  451. }
  452. .rsHomePorthole .rsPreloader .fa-spinner {
  453. position: absolute;
  454. left: 0;
  455. top: 0;
  456. margin: 13px 0 0 13px;
  457. width: 44px;
  458. height: 44px;
  459. text-align: center;
  460. font-size: 50px;
  461. -webkit-animation: spin 2s infinite linear;
  462. -moz-animation: spin 2s infinite linear;
  463. -o-animation: spin 2s infinite linear;
  464. animation: spin 2s infinite linear;
  465. }
  466. /***************
  467. *
  468. * Caption
  469. *
  470. ****************/
  471. .rsHomePorthole .rsCapt {
  472. position: absolute;
  473. top: auto;
  474. bottom: 45px;
  475. -webkit-box-sizing: border-box;
  476. -moz-box-sizing: border-box;
  477. -ms-box-sizing: border-box;
  478. -o-box-sizing: border-box;
  479. box-sizing: border-box;
  480. text-align: center;
  481. width: 100%;
  482. padding: 0 140px;
  483. z-index: auto;
  484. }
  485. .overlap .rsHomePorthole .rsCapt {
  486. bottom: 115px;
  487. }
  488. /*
  489. .fixed .rsHomePorthole .rsCapt {
  490. padding: 0 140px 0 40px;
  491. }
  492. */
  493. .rsHomePorthole .rsTitle {
  494. position: relative;
  495. display: inline-block;
  496. /*margin: 0 auto;*/
  497. margin-right: 15px;
  498. color: #fff;
  499. vertical-align: middle;
  500. -webkit-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  501. -moz-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  502. -ms-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  503. -o-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  504. text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  505. }
  506. .rsHomePorthole .rsDesc {
  507. display: block;
  508. margin: 10px auto 0 auto;
  509. color: #fff;
  510. vertical-align: middle;
  511. -webkit-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  512. -moz-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  513. -ms-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  514. -o-text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  515. text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1), 0px 0px 15px rgba(0, 0, 0, 0.5);
  516. }
  517. .rsHomePorthole .rsCLink {
  518. position: relative;
  519. display: inline-block;
  520. vertical-align: middle;
  521. width: 40px;
  522. height: 41px;
  523. /*margin: 10px auto -20px auto;*/
  524. background-repeat: no-repeat;
  525. background-position: 0 center;
  526. background-image: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%20width=%2241px%22%20height=%2241px%22%20viewBox=%220%200%2041%2041%22%20enable-background=%22new%200%200%2041%2041%22%20xml:space=%22preserve%22%3E%3Cpath%20opacity=%220.15%22%20fill=%22black%22%20d=%22M20,1C8.954,1,0,9.954,0,21c0,11.044,8.954,20,20,20c11.044,0,20-8.956,20-20C40,9.954,31.044,1,20,1z%20M20,38.75c-9.811,0-17.75-7.939-17.75-17.75c0-9.809,7.939-17.75,17.75-17.75c9.805,0,17.75,7.939,17.75,17.75C37.75,30.805,29.811,38.75,20,38.75z%22/%3E%3Cpath%20opacity=%220.15%22%20fill=%22black%22%20d=%22M15.777,18.617c0.32-0.319,0.673-0.583,1.051-0.791c2.095-1.155,4.787-0.54,6.133,1.505l-1.629,1.63c-0.469-1.066-1.631-1.673-2.788-1.416c-0.435,0.098-0.849,0.314-1.185,0.654%09l-3.129,3.126c-0.951,0.95-0.951,2.493,0,3.444c0.949,0.948,2.494,0.948,3.443,0l0.963-0.968c0.877,0.351,1.819,0.49,2.747,0.419l-2.128,2.129c-1.824,1.824-4.783,1.824-6.607,0c-1.823-1.824-1.823-4.781,0-6.606L15.777,18.617z%20M20.743,13.65l-2.127,2.127c0.927-0.068,1.868,0.07,2.745,0.418l0.964-0.965c0.948-0.948,2.495-0.948,3.444,0c0.946,0.951,0.946,2.496,0,3.444l-3.129,3.13c-0.951,0.951-2.5,0.943-3.443,0c-0.221-0.223-0.411-0.498-0.529-0.766l-1.631,1.632c0.172,0.259,0.35,0.486,0.58,0.713%09c0.59,0.591,1.341,1.031,2.203,1.236c1.123,0.271,2.322,0.123,3.354-0.446c0.373-0.21,0.733-0.472,1.049-0.79l3.129-3.128c1.822-1.824,1.822-4.781,0-6.604C25.525,11.825,22.568,11.825,20.743,13.65z%22/%3E%3Cpath%20fill=%22white%22%20d=%22M20,0C8.954,0,0,8.954,0,20c0,11.044,8.954,20,20,20c11.044,0,20-8.956,20-20%09C40,8.954,31.044,0,20,0z%20M20,37.75c-9.811,0-17.75-7.939-17.75-17.75c0-9.809,7.939-17.75,17.75-17.75%09c9.805,0,17.75,7.939,17.75,17.75C37.75,29.805,29.811,37.75,20,37.75z%22/%3E%3Cpath%20fill=%22white%22%20d=%22M15.777,17.617c0.32-0.319,0.673-0.583,1.051-0.791c2.095-1.155,4.787-0.54,6.133,1.505l-1.629,1.63c-0.469-1.066-1.631-1.673-2.788-1.416c-0.435,0.098-0.849,0.314-1.185,0.654l-3.129,3.126c-0.951,0.95-0.951,2.493,0,3.444c0.949,0.948,2.494,0.948,3.443,0l0.963-0.968c0.877,0.351,1.819,0.49,2.747,0.419l-2.128,2.129c-1.824,1.824-4.783,1.824-6.607,0c-1.823-1.824-1.823-4.781,0-6.606L15.777,17.617z%20M20.743,12.65l-2.127,2.127c0.927-0.068,1.868,0.07,2.745,0.418l0.964-0.965c0.948-0.948,2.495-0.948,3.444,0c0.946,0.951,0.946,2.496,0,3.444l-3.129,3.13%09c-0.951,0.951-2.5,0.943-3.443,0c-0.221-0.223-0.411-0.498-0.529-0.766l-1.631,1.632c0.172,0.259,0.35,0.486,0.58,0.713%09c0.59,0.591,1.341,1.031,2.203,1.236c1.123,0.271,2.322,0.123,3.354-0.446c0.373-0.21,0.733-0.472,1.049-0.79l3.129-3.128%20%09c1.822-1.824,1.822-4.781,0-6.604C25.525,10.825,22.568,10.825,20.743,12.65z%22/%3E%3C/svg%3E");
  527. }
  528. .rsHomePorthole .rsCLink:hover {
  529. opacity: 0.7
  530. }
  531. /*@media
  532. only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px),
  533. only screen and ( min--moz-device-pixel-ratio: 2) and (min-width: 320px),
  534. only screen and ( -o-min-device-pixel-ratio: 2/1) and (min-width: 320px),
  535. only screen and ( min-device-pixel-ratio: 2) and (min-width: 320px),
  536. only screen and ( min-resolution: 192dpi) and (min-width: 320px),
  537. only screen and ( min-resolution: 2dppx) and (min-width: 320px) {
  538. .rsHomePorthole .rsCLink {
  539. background: url("link-retina.png") no-repeat center center;
  540. background-size: 100% 100%;
  541. }
  542. }*/
  543. @media screen and (max-width: 1024px) {
  544. .rsHomePorthole .rsCapt {
  545. /* padding: 0 140px 0 30px; */
  546. }
  547. .overlap .rsHomePorthole .rsCapt {
  548. bottom: 75px;
  549. }
  550. }
  551. @media screen and (max-width: 800px) {
  552. .rsHomePorthole .rsCapt {
  553. /* padding: 0 140px 0 20px; */
  554. bottom: 25px;
  555. }
  556. .overlap .rsHomePorthole .rsCapt {
  557. bottom: 45px;
  558. }
  559. .rsHomePorthole .rsCLink {
  560. /*width: 131px;
  561. height: 25.5px;
  562. margin-bottom: -6px;*/
  563. }
  564. }
  565. @media screen and (min-width: 0px) and (max-width: 760px) {
  566. .rsHomePorthole .rsThumbs {
  567. display: none
  568. }
  569. .rsHomePorthole .rsCapt {
  570. /* padding: 0 50px 0 20px; */
  571. padding: 0 20px;
  572. bottom: 15px;
  573. }
  574. .overlap .rsHomePorthole .rsCapt {
  575. bottom: 15px;
  576. }
  577. }
  578. @media screen and (max-width: 1200px) {
  579. .rsHomePorthole .rsPlayBtn {
  580. height: 100px;
  581. margin-left: -50px;
  582. margin-top: -50px;
  583. width: 100px;
  584. }
  585. .rsHomePorthole .rsPlayBtnIcon {
  586. width: 100px;
  587. height: 100px;
  588. background-size: 60px 60px;
  589. }
  590. }
  591. @media screen and (max-width: 1024px) {
  592. .rsHomePorthole .rsPlayBtn {
  593. height: 80px;
  594. margin-left: -40px;
  595. margin-top: -40px;
  596. width: 80px;
  597. }
  598. .rsHomePorthole .rsPlayBtnIcon {
  599. width: 80px;
  600. height: 80px;
  601. background-size: 50px 50px;
  602. }
  603. }
  604. @media screen and (max-width: 800px) {
  605. .rsHomePorthole .rsPlayBtn {
  606. height: 60px;
  607. margin-left: -30px;
  608. margin-top: -30px;
  609. width: 60px;
  610. }
  611. .rsHomePorthole .rsPlayBtnIcon {
  612. width: 60px;
  613. height: 60px;
  614. background-size: 40px 40px;
  615. }
  616. }
  617. @media screen and (max-width: 320px) {
  618. }
  619. .rsHomePorthole .progress-wrapper,
  620. .rsHomePorthole .progress-wrapper * {
  621. -webkit-box-sizing: border-box;
  622. -moz-box-sizing: border-box;
  623. -ms-box-sizing: border-box;
  624. -o-box-sizing: border-box;
  625. box-sizing: border-box;
  626. }
  627. .rsHomePorthole .progress-wrapper {
  628. position: absolute;
  629. z-index: 999;
  630. top: 50%;
  631. left: 0;
  632. margin-top: -49px;
  633. width: 98px;
  634. height: 98px;
  635. -webkit-transition: opacity 150ms ease;
  636. -moz-transition: opacity 150ms ease;
  637. -ms-transition: opacity 150ms ease;
  638. -o-transition: opacity 150ms ease;
  639. transition: opacity 150ms ease;
  640. }
  641. .rsHomePorthole .progress-wrapper.blurred {
  642. opacity: 0;
  643. }
  644. .rsHomePorthole .progress-controls {
  645. position: absolute;
  646. top: 4px;
  647. left: 4px;
  648. width: 90px;
  649. height: 90px;
  650. opacity: 0.5;
  651. -webkit-border-radius: 90px;
  652. -moz-border-radius: 90px;
  653. -ms-border-radius: 90px;
  654. -o-border-radius: 90px;
  655. border-radius: 90px;
  656. background-color: rgba(0, 0, 0, 0.3);
  657. background-image: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%2230px%22%20height=%2230px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M217.679,462h-120V50h120V462z%20M414.321,50h-120v412h120V50z%22/%3E%3C/svg%3E");
  658. background-size: 30px 30px;
  659. background-repeat: no-repeat;
  660. background-position: center center;
  661. -webkit-transition: opacity 150ms ease;
  662. -moz-transition: opacity 150ms ease;
  663. -ms-transition: opacity 150ms ease;
  664. -o-transition: opacity 150ms ease;
  665. transition: opacity 150ms ease;
  666. }
  667. .touch .rsHomePorthole .progress-controls {
  668. background-color: transparent;
  669. }
  670. .rsHomePorthole .progress-controls:hover {
  671. opacity: 1;
  672. }
  673. .rsHomePorthole .paused .progress-controls {
  674. background-image: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%20width=%2232px%22%20height=%2232px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%09%3Cpolygon%20fill=%22white%22%20points=%22418.999,256.001%20121.001,462%20121.001,50%20%22/%3E%3C/svg%3E");
  675. background-size: 32px 32px;
  676. background-position: 31px center;
  677. }
  678. .rsHomePorthole .progress-mask {
  679. position: relative;
  680. float: left;
  681. width: 50%;
  682. height: 100%;
  683. overflow: hidden;
  684. }
  685. .rsHomePorthole .progress-spinner-left,
  686. .rsHomePorthole .progress-spinner-right {
  687. width: 100%;
  688. height: 100%;
  689. border: 4px solid transparent;
  690. animation-duration: 5s;
  691. animation-timing-function: linear;
  692. animation-iteration-count: 1;
  693. -webkit-animation-duration: 5s;
  694. -webkit-animation-timing-function: linear;
  695. -webkit-animation-iteration-count: 1;
  696. }
  697. .rsHomePorthole .progress-spinner-left.paused,
  698. .rsHomePorthole .progress-spinner-right.paused {
  699. animation-play-state: paused;
  700. -webkit-animation-play-state: paused;
  701. }
  702. .rsHomePorthole .progress-spinner-left {
  703. border-radius: 100% 0 0 100% / 50% 0 0 50%;
  704. border-right: none;
  705. transform-origin: 100% 50%;
  706. transform: rotate(180deg);
  707. animation-name: rota-left;
  708. -webkit-transform-origin: 100% 50%;
  709. -webkit-transform: rotate(180deg);
  710. -webkit-animation-name: rota-left;
  711. }
  712. .rsHomePorthole .progress-spinner-right {
  713. border-radius: 0 100% 100% 0 / 0 50% 50% 0;
  714. border-left: none;
  715. transform-origin: 0 50%;
  716. transform: rotate(-180deg);
  717. animation-name: rota-right;
  718. -webkit-transform-origin: 0 50%;
  719. -webkit-transform: rotate(-180deg);
  720. -webkit-animation-name: rota-right;
  721. }
  722. @keyframes rota-left {
  723. 0% {
  724. transform: rotate(180deg);
  725. }
  726. 50% {
  727. transform: rotate(180deg);
  728. }
  729. 100% {
  730. transform: rotate(360deg);
  731. }
  732. }
  733. @keyframes rota-right {
  734. 0% {
  735. transform: rotate(180deg);
  736. }
  737. 50% {
  738. transform: rotate(360deg);
  739. }
  740. 100% {
  741. transform: rotate(360deg);
  742. }
  743. }
  744. @-webkit-keyframes rota-left {
  745. 0% {
  746. -webkit-transform: rotate(180deg);
  747. }
  748. 50% {
  749. -webkit-transform: rotate(180deg);
  750. }
  751. 100% {
  752. -webkit-transform: rotate(360deg);
  753. }
  754. }
  755. @-webkit-keyframes rota-right {
  756. 0% {
  757. -webkit-transform: rotate(180deg);
  758. }
  759. 50% {
  760. -webkit-transform: rotate(360deg);
  761. }
  762. 100% {
  763. -webkit-transform: rotate(360deg);
  764. }
  765. }
  766. /******************************
  767. *
  768. * RoyalSlider Default Skin
  769. *
  770. * 1. Arrows
  771. * 2. Bullets
  772. * 3. Caption
  773. *
  774. * Sprite: 'rs-default.png'
  775. * Feel free to edit anything
  776. * If you don't some part - just delete it
  777. *
  778. ******************************/
  779. /* Background */
  780. .rsShor,
  781. .rsShor .rsOverflow,
  782. .rsShor .rsSlide,
  783. .rsShor .rsVideoFrameHolder,
  784. .rsShor .rsThumbs {
  785. background: #1a1a1a;
  786. }
  787. /***************
  788. *
  789. * 1. Arrows
  790. *
  791. ****************/
  792. .rsShor .rsArrow {
  793. height: 100%;
  794. width: 44px;
  795. position: absolute;
  796. display: block;
  797. cursor: pointer;
  798. z-index: 21;
  799. }
  800. .rsShor.rsVer .rsArrow {
  801. width: 100%;
  802. height: 44px;
  803. }
  804. .rsShor.rsVer .rsArrowLeft { top: 0; left: 0; }
  805. .rsShor.rsVer .rsArrowRight { bottom: 0; left: 0; }
  806. .rsShor.rsHor .rsArrowLeft { left: 0; top: 0; }
  807. .rsShor.rsHor .rsArrowRight { right: 0; top:0; }
  808. .rsShor .rsArrowIcn {
  809. width: 26px;
  810. height: 36px;
  811. top: 50%;
  812. left: 6px;
  813. margin-top:-18px;
  814. position: absolute;
  815. cursor: pointer;
  816. }
  817. .rsShor .rsArrowRight .rsArrowIcn {
  818. left: auto;
  819. right: 6px;
  820. }
  821. .rsShor .rsArrowIcn:before,
  822. .rsShor .rsArrowIcn:after {
  823. position: absolute;
  824. left: 0;
  825. top: 0;
  826. width: 26px;
  827. height: 36px;
  828. content: "";
  829. background-position: 0 0;
  830. background-repeat: no-repeat;
  831. z-index: 9;
  832. }
  833. .rsShor .rsArrowIcn:after {
  834. top: 1px;
  835. left: 0;
  836. z-index: 8;
  837. }
  838. .rsShor.rsHor .rsArrowLeft .rsArrowIcn { background-position: -64px -32px; }
  839. .rsShor.rsHor .rsArrowRight .rsArrowIcn { background-position: -64px -64px; }
  840. .rsShor.rsVer .rsArrowLeft .rsArrowIcn { background-position: -96px -32px; }
  841. .rsShor.rsVer .rsArrowRight .rsArrowIcn { background-position: -96px -64px; }
  842. .rsShor .rsArrowDisabled .rsArrowIcn { opacity: .2; filter: alpha(opacity=20); *display: none; }
  843. /***************
  844. *
  845. * 2. Bullets
  846. *
  847. ****************/
  848. .rsShor .rsBullets {
  849. position: absolute;
  850. z-index: 35;
  851. left: 0;
  852. bottom: 11px;
  853. width: 100%;
  854. height: auto;
  855. margin: 0 auto;
  856. text-align: center;
  857. line-height: 8px;
  858. overflow: hidden;
  859. }
  860. .rsShor .rsBullet {
  861. /*width: 8px;
  862. height: 8px;*/
  863. display: inline-block;
  864. *display:inline;
  865. *zoom:1;
  866. /*padding: 6px 4px 6px 3px;*/
  867. }
  868. .rsShor .rsBullet span {
  869. display: block;
  870. /*width: 8px;
  871. height: 8px;
  872. border-radius: 50%;*/
  873. }
  874. /***************
  875. *
  876. * 8. Global caption
  877. *
  878. ****************/
  879. .rsShor .slider-post-caption {
  880. position: absolute;
  881. left: 0;
  882. top: auto;
  883. bottom: 27px;
  884. width: 100%;
  885. text-align: center;
  886. }
  887. .rsShor .slider-post-caption p {
  888. margin-bottom: 5px;
  889. }
  890. .rsShor .slider-post-inner {
  891. display: inline-block;
  892. padding: 5px 10px 0;
  893. margin: 0 35px;
  894. }
  895. .rsShor .slider-post-inner * {
  896. color: #fff;
  897. }
  898. .rsShor .rsGCaption {
  899. position: absolute;
  900. float: none;
  901. bottom: 6px;
  902. left: 6px;
  903. text-align: left;
  904. background: rgb(0, 0, 0);
  905. background: rgba(0, 0, 0, 0.75);
  906. color: #FFF;
  907. padding: 2px 8px;
  908. width: auto;
  909. font-size: 12px;
  910. border-radius: 2px;
  911. }
  912. /********************************************************************************************************/
  913. .rsContW {
  914. position: relative;
  915. }
  916. /***************
  917. *
  918. * 2. Bullets
  919. *
  920. ****************/
  921. .rsContW .rsBullets {
  922. position: absolute;
  923. bottom: -14px;
  924. overflow: hidden;
  925. width: 100%;
  926. height: auto;/*
  927. margin: 0 auto -20px;*/
  928. text-align: center;
  929. }
  930. .logo-items .rsOverflow {
  931. margin-bottom: 10px;
  932. }
  933. .old-ie .logo-items .rsOverflow {
  934. margin-bottom: auto;
  935. }
  936. .rsContW .rsBullet {
  937. display: inline-block;
  938. margin: 0 1px 0 1px;
  939. width: 9px;
  940. height: 9px;
  941. background-position: center center;
  942. background-repeat: no-repeat;
  943. -webkit-background-size: 3px 3px;
  944. -moz-background-size: 3px 3px;
  945. -ms-background-size: 3px 3px;
  946. -o-background-size: 3px 3px;
  947. background-size: 3px 3px;
  948. }
  949. .rsBullet:hover {
  950. cursor: pointer;
  951. }
  952. /********************************************************************************************************/
  953. .rsCont {
  954. position: relative;
  955. }
  956. /***************
  957. *
  958. * 2. Bullets
  959. *
  960. ****************/
  961. .rsCont .rsBullets {
  962. position: absolute;
  963. top: 100%;
  964. margin-top: 30px;/*
  965. margin: 0 0 -46px 0;
  966. padding-top: 26px;*/
  967. width: 100%;
  968. text-align: center;
  969. }
  970. .team-items .rsCont .rsBullets {
  971. margin: 0 0 -13px 0;
  972. padding-top: 3px;
  973. }
  974. .rsCont .rsBullet {
  975. display: inline-block;
  976. margin: 0 1px 0 1px;
  977. width: 9px;
  978. height: 9px;
  979. background-position: center center;
  980. background-repeat: no-repeat;
  981. -webkit-background-size: 3px 3px;
  982. -moz-background-size: 3px 3px;
  983. -ms-background-size: 3px 3px;
  984. -o-background-size: 3px 3px;
  985. background-size: 3px 3px;
  986. }
  987. .rsCont .rsBullet:hover {
  988. cursor: pointer;
  989. }
  990. /***************
  991. *
  992. * Play/close video button
  993. *
  994. ****************/
  995. .rsSlide .rollover-video i {
  996. display: none;
  997. }
  998. .rsShor .rsBtnCenterer .rsPlayBtn {
  999. position: relative;
  1000. z-index: 99;
  1001. -webkit-tap-highlight-color:rgba(0,0,0,0.3);
  1002. width:120px;
  1003. height:120px;
  1004. left:50%;
  1005. top:50%;
  1006. margin-left:-60px;
  1007. margin-top:-60px;
  1008. cursor: pointer;
  1009. }
  1010. .rsShor .rsPlayBtnIcon {
  1011. display:block;
  1012. width:120px;
  1013. height:120px;
  1014. -webkit-transition: .3s;
  1015. -moz-transition: .3s;
  1016. transition: .3s;
  1017. /* background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M256,92.481c44.433,0,86.18,17.068,117.553,48.064C404.794,171.411,422,212.413,422,255.999%09s-17.206,84.588-48.448,115.455c-31.372,30.994-73.12,48.064-117.552,48.064s-86.179-17.07-117.552-48.064%09C107.206,340.587,90,299.585,90,255.999s17.206-84.588,48.448-115.453C169.821,109.55,211.568,92.481,256,92.481%20M256,52.481%09c-113.771,0-206,91.117-206,203.518c0,112.398,92.229,203.52,206,203.52c113.772,0,206-91.121,206-203.52%09C462,143.599,369.772,52.481,256,52.481L256,52.481z%20M206.544,357.161V159.833l160.919,98.666L206.544,357.161z%22/%3E%3C/svg%3E") no-repeat center center; */
  1018. background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%20width=%2260px%22%20height=%2270px%22%20viewBox=%220%200%2060%2070%22%20enable-background=%22new%200%200%2060%2070%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M28.164,21.015l31.42-6.229l-0.021-0.105L57.46,4.073L4.538,14.563C1.903,15.085,0,17.396,0,20.082c0,2.375,0,35.301,0,35.301c0,4.711,3.833,8.545,8.544,8.545h42.912c4.711,0,8.544-3.834,8.544-8.545v-34.26v-0.107H28.164z%20M54.175,55.383c0,1.5-1.22,2.719-2.719,2.719H8.544c-1.499,0-2.719-1.219-2.719-2.719V34.839h48.35V55.383z%20M42.164,23.927l-5.087,5.087h-7.635l5.087-5.087H42.164z%20M50.275,8.466l5.991,4.009l-7.485,1.487l-5.995-4.012L50.275,8.466z%20M35.531,11.389l6,4.015l-7.484,1.487l-6.005-4.018L35.531,11.389z%20M20.771,14.315l6.009,4.021l-7.485,1.487l-6.013-4.023L20.771,14.315z%20M19.48,23.927h7.635l-5.086,5.087h-7.635L19.48,23.927z%20M44.474,29.014l5.087-5.087h7.635l-5.087,5.087H44.474z%20M26.639,53.996V38.158l12.917,7.92L26.639,53.996z%22/%3E%3C/svg%3E") no-repeat center center;
  1019. background-size: 60px 70px;
  1020. opacity: 0.8;
  1021. }
  1022. .rsShor .rsPlayBtnIcon:hover {
  1023. opacity: 1;
  1024. }
  1025. .rsShor .rsBtnCenterer {
  1026. position:absolute;
  1027. left:0;
  1028. top:0;
  1029. width: 100%;
  1030. height: 100%;
  1031. }
  1032. .rsShor .rsCloseVideoBtn {
  1033. right: 0;
  1034. top: 0;
  1035. width: 44px;
  1036. height: 44px;
  1037. z-index: 500;
  1038. position: absolute;
  1039. cursor: pointer;
  1040. -webkit-backface-visibility: hidden;
  1041. -webkit-transform: translateZ(0);
  1042. }
  1043. .rsShor .rsCloseVideoBtn.rsiOSBtn {
  1044. top: -38px;
  1045. right: -6px;
  1046. }
  1047. .rsShor .rsCloseVideoIcn {
  1048. margin: 6px;
  1049. width: 32px;
  1050. height: 32px;
  1051. background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpolygon%20fill=%22white%22%20points=%22438.393,374.595%20319.757,255.977%20438.378,137.348%20374.595,73.607%20255.995,192.225%20137.375,73.622%20%0973.607,137.352%20192.246,255.983%2073.622,374.625%20137.352,438.393%20256.002,319.734%20374.652,438.378%20%22/%3E%3C/svg%3E") no-repeat center center;
  1052. background-size: 26px 26px;
  1053. background-color: rgba(0,0,0,0.75);
  1054. }
  1055. .rsShor .rsCloseVideoIcn:hover {
  1056. background-color: rgba(0,0,0,0.9);
  1057. opacity: 1;
  1058. }
  1059. .video-playing .rsShor .rsThumb,
  1060. .video-playing .rsShor .progress-wrapper {
  1061. display: none !important;
  1062. }
  1063. .rsSlide .rollover-video i:after {
  1064. background-image: none;
  1065. }
  1066. .rsVideoFrameHolder {
  1067. z-index: 100;
  1068. }
  1069. /***************
  1070. *
  1071. * Preloader
  1072. *
  1073. ****************/
  1074. .rsShor .rsPreloader {
  1075. width:30px;
  1076. height:30px;
  1077. padding: 5px;
  1078. left:50%;
  1079. top:50%;
  1080. margin-left:-15px;
  1081. margin-top:-15px;
  1082. -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  1083. -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  1084. -ms-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  1085. -o-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  1086. box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20);
  1087. -webkit-box-sizing: content-box;
  1088. -moz-box-sizing: content-box;
  1089. -ms-box-sizing: content-box;
  1090. -o-box-sizing: content-box;
  1091. box-sizing: content-box;
  1092. }
  1093. .rsShor .rsPreloader .fa-spinner {
  1094. position: absolute;
  1095. left: 0;
  1096. top: 0;
  1097. margin: 5px 0 0 5px;
  1098. width: 30px;
  1099. height: 30px;
  1100. text-align: center;
  1101. font-size: 30px;
  1102. -webkit-animation: spin 2s infinite linear;
  1103. -moz-animation: spin 2s infinite linear;
  1104. -o-animation: spin 2s infinite linear;
  1105. animation: spin 2s infinite linear;
  1106. }