SHARE
TWEET

Untitled

a guest May 13th, 2018 328 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /* styles for the social widgets */
  2.  
  3.  
  4. @define sectionbg_inactive: #222629;
  5. @define sectionbg_active: gradient( linear, 0% 0%, 0% 100%, from( #3e474b ), to( #282e2d ) );
  6. @define HalloweenHue: -35deg;
  7.  
  8. DOTAPlay
  9. {
  10.     vertical-align: bottom;
  11.     horizontal-align: right;
  12.     margin-top: 57px;
  13.     height: 100%;
  14.     opacity: 0.9999;
  15. }
  16.  
  17. //
  18. // Play Button
  19. //
  20.  
  21. #LowPriorityWarning
  22. {
  23.     visibility: collapse;
  24. }
  25.  
  26. DOTAPlay.MatchingRestriction #LowPriorityWarning
  27. {
  28.     visibility: visible;
  29.     background-color: red;
  30. }
  31. DOTAPlay.MatchingRestriction #LowPrioritySection
  32. {
  33.     visibility: visible;
  34. }
  35.  
  36. #SearchReturnToWeekendTourneyButton
  37. {
  38.     background-position: 50% 50%;
  39.     background-image: url("s2r://panorama/images/weekend_tourney/battle_cup_return_psd.vtex");
  40.     background-size: 100% 100%;
  41.     background-repeat: no-repeat;
  42.     //wash-color: #00000066;
  43.     border: 0px;
  44.  
  45.     width: 0px;
  46.     opacity: 0.0;
  47.     height: 40px;
  48.     transition-property: width, opacity;
  49.     transition-duration: .2s;
  50.     margin: 6px 10px 0px 7px;
  51. }
  52.  
  53. #ReturnVictoryIcon
  54. {
  55.     margin-top: 8px;
  56.     margin-left: 9px;
  57.     wash-color: #000000ee;
  58. }
  59.  
  60.  
  61. .CanReturnToWeekendTourney #SearchReturnToWeekendTourneyButton
  62. {
  63.     opacity: 1.0;
  64.     width: 40px;
  65. }
  66.  
  67. .CanReturnToWeekendTourney #SearchReturnToWeekendTourneyButton:hover
  68. {
  69.     brightness: 2;
  70. }
  71.  
  72. #WeekendTourneyReturnToBracketButton Label
  73. {
  74.     horizontal-align: center;
  75. }
  76.  
  77. .StateParticipatingInTourney #AbovePlayButtonStack
  78. {
  79.     margin-bottom: 68px;
  80. }
  81.  
  82. #AbovePlayButtonStack
  83. {
  84.     flow-children: down;
  85.     width: 330px;
  86.     margin-bottom: 80px;
  87.     margin-right: 58px;
  88.     vertical-align: bottom;
  89.     horizontal-align: right;
  90.     transition-property: margin;
  91.     transition-duration: .2s;
  92. }
  93.  
  94. DOTAPlay.FindingMatch #AbovePlayButtonStack,
  95. DOTAPlay.Connecting #AbovePlayButtonStack
  96. {
  97.     margin-bottom: 110px;
  98. }
  99.  
  100. #AbandonButton
  101. {
  102.     //width: 330px;
  103.     width: fill-parent-flow(2);
  104.     height: 33px;
  105.     vertical-align:bottom;
  106.     horizontal-align: right;
  107.     //margin-bottom: 90px;
  108.     //margin-right: 58px;
  109.  
  110.     visibility: collapse;
  111. }
  112.  
  113. .StateParticipatingInTourney #AbandonButton
  114. {
  115.     margin-bottom: 10px;
  116. }
  117.  
  118. #AbandonButton:hover Label
  119. {
  120.     color: red;
  121. }
  122.  
  123. #AbandonGameLabel,
  124. #AbandonTourneyLabel
  125. {
  126.     visibility: collapse;
  127. }
  128.  
  129. DOTAPlay.CanAbandonGame #AbandonButton,
  130. DOTAPlay.CanAbandonGame #AbandonGameLabel,
  131. DOTAPlay.CanAbandonTourney #AbandonButton,
  132. DOTAPlay.CanAbandonTourney #AbandonTourneyLabel
  133. {
  134.     visibility: visible;
  135. }
  136.  
  137. #SafeLeaveButton
  138. {
  139.     width: 330px;
  140.     height: 0px;
  141.     vertical-align:bottom;
  142.     horizontal-align: right;
  143.  
  144.     opacity: 0;
  145.  
  146.     transition-property: opacity, height;
  147.     transition-duration: 0.2s;
  148.     transition-delay: 0.3s;
  149. }
  150.  
  151. DOTAPlay.CanSafeLeaveGame #SafeLeaveButton
  152. {
  153.     opacity: 1;
  154.     height: 33px;
  155. }
  156.  
  157.  
  158. #DisconnectButton
  159. {
  160.     width: 330px;
  161.     height: 33px;
  162.  
  163.     min-width: 330px;
  164.     min-height: 48px;
  165.  
  166.     margin-bottom: 21px;
  167.     margin-right: 58px;
  168.  
  169.     padding: 4px 12px 4px 12px;
  170.  
  171.     vertical-align:bottom;
  172.     horizontal-align: right;
  173.     margin-right: 58px;
  174.  
  175.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #722217 ), to( #DD4A29 ) );
  176.     background-image: url("s2r://panorama/images/backgrounds/background_play_button_2x_png.vtex");
  177.     background-size: 328px 50px;
  178.  
  179.     border-top: 1px solid #ffffff05;
  180.     border-right: 1px solid #00000088;
  181.     border-left: 1px solid #ffffff05;
  182.     border-bottom: 1px solid #00000088;
  183.  
  184.     visibility: collapse;
  185. }
  186.  
  187.  
  188. #DisconnectButton Image
  189. {
  190.     wash-color: red;
  191.     width: 26px;
  192.     height: 26px;
  193.     margin: 2px;
  194.     margin-left: 6px;
  195. }
  196.  
  197. .DisconnectLabel
  198. {
  199.     margin-top: 4px;
  200.     vertical-align: middle;
  201.     horizontal-align: center;
  202. }
  203.  
  204. #DisconnectButton Label
  205. {
  206.     text-transform: uppercase;
  207.     color: white;
  208.     font-size: 26px;
  209. }
  210.  
  211. #DisconnectButton:hover Label
  212. {
  213.     color: red;
  214. }
  215.  
  216. #DisconnectButton:active
  217. {
  218.     sound: "ui_custom_lobby_quit";
  219. }
  220.  
  221. #ExtraReturnToWeekendTourneyButton
  222. {
  223.     background-position: 50% 50%;
  224.     background-image: url("s2r://panorama/images/weekend_tourney/battle_cup_return_psd.vtex");
  225.     background-size: 100% 100%;
  226.     background-repeat: no-repeat;
  227.     //wash-color: #00000066;
  228.     border: 0px;
  229.     vertical-align: bottom;
  230.     horizontal-align: right;
  231.     width: 0px;
  232.     height: 49px;
  233.     transition-property: width, brightness;
  234.     transition-duration: .2s;
  235.     margin: 0px 340px 21px 0px;
  236.  
  237.  
  238.     visibility: collapse;
  239. }
  240.  
  241. #ExtraReturnToWeekendTourneyButton:hover
  242. {
  243.     brightness: 2;
  244. }
  245.  
  246. #ExtraReturnVictoryIcon
  247. {
  248.     margin-top: 9px;
  249.     margin-left: 10px;
  250.     wash-color: #000000ee;
  251.     width: 29px;
  252.     height: 29px;
  253. }
  254.  
  255. .CanReturnToWeekendTourney.CanReconnect #ExtraReturnToWeekendTourneyButton,
  256. .CanReturnToWeekendTourney.CanDisconnect #ExtraReturnToWeekendTourneyButton
  257. {
  258.     visibility: visible;
  259.     width: 49px;
  260. }
  261.  
  262. DOTAPlay.CanDisconnect #DisconnectButton
  263. {
  264.     visibility: visible;
  265. }
  266.  
  267. DOTAPlay.Connecting #DisconnectButton
  268. {
  269.     visibility: collapse;
  270. }
  271.  
  272. .StateParticipatingInTourney DOTAPlay.CanReturnToWeekendTourney.CanDisconnect #DisconnectButton
  273. {
  274.     width: 270px;
  275.     transition-property: width;
  276.     transition-duration: .2s;
  277.     min-width: 270px;
  278. }
  279.  
  280. #ReconnectButton
  281. {
  282.     vertical-align: bottom;
  283.     horizontal-align: right;
  284.     height: 49px;
  285.     opacity: 0;
  286.  
  287.     transition-property: opacity, background-color, box-shadow, border;
  288.     transition-duration: 0.2s;
  289.     transition-delay: 0.3s, 0s;
  290. }
  291.  
  292. DOTAPlay.CanReconnect #ReconnectButton
  293. {
  294.     opacity: 1;
  295. }
  296.  
  297. .StateParticipatingInTourney DOTAPlay.CanReturnToWeekendTourney.CanReconnect #ReconnectButton
  298. {
  299.     width: 270px;
  300.     transition-property: width;
  301.     transition-duration: .2s;
  302. }
  303.  
  304. DOTAPlay.Connecting #ReconnectButton
  305. {
  306.     visibility: collapse;
  307. }
  308.  
  309. DOTAPlay.ReconnectInProgress .ReconnectLabel
  310. {
  311.     visibility: collapse;
  312. }
  313.  
  314. .Spinner
  315. {
  316.     horizontal-align: center;
  317.     vertical-align: center;
  318. }
  319.  
  320. .ReconnectSpinner
  321. {
  322.     visibility: collapse;
  323.     horizontal-align: center;
  324.     vertical-align: center;
  325.     flow-children: right;
  326.     width: fit-children;
  327. }
  328.  
  329. DOTAPlay.ReconnectInProgress .ReconnectSpinner
  330. {
  331.     visibility: visible;
  332. }
  333.  
  334. #WeekendTourneySetup
  335. {
  336.     visibility: collapse;
  337. }
  338. .WeekendTourneySetupVisible #WeekendTourneySetup
  339. {
  340.     visibility: visible;
  341. }
  342.  
  343. #WeekendTourneyPlayStatusContainer
  344. {
  345.  
  346.     vertical-align: bottom;
  347.     horizontal-align: right;
  348. }
  349.  
  350. #WeekendTourneyPlayStatusContainer Label
  351. {
  352.     text-align: center;
  353.     text-transform: uppercase;
  354.     line-height: 16px;
  355.     color: #888;
  356.     font-size: 16px;
  357.     width:330px;
  358. }
  359.  
  360. #WeekendTourneyPlayStatus,
  361. #WeekendTourneyQueueDeadlineTooLateLabel,
  362. #WeekendTourneyQueueDeadlineTimeRemainingContainer
  363. {
  364.     horizontal-align: center;
  365. }
  366.  
  367. #WeekendTourneyQueueDeadlineTimeRemainingContainer
  368. {
  369.     flow-children: right;
  370.     visibility: collapse;
  371. }
  372.  
  373. .QueueDeadlineTimeRemaining #WeekendTourneyQueueDeadlineTimeRemainingContainer,
  374. .QueueDeadlineExpiringSoon #WeekendTourneyQueueDeadlineTimeRemainingContainer
  375. {
  376.     visibility: visible;
  377. }
  378.  
  379. .QueueDeadlineExpiringSoon #WeekendTourneyQueueDeadlineTimeRemainingLabel
  380. {
  381.     color: red;
  382. }
  383.  
  384. #WeekendTourneyQueueDeadlineTooLateLabel
  385. {
  386.     visibility: collapse;
  387.     color: red;
  388. }
  389.  
  390.  
  391.  
  392. .QueueDeadlineTooLate #WeekendTourneyQueueDeadlineTooLateLabel
  393. {
  394.     visibility: visible;
  395. }
  396.  
  397. .PlayButton
  398. {
  399.     width: 330px;
  400.     max-height: 49px;
  401.  
  402.     margin-bottom: 21px;
  403.     margin-right: 58px;
  404.  
  405.     padding: 4px 12px 4px 12px;
  406.  
  407.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5A615Ecc ), to( #879695cc ) );
  408.     background-image: url("s2r://panorama/images/backgrounds/background_play_button_2x_png.vtex");
  409.     background-size: 328px 50px;
  410.     //background-repeat: no-repeat;
  411.  
  412.  
  413.     box-shadow: fill #002a6644 -4px -4px 8px 9px;
  414.  
  415.     border-top: 1px solid #ffffff44;
  416.     border-right: 1px solid #00000088;
  417.     border-left: 1px solid #ffffff44;
  418.     border-bottom: 1px solid #00000088;
  419.  
  420.     opacity: 1.0;
  421.  
  422.     transition-property: box-shadow, background-color, opacity, transform;
  423.     transition-delay: 0.0s;
  424.     transition-duration: 0.2s;
  425.     transition-timing-function: ease-in-out;
  426.  
  427. }
  428.  
  429. .FindMatchSpinner
  430. {
  431.     visibility: collapse;
  432.     horizontal-align: center;
  433.     vertical-align: center;
  434. }
  435.  
  436. .FindMsgInFlight .FindMatchSpinner, .WeekendTourneyParticipationMsgInFlight .FindMatchSpinner
  437. {
  438.     visibility: visible;
  439. }
  440.  
  441. .FindMsgInFlight .PlayButton Label, .WeekendTourneyParticipationMsgInFlight .PlayButton Label
  442. {
  443.     opacity: 0.0;
  444. }
  445.  
  446. // de-emphasize the button when on the custom games page
  447. .CustomGamePageVisible #PlayButton,
  448. .PlayCampaignPageVisible #PlayButton
  449. {
  450.     opacity: 0.1;
  451. }
  452.  
  453. .CustomGamePageVisible #DeniedPlayButton,
  454. .PlayCampaignPageVisible #DeniedPlayButton
  455. {
  456.     opacity: 0.1;
  457. }
  458.  
  459. // raise the visibility back up if they have the tab open
  460. .SlideOutVisible.CustomGamePageVisible #PlayButton,
  461. .SlideOutVisible.PlayCampaignPageVisible #PlayButton
  462. {
  463.     opacity: 1.0;
  464. }
  465.  
  466. .SlideOutVisible.CustomGamePageVisible #DeniedPlayButton,
  467. .SlideOutVisible.PlayCampaignPageVisible #DeniedPlayButton
  468. {
  469.     opacity: 1.0;
  470. }
  471.  
  472. .PlayButton:hover
  473. {
  474.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5A615E ), to( #b7c6c5 ) );
  475.     box-shadow: fill #414f4daa -4px -4px 8px 8px;
  476. }
  477.  
  478. .PlayButton:active
  479. {
  480.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5A615E ), to( #ffffff ) );
  481. }
  482.  
  483. .PlayButton Label
  484. {
  485.     margin-top: 2px;
  486.     horizontal-align: center;
  487.     font-size:28px;
  488.     font-weight: bold;
  489.     color: white;
  490.     text-transform: uppercase;
  491.     letter-spacing: 3px;
  492.     text-align: center;
  493.     height: 40px;
  494.     text-overflow: shrink;
  495.  
  496.     transition-property: color;
  497.     transition-delay: 0.0s;
  498.     transition-duration: 0.2s;
  499. }
  500.  
  501.  
  502. #PlayButton:activationdisabled Label
  503. {
  504.     wash-color: #aaaaaa;
  505. }
  506.  
  507. #PlayButton
  508. {
  509.     visibility: visible;
  510.     vertical-align: bottom;
  511.     horizontal-align: right;
  512. }
  513.  
  514. DOTAPlay.FindMsgInFlight #PlayButton
  515. {
  516.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5Aa15E ), to( #87d69533 ) );
  517. }
  518.  
  519. DOTAPlay.FindMsgInFlight #PlayButton:enabled:hover
  520. {
  521.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5Aa15E ), to( #87d695 ) );
  522. }
  523.  
  524. DOTAPlay.PlayButtonStartsSearching #PlayButton,
  525. #ReconnectButton
  526. {
  527.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5Aa15E ), to( #87d69533 ) );
  528. }
  529.  
  530. DOTAPlay.PlayButtonStartsSearching #PlayButton:enabled:hover,
  531. #ReconnectButton:enabled:hover
  532. {
  533.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5Aa15E ), to( #87d695 ) );
  534. }
  535.  
  536. DOTAPlay.PlayButtonStartsSearching #PlayButton:activationdisabled
  537. {
  538.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #5A615Ecc ), to( #879695cc ) );
  539.     saturation: 0.1;
  540.     opacity: 0.5;
  541.     box-shadow: none;
  542. }
  543.  
  544. DOTAPlay.LobbySelectorVisible.MatchingRestriction #PlayButton,
  545. DOTAPlay.LobbySelectorVisible #PlayButton
  546. {
  547.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #14161a ), to( #23262b ) );
  548.     box-shadow: fill #00000000 0px 0px 0px 0px;
  549.     border-top: 1px solid #ffffff03;
  550.     border-left: 1px solid #ffffff03;
  551. }
  552.  
  553. DOTAPlay.LobbyLeaderStart.MatchingRestriction #PlayButton,
  554. DOTAPlay.LobbyLeaderStart #PlayButton
  555. {
  556.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #2d4881cc ), to( #486ca9cc ) );
  557.     box-shadow: fill #486ca922 -4px -4px 8px 8px;
  558.     border-top: 1px solid #ffffff03;
  559.     border-left: 1px solid #ffffff03;
  560. }
  561.  
  562. DOTAPlay.LobbyLeaderStart.MatchingRestriction #PlayButton:not(:activationdisabled):hover,
  563. DOTAPlay.LobbyLeaderStart #PlayButton:not(:activationdisabled):hover
  564. {
  565.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #2d4881cc ), to( #84acff ) );
  566.     box-shadow: fill #486ca966 -4px -4px 18px 8px;
  567. }
  568.  
  569. DOTAPlay.LobbySelectorVisible #PlayButton Label
  570. {
  571.     color: #ffffff11;
  572. }
  573.  
  574. DOTAPlay.LobbySelectorVisible.MatchingRestriction #PlayButton:not(:activationdisabled):hover,
  575. DOTAPlay.LobbySelectorVisible #PlayButton:not(:activationdisabled):hover
  576. {
  577.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #14161a ), to( #23262b ) );
  578.     box-shadow: fill #00000000 0px 0px 0px 0px;
  579. }
  580.  
  581. DOTAPlay.LobbySelectorVisible.LobbyBrowserRowSelected #PlayButton
  582. {
  583.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #2d4881cc ), to( #486ca9cc ) );
  584.     box-shadow: fill #486ca922 -4px -4px 8px 8px;
  585. }
  586.  
  587. DOTAPlay.LobbySelectorVisible.LobbyBrowserRowSelected #PlayButton:enabled:hover
  588. {
  589.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #2d4881cc ), to( #84acff ) );
  590.     box-shadow: fill #486ca966 -4px -4px 18px 8px;
  591. }
  592.  
  593.  
  594. DOTAPlay.LobbySelectorVisible.LobbyBrowserRowSelected #PlayButton Label
  595. {
  596.     color: white;
  597. }
  598.  
  599. DOTAPlay.LobbySelectorVisible.LobbyBrowserRowSelected #PlayButton Label
  600. {
  601.     color: white;
  602. }
  603.  
  604. DOTAPlay.FindingMatch #PlayButton
  605. {
  606.     transform: translateX(-10px);
  607. }
  608.  
  609. DOTAPlay.1v1Disallowed.SectionVisible_1v1  #PlayButton
  610. {
  611.     background-color: #444444;
  612. }
  613.  
  614. DOTAPlay.CanReturnToWeekendTourney #DeniedPlayButton,
  615. DOTAPlay.InReadyUp #DeniedPlayButton,
  616. DOTAPlay.ReturningToQueue #DeniedPlayButton,
  617. DOTAPlay.PlayButtonHidden #DeniedPlayButton,
  618. {
  619.     visibility: collapse;
  620. }
  621.  
  622. DOTAPlay.InReadyUp #PlayButton,
  623. DOTAPlay.ReturningToQueue #PlayButton,
  624. DOTAPlay.PlayButtonHidden #PlayButton,
  625. {
  626.     visibility: collapse;
  627. }
  628.  
  629. #Searching
  630. {
  631.     //margin-right: 78px;
  632.     padding-right: 78px;
  633.     margin-bottom: 21px;
  634.     width: 540px;
  635.     vertical-align: bottom;
  636.     horizontal-align: right;
  637.     flow-children: down;
  638.     opacity: 0.0;
  639.     overflow: noclip;
  640.  
  641.     transition-property: transform, opacity;
  642.     transition-duration: 0.4s;
  643.     transition-delay: 0.0s;
  644.     transition-timing-function: ease-in;
  645.  
  646.     transform: translatex(200px);
  647. }
  648.  
  649.  
  650. DOTAPlay.FindingMatch #Searching,
  651. DOTAPlay.Connecting #Searching
  652. {
  653.     visibility: visible;
  654.     opacity: 1.0;
  655.     transform: none;
  656. }
  657.  
  658. DOTAPlay.InReadyUp #Searching,
  659. DOTAPlay.ReturningToQueue #Searching
  660. {
  661.     visibility: collapse;
  662. }
  663.  
  664. DOTAPlay.FindingMatch #FXSearching
  665. {
  666.     opacity: 1.0;
  667. }
  668.  
  669. DOTAPlay.MatchingRestriction #FXSearching
  670. {
  671.     wash-color: #ff5522;
  672. }
  673.  
  674. #FXSearching
  675. {
  676.     width: 640px;
  677.     height: 150px;
  678.     horizontal-align: right;
  679.     vertical-align: bottom;
  680.     opacity-mask: url("s2r://panorama/images/masks/softedge_box_png.vtex");
  681.     opacity: 0.0;
  682.  
  683.     transition-property: opacity;
  684.     transition-duration: 0.3s;
  685.     transition-timing-function: ease-in;
  686. }
  687.  
  688. .HalloweenActive #FXSearching
  689. {
  690.     hue-rotation: HalloweenHue;
  691. }
  692.  
  693. .StateParticipatingInTourney #FXSearching
  694. {
  695.     hue-rotation: 150deg;
  696.     opacity: .5;
  697.     brightness: .3;
  698. }
  699.  
  700. #FXSearchingParticles
  701. {
  702.     width: 100%;
  703.     height: 100%;
  704. }
  705.  
  706. #JoinPlaytestButton
  707. {
  708.     vertical-align: bottom;
  709.     horizontal-align: right;
  710.     margin-bottom: 76px;
  711.     hue-rotation: 300deg;
  712.     saturation: 15;
  713.     visibility: collapse;
  714. }
  715.  
  716. .MainBranch.PlaytestActive #JoinPlaytestButton
  717. {
  718.     visibility: visible;
  719. }
  720.  
  721. /* The .PlayButton at the end is so we're more specific than the above. Gross, but it works. */
  722. DOTAPlay.FindingMatch #JoinPlaytestButton.PlayButton,
  723. DOTAPlay.Connecting #JoinPlaytestButton.PlayButton,
  724. DOTAPlay.InReadyUp #JoinPlaytestButton.PlayButton,
  725. DOTAPlay.ReturningToQueue #JoinPlaytestButton.PlayButton,
  726. DOTAPlay.PlayButtonHidden #JoinPlaytestButton.PlayButton,
  727. DOTAPlay.SlideOutVisible #JoinPlaytestButton.PlayButton,
  728. .FindMsgInFlight #JoinPlaytestButton.PlayButton
  729. {
  730.     visibility: collapse;
  731. }
  732.  
  733. #SearchWeekendTourneyDeadlineMissed
  734. {
  735.     color: red;
  736. }
  737.  
  738. #SearchWeekendTourneyDontStopWarning,
  739. #SearchWeekendTourneyDeadlineMissed,
  740. #SearchWeekendTourneyEligibleForRefund
  741. {
  742.     visibility: collapse;
  743.     width: 540px;
  744.     padding-right: 57px;
  745.     text-align: right;
  746.     text-transform: uppercase;
  747.     line-height: 16px;
  748.     color: #888;
  749. }
  750.  
  751. .QueueDeadlineExpiringSoon #SearchWeekendTourneyDontStopWarning,
  752. .QueueDeadlineExpiredOK #SearchWeekendTourneyDontStopWarning,
  753. .QueueDeadlineTooLate #SearchWeekendTourneyDeadlineMissed,
  754. .QueueDeadlineEligibleForRefund #SearchWeekendTourneyEligibleForRefund
  755. {
  756.     visibility: visible;
  757. }
  758.  
  759. #SearchSettingsContainer
  760. {
  761.     width: 100%;
  762.     height: 26px;
  763. }
  764.  
  765. #SearchSettingsContainer .LeftRightFlow
  766. {
  767.     flow-children: none;
  768.     horizontal-align: right;
  769. }
  770.  
  771. DOTAPlay.Connecting #SearchSettingsContainer
  772. {
  773.     visibility: collapse;
  774. }
  775.  
  776. .SearchGradient
  777. {
  778.     width: 100%;
  779.     height: 100%;
  780.     background-color: gradient( linear, 0% 0%, 100% 0%, from( transparent ), to( #59B0D222 ) );
  781.     opacity-mask: url("s2r://panorama/images/masks/gradient_rightleft_png.vtex")1;
  782.     border-top: 1px solid #59B0D212;
  783. }
  784.  
  785. .HalloweenActive .SearchGradient
  786. {
  787.     hue-rotation: HalloweenHue;
  788. }
  789.  
  790. .StateParticipatingInTourney .SearchGradient
  791. {
  792.     hue-rotation: 180deg;
  793.     brightness: .8;
  794.     //saturation: .5;
  795. }
  796.  
  797. #SearchSettings, #SearchSettingsWeekendTourney
  798. {
  799.     horizontal-align: right;
  800.     text-transform: uppercase;
  801.     margin-right: 117px;
  802.     //width: 90%;
  803.     padding-top: 4px;
  804.     font-size: 16px;
  805.     color: #99dfee;
  806.     vertical-align: bottom;
  807. }
  808.  
  809. #SearchSettingsWeekendTourney
  810. {
  811.     horizontal-align: right;
  812.     text-transform: uppercase;
  813.     margin-right: 112px;
  814.     //width: 90%;
  815.     padding-top: 4px;
  816.     font-size: 16px;
  817.     color: #c3a771;
  818.     vertical-align: bottom;
  819. }
  820.  
  821. #SearchSettingsWeekendTourney
  822. {
  823.     visibility: collapse;
  824. }
  825.  
  826. .SearchingForWeekendTourney #SearchSettings
  827. {
  828.     visibility: collapse;
  829. }
  830.  
  831. .SearchingForWeekendTourney #SearchSettingsWeekendTourney
  832. {
  833.     visibility: visible;
  834. }
  835.  
  836. #SearchingTime
  837. {
  838.     font-size: 16px;
  839.     font-weight: thin;
  840.     vertical-align: bottom;
  841.     horizontal-align: right;
  842.     margin-top: 2px;
  843.     margin-left: 12px;
  844.     margin-right: 57px;
  845.     letter-spacing: 1px;
  846.  
  847.     transition-property: opacity;
  848.     transition-duration: 0.3s;
  849.     transition-timing-function: ease-in;
  850. }
  851.  
  852.  
  853. DOTAPlay.LANLobby #SearchSettings
  854. {
  855.     visibility: collapse;
  856. }
  857.  
  858. #SearchingContainer
  859. {
  860.     margin-bottom: 0px;
  861.     height: 50px;
  862.     width: 100%;
  863.     horizontal-align: right;
  864. }
  865.  
  866. #SearchBackground
  867. {
  868.     background-color: gradient( linear, 0% 0%, 100% 0%, from( transparent ), to( #59B0D24a ) );
  869.     border-top: 1px solid #59B0D277;
  870.     border-bottom: 1px solid #59B0D277;
  871. }
  872.  
  873. .HalloweenActive #SearchBackground
  874. {
  875.     hue-rotation: HalloweenHue;
  876. }
  877.  
  878.  
  879. #SearchControlsContainer
  880. {
  881.     flow-children: right;
  882.     horizontal-align: right;
  883. }
  884.  
  885. #SearchLabelContainer
  886. {
  887.     //margin-right: 56px;
  888.     animation-name: SearchingAnimation;
  889.     animation-duration: 1.2s;
  890.     animation-timing-function: linear;
  891.     animation-iteration-count: infinite;
  892.     horizontal-align: right;
  893. }
  894.  
  895. .StateParticipatingInTourney #SearchLabelContainer
  896. {
  897.     animation-name: SearchingAnimation-BattleCup;
  898. }
  899.  
  900. #MinigameButton
  901. {
  902.     visibility: collapse;
  903.     width: 50px;
  904.     height: 50px;
  905.     //background-color: black;
  906.     horizontal-align: right;
  907.     margin-top: 1px;
  908.     margin-right: 2px;
  909.     z-index: 5;
  910.     background-image: url("s2r://panorama/images/compendium/spring2016/treecutter_psd.vtex");
  911.     background-size: 100% 100%;
  912.     background-position: 50% 50%;
  913.     animation-name: Hop;
  914.     animation-duration: 0.20s;
  915.     animation-timing-function: linear;
  916.     animation-iteration-count: infinite;
  917. }
  918.  
  919. .Season_International2016.SelfEventActive #MinigameButton
  920. {
  921.     visibility: visible;
  922.  
  923. }
  924.  
  925. #MinigameButton:hover
  926. {
  927.     animation-name: HopHover;
  928.     brightness: 1.5;
  929. }
  930.  
  931.  
  932. @keyframes 'Hop'
  933. {
  934.     0%
  935.     {
  936.         transform: translateY(-2px);
  937.     }
  938.  
  939.     50%
  940.     {
  941.         transform: translateY(2px);
  942.     }
  943.  
  944.     100%
  945.     {
  946.         transform: translateY(-2px);
  947.     }
  948. }
  949.  
  950. @keyframes 'HopHover'
  951. {
  952.     0%
  953.     {
  954.         transform: translateY(-6px);
  955.     }
  956.  
  957.     50%
  958.     {
  959.         transform: translateY(6px);
  960.     }
  961.  
  962.     100%
  963.     {
  964.         transform: translateY(-6px);
  965.     }
  966. }
  967.  
  968.  
  969. #MinigameButton Label
  970. {
  971.     font-size:30px;
  972. }
  973.  
  974. @keyframes 'SearchingAnimation'
  975. {
  976.     0%
  977.     {
  978.         wash-color: white;
  979.     }
  980.  
  981.     50%
  982.     {
  983.         wash-color: #7aa8b7;
  984.     }
  985.  
  986.     100%
  987.     {
  988.         wash-color: white;
  989.     }
  990. }
  991.  
  992. @keyframes 'SearchingAnimation-BattleCup'
  993. {
  994.     0%
  995.     {
  996.         wash-color: white;
  997.     }
  998.  
  999.     50%
  1000.     {
  1001.         wash-color: #fdd993cc;
  1002.     }
  1003.  
  1004.     100%
  1005.     {
  1006.         wash-color: white;
  1007.     }
  1008. }
  1009.  
  1010. #SearchingLabel
  1011. {
  1012.     opacity: 1.0;
  1013.     font-size: 30px;
  1014.     font-weight: thin;
  1015.     //color: #w;
  1016.     text-shadow: 0px 0px 6px 1.0 #c1c0ff;
  1017.     text-transform: uppercase;
  1018.     letter-spacing: 2px;
  1019.     margin-top: 8px;
  1020.     //margin-right: 57px;
  1021.  
  1022.     transition-property: opacity;
  1023.     transition-duration: 0.2s;
  1024.     transition-timing-function: ease-in;
  1025. }
  1026.  
  1027. .StateParticipatingInTourney #SearchingLabel
  1028. {
  1029.     text-shadow: 0px 0px 6px 1.0 #d77b16;
  1030. }
  1031.  
  1032. #SearchingCount
  1033. {
  1034.     visibility: collapse;
  1035.     margin-top: 40px;
  1036. }
  1037.  
  1038. DOTAPlay.SearchingCountVisible #SearchingCount
  1039. {
  1040.     visibility: visible;
  1041.     margin-top: 36px;
  1042.     opacity: .2;
  1043.     horizontal-align: right;
  1044.     //margin-right: 57px;
  1045.     font-size: 12px;
  1046.     color: white;
  1047.     text-shadow: 0px 0px 1px 3 black;
  1048. }
  1049.  
  1050. #CancelSearch
  1051. {
  1052.     wash-color: #00000066;
  1053.     width: 40px;
  1054.     height: 40px;
  1055.     horizontal-align: right;
  1056.     vertical-align: top;
  1057.     margin-top: 6px;
  1058.     margin-right: 57px;
  1059.     background-image: url("s2r://panorama/images/cancel_search_png.vtex");
  1060.     background-size: 100% 100%;
  1061.     background-position: 50% 50%;
  1062.     background-repeat: no-repeat;
  1063.  
  1064. }
  1065.  
  1066. #CancelSearch:hover
  1067. {
  1068.     wash-color: none;
  1069. }
  1070.  
  1071. DOTAPlay.ReadyUpAccepted #CancelSearch,
  1072. DOTAPlay.ReturningToQueue #CancelSearch
  1073. {
  1074.     visibility: collapse;
  1075. }
  1076.  
  1077. .PlayTabBackgroundImage
  1078. {
  1079.     width: 400px;
  1080.     height: 100%;
  1081.     background-size: 400px 667px;
  1082.     background-position: 0% 0%;
  1083.     background-repeat: no-repeat;
  1084.     opacity: 0.35;
  1085.     saturation: 0.55;
  1086.  
  1087.     transition-property: opacity, background-image;
  1088.     transition-duration: .4s;
  1089.     transition-timing-function: ease-in-out;
  1090. }
  1091.  
  1092. .SectionVisible_Normal .PlayTabBackgroundImage
  1093. {
  1094.     background-image: url("s2r://panorama/images/textures/playtabbg_normal_psd.vtex");
  1095. }
  1096.  
  1097. .SectionVisible_Ranked .PlayTabBackgroundImage
  1098. {
  1099.     background-image: url("s2r://panorama/images/textures/playtabbg_ranked_psd.vtex");
  1100. }
  1101.  
  1102. .SectionVisible_SeasonalRanked .PlayTabBackgroundImage
  1103. {
  1104.     background-image: url("s2r://panorama/images/textures/playtabbg_ranked_psd.vtex");
  1105. }
  1106.  
  1107. .SectionVisible_1v1 .PlayTabBackgroundImage
  1108. {
  1109.     background-image: url("s2r://panorama/images/textures/playtabbg_1v1_psd.vtex");
  1110. }
  1111.  
  1112. .SectionVisible_Mutation .PlayTabBackgroundImage
  1113. {
  1114.     background-image: url("s2r://panorama/images/textures/playtabbg_mutations_psd.vtex");
  1115. }
  1116.  
  1117. .SectionVisible_PracticeBots .PlayTabBackgroundImage
  1118. {
  1119.     background-image: url("s2r://panorama/images/textures/playtabbg_bots_psd.vtex");
  1120. }
  1121.  
  1122. .DarkMoon .SectionVisible_CustomGames .PlayTabBackgroundImage
  1123. {
  1124.     background-image: url("s2r://panorama/images/textures/playtabbg_darkmoon_psd.vtex");
  1125.     opacity: .6;
  1126.     saturation: .8;
  1127. }
  1128.  
  1129. .Season_International2017 .SectionVisible_CustomGames .PlayTabBackgroundImage
  1130. {
  1131.     background-image: url("s2r://panorama/images/textures/playtabbg_siltbreaker_psd.vtex");
  1132. }
  1133.  
  1134. .Frostivus2017 .SectionVisible_CustomGames .PlayTabBackgroundImage
  1135. {
  1136.     background-image: url("s2r://panorama/images/textures/playtabbg_frostivus_psd.vtex");
  1137. }
  1138.  
  1139. #CustomGameDetails
  1140. {
  1141.     horizontal-align: right;
  1142.     height: 100%;
  1143.  
  1144.     margin-right: 760px;
  1145.     padding-right: 4px;
  1146.  
  1147.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #2D3B3B ), to( #000 ) );
  1148.     flow-children: none;
  1149.  
  1150.     transform: translateX( 40px );
  1151.     opacity: 0.0;
  1152.  
  1153.     transition-property: transform, opacity;
  1154.     transition-duration: 0.2s;
  1155. }
  1156.  
  1157. .HasCustomGameDetails.SectionVisible_CustomGames.SlideOutVisible #CustomGameDetails
  1158. {
  1159.     transform: translateX( 0px );
  1160.     opacity: 1.0;
  1161. }
  1162.  
  1163. .SectionVisible_CustomGames.LobbySelectorVisible #CustomGameDetails,
  1164. .SectionVisible_CustomGames.LobbyVisible #CustomGameDetails,
  1165. .SectionVisible_CustomGames.WeekendTourneySetupVisible #CustomGameDetails
  1166. {
  1167.     transform: translateX( 40px );
  1168.     opacity: 0.0;
  1169. }
  1170.  
  1171. #CustomGameDetailsContents
  1172. {
  1173.     height: 100%;
  1174. }
  1175.  
  1176. .LobbySelectorVisible .PlayTabBackgroundImage
  1177. {
  1178.     opacity: 0;
  1179. }
  1180.  
  1181. #PlaySlideOutBackground
  1182. {
  1183.     background-color: gradient( linear, 100% 0%, 100% 100%, from( #111111 ), color-stop( 0.01, #202327 ), color-stop( 0.2, #141619 ), to( #000000 ) );
  1184.     box-shadow: black -4px -4px 8px 8px;
  1185.     height: 100%;
  1186.     width: 760px;
  1187.     horizontal-align: right;
  1188.     //border: 2px solid #ff000012;
  1189.     transition-property: transform, opacity, background-color;
  1190.     transition-duration: 0.4s, 0.0s;
  1191.     transition-delay: 0.0s, 0.4s;
  1192.     transition-timing-function: ease-in-out;
  1193. }
  1194.  
  1195. #PlaySlideOut
  1196. {
  1197.     background-color: transparent;
  1198.     height: 100%;
  1199.     width: 760px;
  1200.     width: 1484px;
  1201.     horizontal-align: right;
  1202.     padding-bottom: 0px;
  1203.  
  1204.     transform: translatex(760px);
  1205.     opacity: 0.0;
  1206.  
  1207.     transition-property: transform, opacity, background-color;
  1208.     transition-duration: 0.4s, 0.0s;
  1209.     transition-delay: 0.0s, 0.4s;
  1210.     transition-timing-function: ease-in-out;
  1211.  
  1212.     flow-children: none;
  1213.     margin-left: 320px;
  1214. }
  1215.  
  1216. #Lobby
  1217. {
  1218.     opacity: 0.0;
  1219.     pre-transform-scale2d: 1.0;
  1220.     transition-property: opacity, pre-transform-scale2d;
  1221.     transition-duration: 0.4s;
  1222.     //transition-delay: 0.4s;
  1223.     transition-timing-function: ease-in-out;
  1224. }
  1225.  
  1226. DOTAPlay.SlideOutVisible.LobbyVisible #Lobby
  1227. {
  1228.     opacity: 1.0;
  1229.     pre-transform-scale2d: 1.0;
  1230.     transition-delay: 0.0s;
  1231. }
  1232.  
  1233. DOTAPlay.SlideOutVisible #PlaySlideOut
  1234. {
  1235.     transform: translatex(361px);
  1236.     sound: "ui_find_match_slide_in";
  1237.     sound-out: "ui_find_match_slide_out";
  1238.     opacity: 1.0;
  1239.  
  1240.     transition-property: transform, opacity;
  1241.     transition-duration: 0.4s, 0.4s;
  1242.     transition-delay: 0.0s, 0.4s;
  1243. }
  1244.  
  1245. DOTAPlay.LobbySelectorVisible #PlaySlideOut
  1246. {
  1247.     transform: translatex(44px);
  1248.     margin-left: 16px;
  1249. }
  1250.  
  1251. DOTAPlay.WeekendTourneySetupVisible #PlaySlideOut
  1252. {
  1253.     transform: translatex(44px);
  1254.     margin-left: 16px;
  1255. }
  1256.  
  1257. DOTAPlay.SlideOutVisible.LobbyVisible #PlaySlideOut
  1258. {
  1259.     transform: translatex(44px);
  1260.     margin-left: 16px;
  1261.     margin-left: 316px;
  1262. }
  1263.  
  1264. .AspectRatio16x10 DOTAPlay.SlideOutVisible.LobbyVisible #PlaySlideOut
  1265. {
  1266.     transform: translatex(44px);
  1267.     margin-left: 16px;
  1268.     margin-left: 252px;
  1269. }
  1270.  
  1271. DOTAPlay.SlideOutVisible #CloseButton
  1272. {
  1273.     opacity: 1.0;
  1274.     transition-delay: 0.0s;
  1275. }
  1276.  
  1277. DOTAPlay.LobbyVisible #CloseButton
  1278. {
  1279.     //visibility: collapse;
  1280. }
  1281.  
  1282. #CloseButton
  1283. {
  1284.     opacity: 0.0;
  1285.     height: 100%;
  1286.     horizontal-align: right;
  1287.     padding-right: 8px;
  1288.     background-color: gradient( radial, 100% 25%, 0% 15%, 90% 50%, from( #00000000 ), to( #00000000 ) );
  1289.     transition-property: background-color, opacity;
  1290.     transition-duration: 0.15s;
  1291.     transition-delay: 0.55s;
  1292.     transition-timing-function: ease-in-out;
  1293. }
  1294.  
  1295. #CloseButton:hover
  1296. {
  1297.     background-color: gradient( radial, 100% 25%, 0% 15%, 90% 50%, from( #48575e44 ), to( #00000000 ) );
  1298. }
  1299.  
  1300.  
  1301. #CloseButtonIcon
  1302. {
  1303.     margin-left: 6px;
  1304.     vertical-align: center;
  1305.     width: 32px;
  1306.     height: 32px;
  1307.  
  1308.     background-image: url("s2r://panorama/images/control_icons/arrow_solid_right_png.vtex");
  1309.     background-repeat: no-repeat;
  1310.     background-position: 50% 50%;
  1311.     background-size: 100% 100%;
  1312.  
  1313.     transform: translateX(0px);
  1314.     wash-color: #445255;
  1315.  
  1316.     transition-property: wash-color, transform;
  1317.     transition-duration: 0.15s;
  1318.     transition-timing-function: ease-in-out;
  1319. }
  1320.  
  1321. #CloseButton:hover #CloseButtonIcon
  1322. {
  1323.     transform: translateX(4px);
  1324.     wash-color: #445255dd;
  1325. }
  1326.  
  1327. #LobbyBrowser
  1328. {
  1329.     width: 100%;
  1330.     height: 860px;
  1331. }
  1332.  
  1333. #LobbySelectorContent
  1334. {
  1335.     background-color: gradient( linear, 100% 0%, 100% 100%, from( #111111 ), color-stop( 0.01, #202327 ), color-stop( 0.2, #141619 ), to( #000000 ) );
  1336.     box-shadow: black -4px -4px 8px 8px;
  1337.     width: 720px;
  1338.     opacity: 0.0;
  1339.     padding-top: 16px;
  1340.     margin-right: 46px;
  1341.     padding-right: 40px;
  1342.     flow-children: down;
  1343.     horizontal-align: right;
  1344.     transition-property: opacity;
  1345.     transition-duration: 0.4s;
  1346.     transition-timing-function: ease-in-out;
  1347. }
  1348.  
  1349. DOTAPlay.LobbySelectorVisible #LobbySelectorContent
  1350. {
  1351.     opacity: 1.0;
  1352. }
  1353.  
  1354. DOTAPlay.LobbyVisible #LobbySelectorContent
  1355. {
  1356.     opacity: 0.0;
  1357. }
  1358.  
  1359. #WeekendTourneySetup
  1360. {
  1361.     //background-color: gradient( linear, 100% 0%, 100% 100%, from( #111111 ), color-stop( 0.01, #202327 ), color-stop( 0.2, #141619 ), to( #000000 ) );
  1362.     background-color: gradient( linear, 100% 0%, 100% 100%, from( #111111 ), color-stop( 0.01, #1c1e20 ), color-stop( 0.06, #1b1b1b ), color-stop( 0.9, #151515 ), to( #000000 ) );
  1363.     box-shadow: black -4px -4px 8px 8px;
  1364.     height: 920px;
  1365.     width: 715px;
  1366.     opacity: 0.0;
  1367.     padding-top: 16px;
  1368.     margin-right: 46px;
  1369.     padding-right: 40px;
  1370.     horizontal-align: right;
  1371.     transition-property: opacity;
  1372.     transition-duration: 0.4s;
  1373.     transition-timing-function: ease-in-out;
  1374.     //border-left:  1px solid #ffffff02;
  1375. }
  1376.  
  1377. DOTAPlay.WeekendTourneySetupVisible #WeekendTourneySetup
  1378. {
  1379.     opacity: 1.0;
  1380. }
  1381.  
  1382. #PlaySlideOutContent
  1383. {
  1384.     width: 330px;
  1385.     vertical-align: bottom;
  1386.     horizontal-align: center;
  1387.     margin-left: 320px;
  1388.     margin-bottom: 70px;
  1389.     opacity: 1.0;
  1390.  
  1391.     margin-top: 20px;
  1392.  
  1393.     transition-property: opacity, transform;
  1394.     transition-duration: 0.4s;
  1395.     transition-timing-function: ease-in-out;
  1396. }
  1397.  
  1398. .AspectRatio4x3 #PlaySlideOutContent
  1399. {
  1400.     margin-left: 0px;
  1401.     margin-right: 50px;
  1402. }
  1403.  
  1404. .AspectRatio16x10 #PlaySlideOutContent
  1405. {
  1406.     margin-left: 240px;
  1407. }
  1408.  
  1409. DOTAPlay.LobbySelectorVisible #PlaySlideOutContent,
  1410. DOTAPlay.WeekendTourneySetupVisible #PlaySlideOutContent
  1411. {
  1412.     opacity: 0.0;
  1413.     //transform: translateX(430px);
  1414. }
  1415.  
  1416. DOTAPlay.LobbyVisible #PlaySlideOutContent
  1417. {
  1418.     opacity: 0.0;
  1419. }
  1420.  
  1421. Label
  1422. {
  1423.     color: white;
  1424.     font-size: 16px;
  1425. }
  1426.  
  1427.  
  1428. #SeasonalRankedSectionHeader, #RankedLaneSelectionSectionHeader
  1429. {
  1430.     width: 100%;
  1431. }
  1432.  
  1433. #RankedLaneSelectionSectionHeader Image
  1434. {
  1435. //  background-image: bp_point_log_pass_activated;
  1436.     background-image: url("s2r://panorama/images/icon_mmr_medium_png.vtex");
  1437.     background-size: cover;
  1438.     background-repeat: no-repeat;
  1439.     width: 30px;
  1440.     height: 30px;
  1441. //  wash-color: accentColor;
  1442.     wash-color: #888888FF;
  1443. }
  1444.  
  1445. #SeasonalRankedSectionContent
  1446. {
  1447.     opacity: 0.0;
  1448.     width: 100%;
  1449.  
  1450.     transition-property: opacity;
  1451.     transition-duration: 0.2s;
  1452.     transition-timing-function: ease-in;
  1453.     visibility: collapse;
  1454. }
  1455.  
  1456. .SectionVisible_SeasonalRanked.EligibleForSeasonalRanked #SeasonalRankedSectionContent
  1457. {
  1458.     opacity: 1.0;
  1459.     visibility: visible;
  1460. }
  1461.  
  1462. #SeasonalRankedSection
  1463. {
  1464.     width: 100%;
  1465.     margin-bottom: 8px;
  1466.  
  1467.     visibility: collapse;
  1468. }
  1469.  
  1470. // This is the locked state
  1471. DOTAPlay.SectionVisible_SeasonalRanked #SeasonalRankedSection
  1472. {
  1473.     background-color: sectionbg_active;
  1474.     height: fit-children;
  1475.     opacity: 1.0;
  1476. }
  1477.  
  1478. DOTAPlay.SectionVisible_SeasonalRanked.EligibleForSeasonalRanked #SeasonalRankedSection
  1479. {
  1480.     background-color: sectionbg_active;
  1481.     opacity: 1.0;
  1482. }
  1483.  
  1484. .SeasonalRankedMMRSection
  1485. {
  1486.     padding: 16px;
  1487.     padding-bottom: 8px;
  1488.     margin-top: 10px;
  1489.     margin-bottom: 10px;
  1490.     margin-left: 12px;
  1491.     margin-right: 12px;
  1492.     background-color: #15171944;
  1493.     box-shadow: inset #00000066 0px 2px 6px 0px;
  1494.  
  1495.     width: 100%;
  1496.     padding-top: 12px;
  1497.  
  1498.     flow-children: down;
  1499.  
  1500.     transition-property: height;
  1501.     transition-duration: 0.2s;
  1502.     transition-delay: 0.2s;
  1503.     transition-timing-function: ease-in;
  1504. }
  1505.  
  1506. DOTAPlay.SectionVisible_SeasonalRanked.EligibleForSeasonalRanked .SeasonalRankedMMRSection
  1507. {
  1508.     margin-bottom: 0px;
  1509. }
  1510.  
  1511. .SeasonalRankedMMRSection Label
  1512. {
  1513.     horizontal-align: center;
  1514.     horizontal-align: left;
  1515. }
  1516.  
  1517. .SeasonalRankedMMRSection .SectionHeaderLabel
  1518. {
  1519.     color: #d6d6d6;
  1520. }
  1521.  
  1522. #SeasonalRankedSection .InfoIcon
  1523. {
  1524.     wash-color: #888888FF;
  1525.     width: 12px;
  1526.     height: width-percentage( 100% );
  1527.     margin-left: 1px;
  1528.     margin-top: 1px;
  1529. }
  1530.  
  1531. #SeasonalRankedLocked
  1532. {
  1533.     margin-left: 2px;
  1534.     margin-top: -2px;
  1535.     width: 25px;
  1536.     height: 28px;
  1537.     wash-color: #62BECF;
  1538. }
  1539.  
  1540. #SeasonalRankedSectionContent_Locked
  1541. {
  1542.     opacity: 0.0;
  1543.     width: 100%;
  1544.  
  1545.     transition-property: opacity;
  1546.     transition-duration: 0.2s;
  1547.     transition-timing-function: ease-in;
  1548.     visibility: collapse;
  1549. }
  1550.  
  1551. #SeasonalRankedSectionContent_Locked Label
  1552. {
  1553.     width: 274px;
  1554. }
  1555.  
  1556. #SeasonalRankedSectionContent_Locked Label a
  1557. {
  1558.     color: #B1CBC6;
  1559. }
  1560.  
  1561. .SectionVisible_SeasonalRanked #SeasonalRankedSectionContent_Locked
  1562. {
  1563.     opacity: 1.0;
  1564.     visibility: visible;
  1565. }
  1566.  
  1567. .EligibleForSeasonalRanked #SeasonalRankedSectionContent_Locked
  1568. {
  1569.     visibility: collapse;
  1570. }
  1571.  
  1572. #SeasonalRankedGameModes ToggleButton:selected .TickBox
  1573. {
  1574.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #e7f6f5 ), to( #a0d6d7 ) );
  1575.     border: 3px solid #000000;
  1576.     box-shadow: #5b62bf77 -4px -4px 8px 8px;
  1577. }
  1578.  
  1579. #SeasonalRankedGameModes ToggleButton Label
  1580. {
  1581.     margin-top: 4px;
  1582.     font-size: 16px;
  1583.     margin-left: 8px;
  1584.     color: baseText;
  1585.  
  1586.     transition-property: color;
  1587.     transition-duration: 0.2s;
  1588.     transition-timing-function: linear;
  1589. }
  1590.  
  1591. #SeasonalRankedGameModes ToggleButton:disabled:hover Label
  1592. {
  1593.     color: #d2d6d1;
  1594. }
  1595.  
  1596. #SeasonalRankedGameModes ToggleButton:disabled Label
  1597. {
  1598.     color: white;
  1599. }
  1600.  
  1601. .SeasonalRankedTransfer #SeasonalRankedGameModes
  1602. {
  1603.     visibility: collapse;
  1604. }
  1605.  
  1606. .SeasonalRankedTransfer #SeasonalRankedSectionContent .InfoBlock
  1607. {
  1608.     visibility: collapse;
  1609. }
  1610.  
  1611. ToggleButton:disabled Label
  1612. {
  1613.     color: black;
  1614. }
  1615.  
  1616. ToggleButton:disabled:selected .TickBox
  1617. {
  1618.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #222222 ), to( #333333 ) );
  1619.     border: 3px solid #000000;
  1620.     box-shadow: #33333377 -4px -4px 8px 8px;
  1621. }
  1622.  
  1623. #SeasonalSoloMMRLabel
  1624. {
  1625.     margin-right: 8px;
  1626.     color: #959596;
  1627. }
  1628.  
  1629. #SeasonalPartyMMRLabel
  1630. {
  1631.     margin-right: 8px;
  1632.     color: #959596;
  1633. }
  1634.  
  1635. #SeasonalSoloMMRValue
  1636. {
  1637.     visibility: collapse;
  1638. }
  1639.  
  1640. #SeasonalSoloMMRCalibrating
  1641. {
  1642.     visibility: collapse;
  1643.     color: white;
  1644. }
  1645.  
  1646. #SeasonalSoloMMRNoData
  1647. {
  1648.     visibility: collapse;
  1649.     color: white;
  1650. }
  1651.  
  1652. DOTAPlay.SeasonalSoloMMRCalibrated #SeasonalSoloMMRValue
  1653. {
  1654.     visibility: visible;
  1655. }
  1656.  
  1657. DOTAPlay.SeasonalSoloMMRCalibrating #SeasonalSoloMMRCalibrating
  1658. {
  1659.     visibility: visible;
  1660. }
  1661.  
  1662. DOTAPlay.SeasonalSoloMMRNoData #SeasonalSoloMMRNoData
  1663. {
  1664.     visibility: visible;
  1665. }
  1666.  
  1667. #SeasonalPartyMMRValue
  1668. {
  1669.     visibility: collapse;
  1670.     color: white;
  1671. }
  1672.  
  1673. #SeasonalPartyMMRCalibrating
  1674. {
  1675.     visibility: collapse;
  1676.     color: white;
  1677. }
  1678.  
  1679. #SeasonalPartyMMRNoData
  1680. {
  1681.     visibility: collapse;
  1682.     color: white;
  1683. }
  1684.  
  1685. DOTAPlay.SeasonalPartyMMRCalibrated #SeasonalPartyMMRValue
  1686. {
  1687.     visibility: visible;
  1688. }
  1689.  
  1690. DOTAPlay.SeasonalPartyMMRCalibrating #SeasonalPartyMMRCalibrating
  1691. {
  1692.     visibility: visible;
  1693. }
  1694.  
  1695. DOTAPlay.SeasonalPartyMMRNoData #SeasonalPartyMMRNoData
  1696. {
  1697.     visibility: visible;
  1698. }
  1699.  
  1700. #SeasonalPartyMMRValue i, #SeasonalSoloMMRValue i
  1701. {
  1702.     text-decoration: none;
  1703.     font-style: normal;
  1704.     color: #757576;
  1705.     font-weight: lighter;
  1706. }
  1707.  
  1708. #SeasonalRankedSection TextButton Label
  1709. {
  1710.     color: #B1CBC6;
  1711. }
  1712.  
  1713. #SeasonalRankedSection TextButton:disabled Label
  1714. {
  1715.     color: #717B76;
  1716. }
  1717.  
  1718. #SeasonalRankedSection TextButton:enabled:hover Label
  1719. {
  1720.     text-decoration: underline;
  1721.     color: #FFFFFF;
  1722. }
  1723.  
  1724. #SeasonalRankedLeaderboardsButton
  1725. {
  1726.     horizontal-align: center;
  1727.     margin-top: 15px;
  1728.     margin-bottom: 10px;
  1729.     margin-left: 10px;
  1730.     margin-right: 10px;
  1731. }
  1732.  
  1733. #SeasonalSoloMMRTransfer
  1734. {
  1735.     margin-top: 4px;
  1736.     margin-bottom: 12px;
  1737.     visibility: collapse;
  1738. }
  1739.  
  1740. #SeasonalPartyMMRTransfer
  1741. {
  1742.     margin-top: 4px;
  1743.     margin-bottom: 4px;
  1744.     visibility: collapse;
  1745. }
  1746.  
  1747. .SeasonalRankedTransfer #SeasonalSoloMMRTransfer,
  1748. .SeasonalRankedTransfer #SeasonalPartyMMRTransfer
  1749. {
  1750.     visibility: visible;
  1751. }
  1752.  
  1753. #RankedSectionHeader
  1754. {
  1755.     width: 100%;
  1756. }
  1757.  
  1758. #RankedSectionContent
  1759. {
  1760.     opacity: 0.0;
  1761.     width: 100%;
  1762.  
  1763.     transition-property: opacity;
  1764.     transition-duration: 0.2s;
  1765.     transition-timing-function: ease-in;
  1766.     visibility: collapse;
  1767. }
  1768.  
  1769. .SectionVisible_Ranked.EligibleForRanked #RankedSectionContent
  1770. {
  1771.     opacity: 1.0;
  1772.     visibility: visible;
  1773. }
  1774.  
  1775. #RankedCalibrationSection
  1776. {
  1777.     visibility: collapse;
  1778. }
  1779.  
  1780. .Calibrating #RankedCalibrationSection
  1781. {
  1782.     visibility: visible;
  1783. }
  1784.  
  1785. .RankedMMRSection
  1786. {
  1787.     padding: 12px 16px 8px 8px;
  1788.     margin-top: 8px;
  1789.     margin-bottom: 0px;
  1790.     margin-left: 12px;
  1791.     margin-right: 12px;
  1792.     background-color: #15171944;
  1793.     box-shadow: inset #00000066 0px 2px 6px 0px;
  1794.  
  1795.     width: 100%;
  1796.  
  1797.     flow-children: down;
  1798.  
  1799.     transition-property: height;
  1800.     transition-duration: 0.2s;
  1801.     transition-delay: 0.2s;
  1802.     transition-timing-function: ease-in;
  1803. }
  1804.  
  1805. #SeasonalRankedSectionContent .RankedMMRSection
  1806. {
  1807.     flow-children: down;
  1808. }
  1809.  
  1810. .RankedMMRSectionContents
  1811. {
  1812.     flow-children: down;
  1813. }
  1814.  
  1815. .RankedMMRSection Label
  1816. {
  1817.     horizontal-align: center;
  1818.     horizontal-align: left;
  1819. }
  1820.  
  1821. .RankedMMRSectionIcon
  1822. {
  1823.     width: 32px;
  1824.     height: 32px;
  1825.     margin-right: 8px;
  1826.     margin-bottom: 4px;
  1827.  
  1828.     vertical-align: middle;
  1829.  
  1830.     background-image: url("s2r://panorama/images/icon_mmr_medium_png.vtex");
  1831.     background-size: contain;
  1832.     background-repeat: no-repeat;
  1833.     background-position: center;
  1834.  
  1835.     wash-color: #777;
  1836.  
  1837.     tooltip-position: left;
  1838.     tooltip-body-position: 50% 50%;
  1839. }
  1840.  
  1841. .RankedMMRSection .SectionHeaderLabel
  1842. {
  1843.     color: #d6d6d6;
  1844. }
  1845.  
  1846. #RankedPhoneStatusContainer
  1847. {
  1848.     width: 100%;
  1849.     height: 100px;
  1850. }
  1851.  
  1852. .PhoneStatusPerfectWorld #RankedPhoneStatusContainer
  1853. {
  1854.     visibility: collapse;
  1855. }
  1856.  
  1857. .PhoneStatusAnchored #RankedPhoneStatusContainer
  1858. {
  1859.     height: 75px;
  1860. }
  1861.  
  1862. .PhoneStatusAnchored #RankedGameModes
  1863. {
  1864.     padding-bottom: 25px;
  1865. }
  1866.  
  1867. #RankedPhoneStatusContainer Panel
  1868. {
  1869.     width: 100%;
  1870.     visibility: collapse;
  1871. }
  1872.  
  1873. .PhoneStatusNone #RankedPhoneStatusNone
  1874. {
  1875.     visibility: visible;
  1876. }
  1877.  
  1878. .PhoneStatusSteam #RankedPhoneStatusSteam
  1879. {
  1880.     visibility: visible;
  1881. }
  1882.  
  1883. .PhoneStatusAnchored #RankedPhoneStatusAnchored
  1884. {
  1885.     visibility: visible;
  1886. }
  1887.  
  1888. #RankedPhoneStatusAnchored Label
  1889. {
  1890.     color: baseText;
  1891. }
  1892.  
  1893. #RankedPhoneStatusAnchored Label a
  1894. {
  1895.     color: #555D52;
  1896. }
  1897.  
  1898. #RankedPhoneStatusContainer Button
  1899. {
  1900.     margin-left: 0px;
  1901.     margin-right: 0px;
  1902.     width: 100%;
  1903. }
  1904.  
  1905. #RankedPhoneStatusContainer Button Label
  1906. {
  1907.     horizontal-align: center;
  1908. }
  1909.  
  1910. #RankedPhoneStatusNone
  1911. {
  1912.     margin-top: 8px;
  1913.     margin-left: 12px;
  1914.     margin-right: 12px;
  1915.     width: 100%;
  1916. }
  1917.  
  1918. #RankedPhoneStatusNone > Label
  1919. {
  1920.     width: 306px;
  1921. }
  1922.  
  1923. #RankedPhoneStatusNone > Label
  1924. {
  1925.     color: #d75a52;
  1926. }
  1927.  
  1928. #RankedPhoneStatusSteam
  1929. {
  1930.     padding-left: 12px;
  1931.     padding-right: 12px;
  1932. }
  1933.  
  1934. #RankedPhoneStatusSteam > Label
  1935. {
  1936.     color: #d75a52;
  1937. }
  1938.  
  1939. #RankedPhoneStatusSteam Button
  1940. {
  1941.     border: 1px solid #33cc6655;
  1942.     background-color: #33cc6611;
  1943. }
  1944.  
  1945. #RankedPhoneStatusSteam Button Label
  1946. {
  1947.     color: #66ffaa;
  1948. }
  1949.  
  1950. #RankedPhoneStatusSteam Button:enabled:hover Label
  1951. {
  1952.     color: white;
  1953. }
  1954.  
  1955. #RankedPhoneStatusSteam Button:enabled:hover
  1956. {
  1957.     border: 1px solid #22ffaaaa;
  1958.     background-color: #33aa6644;
  1959. }
  1960.  
  1961. #RankedPhoneStatusSteam Button:active
  1962. {
  1963.     background-color: #238a4644;
  1964.     sound: "ui_select_blue";
  1965. }
  1966.  
  1967. #RankedPhoneStatusSteam Button:active Label
  1968. {
  1969.     color: #76edba;
  1970. }
  1971.  
  1972. #RankedPhoneStatusAnchored
  1973. {
  1974.     padding-top: 12px;
  1975.     padding-left: 14px;
  1976.     padding-right: 14px;
  1977. }
  1978.  
  1979. #PartyMMRLabel
  1980. {
  1981.     min-width: 36px;
  1982.     margin-right: 8px;
  1983.     color: #959596;
  1984. }
  1985.  
  1986. #TeamMMRLabel
  1987. {
  1988.     margin-right: 8px;
  1989.     color: #959596;
  1990. }
  1991.  
  1992. #RankTierCalibrating
  1993. {
  1994.     color: white;
  1995.     visibility: visible;
  1996. }
  1997.  
  1998. #TeamMMRValue
  1999. {
  2000.     visibility: collapse;
  2001.     color: white;
  2002. }
  2003.  
  2004. #TeamMMRCalibrating
  2005. {
  2006.     visibility: collapse;
  2007.     color: white;
  2008. }
  2009.  
  2010. #TeamMMRNoData
  2011. {
  2012.     visibility: collapse;
  2013.     color: white;
  2014. }
  2015.  
  2016. DOTAPlay.TeamMMRCalibrated #TeamMMRValue
  2017. {
  2018.     visibility: visible;
  2019. }
  2020.  
  2021. DOTAPlay.TeamMMRCalibrating #TeamMMRCalibrating
  2022. {
  2023.     visibility: visible;
  2024. }
  2025.  
  2026. DOTAPlay.TeamMMRNoData #TeamMMRNoData
  2027. {
  2028.     visibility: visible;
  2029. }
  2030.  
  2031. #RankedSection
  2032. {
  2033.     width: 100%;
  2034.     margin-bottom: 8px;
  2035. }
  2036.  
  2037. // This is the locked state
  2038. DOTAPlay.SectionVisible_Ranked #RankedSection
  2039. {
  2040.     background-color: sectionbg_active;
  2041.     height: 320px;
  2042.     opacity: 1.0;
  2043. }
  2044.  
  2045. DOTAPlay.SectionVisible_Ranked.EligibleForRanked #RankedSection
  2046. {
  2047.     background-color: sectionbg_active;
  2048.     height: 366px;
  2049.     opacity: 1.0;
  2050. }
  2051.  
  2052. DOTAPlay.SectionVisible_Ranked.EligibleForRanked.ValidTeamIdentity #RankedSection
  2053. {
  2054.     background-color: sectionbg_active;
  2055.     height: 440px;
  2056.     opacity: 1.0;
  2057. }
  2058.  
  2059. DOTAPlay.SectionVisible_Ranked.EligibleForRanked.PhoneStatusPerfectWorld #RankedSection
  2060. {
  2061.     height: 300px;
  2062. }
  2063.  
  2064. DOTAPlay.SectionVisible_Ranked.EligibleForRanked.ValidTeamIdentity.PhoneStatusPerfectWorld #RankedSection
  2065. {
  2066.     height: 340px;
  2067. }
  2068.  
  2069. DOTAPlay.SectionVisible_Normal #GameModeSection
  2070. {
  2071.     background-color: sectionbg_active;
  2072.     opacity: 1.0;
  2073. }
  2074.  
  2075. DOTAPlay.SectionVisible_1v1 #1v1Section
  2076. {
  2077.     background-color: sectionbg_active;
  2078.     height: 145px;
  2079.     opacity: 1.0;
  2080. }
  2081.  
  2082. DOTAPlay.SectionVisible_1v1.1v1Disallowed #1v1Section
  2083. {
  2084.     background-color: sectionbg_active;
  2085.     height: 175px;
  2086.     opacity: 1.0;
  2087. }
  2088.  
  2089. #1v1PartyWarning
  2090. {
  2091.     margin-top: 8px;
  2092.     visibility: collapse;
  2093.     color: red;
  2094. }
  2095.  
  2096. DOTAPlay.1v1Disallowed #1v1PartyWarning
  2097. {
  2098.     visibility: visible;
  2099. }
  2100.  
  2101. DOTAPlay.SectionVisible_Mutation #MutationSection
  2102. {
  2103.     background-color: #104629;
  2104.     height: 270px;
  2105.     opacity: 1.0;
  2106. }
  2107.  
  2108. DOTAPlay.SectionVisible_Mutation #MutationSection #CurrentMutation
  2109. {
  2110.     margin-top: 4px;
  2111.     color: #999;
  2112.     horizontal-align: center;
  2113. }
  2114.  
  2115.  
  2116. DOTAPlay.SectionVisible_Mutation .Mutation
  2117. {
  2118.     width: 250px;
  2119.     height: 27px;
  2120.     border: 1px solid #6da787;
  2121.     background-color: #6da78711;
  2122.     horizontal-align: center;
  2123.     margin-bottom: 4px;
  2124. }
  2125.  
  2126. DOTAPlay.SectionVisible_Mutation .Mutation Label
  2127. {
  2128.     margin-top: 4px;
  2129.     width: 100%;
  2130.     text-align: center;
  2131.     text-overflow: shrink;
  2132. }
  2133.  
  2134. DOTAPlay.SectionVisible_Mutation .Mutation .InfoIcon
  2135. {
  2136.     wash-color: #999;
  2137.     width: 14px;
  2138.     height: 14px;
  2139.     margin-top: 2px;
  2140. }
  2141.  
  2142. DOTAPlay.SectionVisible_Mutation .TimeRemaining
  2143. {
  2144.     margin-top: 8px;
  2145.     flow-children: right;
  2146. }
  2147. DOTAPlay.SectionVisible_Mutation .TimeRemaining Label
  2148. {
  2149.     color: #999;
  2150. }
  2151. DOTAPlay.SectionVisible_Mutation .TimeRemaining Label.Numbers
  2152. {
  2153.     color: #CCA86E;
  2154. }
  2155.  
  2156. DOTAPlay.SectionVisible_PracticeBots #PracticeBotsSection
  2157. {
  2158.     background-color: sectionbg_active;
  2159.     height: 370px;
  2160. }
  2161.  
  2162. .Language_thai DOTAPlay.SectionVisible_PracticeBots #PracticeBotsSection
  2163. {
  2164.     height: 390px;
  2165. }
  2166.  
  2167. DOTAPlay.SectionVisible_CustomGames.DarkMoon #CustomGamesSection
  2168. {
  2169.     background-color: sectionbg_active;
  2170.     height: 142px;
  2171. }
  2172.  
  2173. DOTAPlay.SectionVisible_CustomGames.Season_International2017 #CustomGamesSection
  2174. {
  2175.     background-color: sectionbg_active;
  2176.     height: 185px;
  2177.     opacity: 1.0;
  2178. }
  2179.  
  2180. DOTAPlay.SectionVisible_CustomGames.Frostivus2017 #CustomGamesSection
  2181. {
  2182.     background-color: sectionbg_active;
  2183.     height: 185px;
  2184.     opacity: 1.0;
  2185. }
  2186.  
  2187. .PlayDividerLine
  2188. {
  2189.     background-color: #20223088;
  2190.     margin-left: 4px;
  2191.     margin-right: 4px;
  2192.     margin-top: 12px;
  2193.     margin-bottom: 12px;
  2194.     height: 2px;
  2195.     width: 100%;
  2196. }
  2197.  
  2198. #PracticeBotsSectionContent .PlayDividerLine
  2199. {
  2200.     margin-top: 8px;
  2201.     margin-bottom: 8px;
  2202. }
  2203.  
  2204.  
  2205. .PlayTabRadio
  2206. {
  2207.     margin-left: 4px;
  2208.     margin-bottom: 6px;
  2209. }
  2210.  
  2211. .CoopOrSolo
  2212. {
  2213.     margin-left: 4px;
  2214.     margin-bottom: 6px;
  2215.     text-transform: uppercase;
  2216. }
  2217.  
  2218. .PlayBotsLabel
  2219. {
  2220.     margin-left: 32px;
  2221.     color: #999999;
  2222. }
  2223.  
  2224. #RankedCheckBox
  2225. {
  2226.     margin-top: 5px;
  2227.     margin-bottom: 5px;
  2228. }
  2229.  
  2230. #RankedOff
  2231. {
  2232.     visibility: visible;
  2233.     margin-left: 8px;
  2234.     margin-top: 14px;
  2235.     color: #dafef6;
  2236. }
  2237.  
  2238. DOTAPlay.RankedMode #RankedOff
  2239. {
  2240.     visibility: collapse;
  2241. }
  2242.  
  2243. #RankedOn
  2244. {
  2245.     visibility: collapse;
  2246.     margin-left: 8px;
  2247.     margin-top: 14px;
  2248.     color: #dafef6;
  2249. }
  2250.  
  2251. DOTAPlay.RankedMode #RankedOn
  2252. {
  2253.     visibility: visible;
  2254. }
  2255.  
  2256. #RankedLocked
  2257. {
  2258.     margin-left: 8px;
  2259.     margin-top: 5px;
  2260.     visibility: visible;
  2261.     width: 14px;
  2262.     height: 14px;
  2263.     wash-color: #91ABA6;
  2264. }
  2265.  
  2266. // enable when we unlock ranked
  2267. .EligibleForRanked #RankedLocked
  2268. {
  2269.     visibility: collapse;
  2270. }
  2271.  
  2272. #RankedSectionContent_Locked
  2273. {
  2274.     opacity: 0.0;
  2275.     width: 100%;
  2276.  
  2277.     transition-property: opacity;
  2278.     transition-duration: 0.2s;
  2279.     transition-timing-function: ease-in;
  2280.     visibility: collapse;
  2281. }
  2282.  
  2283. .SectionVisible_Ranked #RankedSectionContent_Locked
  2284. {
  2285.     opacity: 1.0;
  2286.     visibility: visible;
  2287. }
  2288.  
  2289. .EligibleForRanked #RankedSectionContent_Locked
  2290. {
  2291.     visibility: collapse;
  2292. }
  2293.  
  2294. ToggleButton Label
  2295. {
  2296.     text-transform: uppercase;
  2297. }
  2298.  
  2299. RadioButton Label
  2300. {
  2301.     text-transform: uppercase;
  2302. }
  2303.  
  2304. #CustomGamesSectionContent RadioButton Label,
  2305. #1v1SectionContent RadioButton Label,
  2306. #MutationSectionContent RadioButton Label
  2307. {
  2308.     text-transform: none;
  2309. }
  2310.  
  2311. #1v1SectionContent
  2312. {
  2313.     padding: 8px;
  2314.     width: 100%;
  2315.     visibility: collapse;
  2316. }
  2317.  
  2318. #GameStyle_1v1 Label
  2319. {
  2320.     text-transform: none;
  2321. }
  2322.  
  2323. DOTAPlay.SectionVisible_1v1 #1v1SectionContent
  2324. {
  2325.     visibility: visible;
  2326. }
  2327.  
  2328. #MutationSectionContent
  2329. {
  2330.     padding: 14px;
  2331.     width: 100%;
  2332.     visibility: collapse;
  2333. }
  2334.  
  2335. #GameStyle_Mutation Label
  2336. {
  2337.     text-transform: none;
  2338. }
  2339.  
  2340. DOTAPlay.SectionVisible_Mutation #MutationSectionContent
  2341. {
  2342.     visibility: visible;
  2343. }
  2344.  
  2345. #GameStyle_Mutation Label
  2346. {
  2347.     text-transform: none;
  2348. }
  2349.  
  2350.  
  2351. #PracticeBotsSectionContent
  2352. {
  2353.     width: 100%;
  2354.     padding: 8px;
  2355.     opacity: 0.0;
  2356.     transition-property: opacity;
  2357.     transition-duration: 0.2s;
  2358.     transition-timing-function: ease-in;
  2359. }
  2360.  
  2361. #PlayBotsSolo, #PlayBotsCoop
  2362. {
  2363.     width: 150px;
  2364. }
  2365.  
  2366. #BotSectionContainer
  2367. {
  2368.     width: 100%;
  2369. }
  2370.  
  2371. .BotSectionColumn
  2372. {
  2373.     width: fill-parent-flow( 1.0 );
  2374. }
  2375.  
  2376. #CustomGamesSection
  2377. {
  2378.     visibility: collapse;
  2379. }
  2380.  
  2381. DOTAPlay.MatchmadeCustomGameAvailable #CustomGamesSection
  2382. {
  2383.     visibility: visible;
  2384. }
  2385.  
  2386. #CustomGamesSectionContent
  2387. {
  2388.     width: 100%;
  2389.     height: 100%;
  2390.     padding: 8px;
  2391.     padding-left: 16px;
  2392.     flow-children: down;
  2393.  
  2394.     visibility: collapse;
  2395.  
  2396.     //background-color: gradient( linear, 0% 0%, 0% 100%, from( #5A615Ecc ), to( #879695cc ) );
  2397.     background-image: url("s2r://panorama/images/backgrounds/background_frostivus_button_background_psd.vtex");
  2398.     background-size: 100% 100%;
  2399.     background-repeat: no-repeat;
  2400. }
  2401.  
  2402. #CustomGamesSectionContent Panel
  2403. {
  2404. }
  2405.  
  2406. #CustomGamesSectionContent Label
  2407. {
  2408.     color: #fff;
  2409.     font-size: 14px;
  2410.     letter-spacing: 1px;
  2411.     line-height: 20px;
  2412. }
  2413.  
  2414. /* Dark Moon color overrides */
  2415. DOTAPlay.DarkMoon #GameStyle_CustomGames
  2416. {
  2417.     background-color: #7F3432;
  2418. }
  2419.  
  2420. DOTAPlay.DarkMoon #GameStyle_CustomGames:hover
  2421. {
  2422.     background-color: #BE474C;
  2423. }
  2424.  
  2425. DOTAPlay.DarkMoon #CustomGamesSection #GameStyle_CustomGames:hover Label
  2426. {
  2427.     color: white;
  2428. }
  2429.  
  2430.  
  2431. DOTAPlay.DarkMoon #CustomGamesSection #GameStyle_CustomGames Label
  2432. {
  2433.     color: #FFBEA0;
  2434. }
  2435.  
  2436. DOTAPlay.DarkMoon #CustomGamesSectionContent .RadioBox
  2437. {
  2438.     background-color: gradient( radial, 50% 50%, 0% 0%, 50% 50%, from( #FFB1AB ), to( #B26469 ) );
  2439.     box-shadow: #D87271aa -3px -3px 6px 6px;
  2440. }
  2441.  
  2442.  
  2443. DOTAPlay.DarkMoon #GameStyle_CustomGames:selected
  2444. {
  2445.     background-color: gradient( linear, 0% 0%, 100% 0%, from( #FFd9c6 ), color-stop( 0.015, #FFC9B6 ), color-stop( 0.02, #7F3432 ), to( #7F3432 ) );
  2446. }
  2447.  
  2448. DOTAPlay.DarkMoon #CustomGamesSectionContent
  2449. {
  2450.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #55262F ), to( #2A131B ) );
  2451. }
  2452.  
  2453. #BabyRoshan
  2454. {
  2455.     width: 512px;
  2456.     height: 512px;
  2457.     transform: translateY(-42px) translateX(-82px);
  2458.     z-index: 3;
  2459.     transition-property: opacity, pre-transform-scale2d;
  2460.     transition-duration: .32s;
  2461.     transition-timing-function: ease-in-out;
  2462.     opacity: 0;
  2463.     pre-transform-scale2d: .9;
  2464. }
  2465.  
  2466. DOTAPlay.DarkMoon.SectionVisible_CustomGames #BabyRoshan
  2467. {
  2468.     opacity: 1;
  2469.     pre-transform-scale2d: 1;
  2470. }
  2471.  
  2472.  
  2473. /* Frostivus 2017 color overrides */
  2474. DOTAPlay.Frostivus2017 #GameStyle_CustomGames
  2475. {
  2476.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #7F3432 ), to( #ac3b3f ) );
  2477. }
  2478.  
  2479. DOTAPlay.Frostivus2017 #GameStyle_CustomGames:hover
  2480. {
  2481.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #ac3b3f ), to( #7F3432 ) );
  2482. }
  2483.  
  2484. DOTAPlay.Frostivus2017 #CustomGamesSection #GameStyle_CustomGames Label
  2485. {
  2486.     color: #fff;
  2487.     font-size: 30px;
  2488. }
  2489.  
  2490. DOTAPlay.Frostivus2017 #CustomGamesSection #GameStyle_CustomGames:hover Label
  2491. {
  2492.     color: white;
  2493.     //text-shadow: #0e125b 0px 3px 6px 6px;
  2494.  
  2495. }
  2496.  
  2497. DOTAPlay.Frostivus2017 #CustomGamesSectionContent .RadioBox
  2498. {
  2499.     background-color: gradient( radial, 50% 50%, 0% 0%, 50% 50%, from( #FFB1AB ), to( #B26469 ) );
  2500.     box-shadow: #D87271aa -3px -3px 6px 6px;
  2501. }
  2502.  
  2503. DOTAPlay.Frostivus2017 #CustomGamesSectionContent
  2504. {
  2505.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #262F55 ), to( #131B2A ) );
  2506. }
  2507.  
  2508. DOTAPlay.Frostivus2017 #GameStyle_CustomGames:selected
  2509. {
  2510.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #7F3432 ), to( #ac3b3f ) );
  2511. }
  2512.  
  2513. DOTAPlay.SectionVisible_CustomGames #CustomGamesSectionContent
  2514. {
  2515.     visibility: visible;
  2516. }
  2517.  
  2518. DOTAPlay.SectionVisible_PracticeBots #PracticeBotsSectionContent
  2519. {
  2520.     opacity: 1.0;
  2521. }
  2522.  
  2523. DOTAPlay.SectionVisible_CustomGames #CustomGamesSectionContent
  2524. {
  2525.     opacity: 1.0;
  2526. }
  2527.  
  2528.  
  2529. .GameStyle
  2530. {
  2531.     background-color: #222629;
  2532.     background-color: #222629f4;
  2533.     width: 100%;
  2534.     height: 50px;
  2535.     padding-top: 12px;
  2536.     padding-bottom: 8px;
  2537.     border: 1px solid #000000DD;
  2538. }
  2539.  
  2540. .GameStyle:hover
  2541. {
  2542.     background-color: #3e474b;
  2543. }
  2544.  
  2545. .GameStyle:selected
  2546. {
  2547.     background-color: gradient( linear, 0% 0%, 100% 0%, from( #d8efee ), color-stop( 0.015, #b1dddd ), color-stop( 0.02, #3e474b ), to( #3e474b ) );
  2548.     padding-left: 12px;
  2549.     border: 1px solid #222629;
  2550.     box-shadow: fill #00000066 -4px -2px 16px 8px;
  2551.     flow-children: none;
  2552.     width: 100%;
  2553.     height: fit-children;
  2554.     padding-top: 12px;
  2555.     font-weight: bold;
  2556.     transition-property: background-color;
  2557.     transition-duration: 0.3s;
  2558.     transition-timing-function: ease-in;
  2559.     sound: "ui_find_match_change_options";
  2560. }
  2561.  
  2562. #CustomGamesSection .GameStyle
  2563. {
  2564.     background-size: 100% 100%;
  2565.     background-position: 50% 50%;
  2566.     background-repeat: no-repeat;
  2567.     background-color: #0C2228;
  2568. }
  2569.  
  2570. #GameStyle_Mutation.GameStyle
  2571. {
  2572.     background-color: #4a5e53;
  2573. }
  2574.  
  2575. #GameStyle_Mutation.GameStyle Label
  2576. {
  2577.     color: black;
  2578.     font-weight: bold;
  2579. }
  2580.  
  2581. #GameStyle_Mutation.GameStyle:selected Label
  2582. {
  2583.     color: white;
  2584. }
  2585.  
  2586.  
  2587. #GameStyle_Mutation.GameStyle:selected
  2588. {
  2589.     background-color: gradient( linear, 0% 0%, 100% 0%, from( #d8efee ), color-stop( 0.015, #b1dddd ), color-stop( 0.02, #022613 ), to( #1F6840 ) );
  2590. }
  2591.  
  2592. .Season_International2017 #CustomGamesSection
  2593. {
  2594.     background-image: url("s2r://panorama/images/battlepass/ti7/campaign/playsection_bg_psd.vtex");
  2595. }
  2596.  
  2597. #CustomGamesSection .GameStyle:hover
  2598. {
  2599.     brightness: 2;
  2600. }
  2601.  
  2602. #CustomGamesSection .GameStyle:selected
  2603. {
  2604.     background-color: gradient( linear, 0% 0%, 100% 0%, from( #8CEDCF ), color-stop( 0.015, #8CEDCF ), color-stop( 0.02, #3e474b ), to( #3e474b ) );
  2605.     brightness: 2;
  2606. }
  2607.  
  2608.  
  2609. #CustomGamesSection #GameStyle_CustomGames > Label,
  2610. #CustomGamesSection #GameStyle_CustomGames:selected > Label,
  2611. .CampaignTitle Label
  2612. {
  2613.     font-family: titleFont;
  2614.     font-size: 24px;
  2615.     margin-top: -2px;
  2616.     padding-top: 2px;
  2617.     padding-right: 8px;
  2618.     letter-spacing: 4px;
  2619.     text-overflow: shrink;
  2620.     height: 32px;
  2621.  
  2622.     color: gradient( linear, 0% 0%, 0% 100%, from( #ACC7CE ), color-stop( .3, #085269 ), color-stop( .3, #085269 ), color-stop( .8, #08536A ), to( #04FFD4 ) );
  2623. }
  2624.  
  2625. #CustomGamesSection #GameStyle_CustomGames .CampaignTitle.Rim
  2626. {
  2627.     transform: translateX(-1px) translateY(1px);
  2628.     text-shadow: 0px 0px 2px 2.0 #000;
  2629.     z-index: -2;
  2630.     color: gradient( linear, 0% 0%, 0% 100%, from( #ACC7CE ), color-stop( .2, #08536A ), to( #04FFD4 ) );
  2631. }
  2632.  
  2633. #CustomGamesSection #GameStyle_CustomGames
  2634. {
  2635.     flow-children: down;
  2636. }
  2637.  
  2638. #CustomGamesSection #Act1Radio
  2639. {
  2640.     margin-bottom: 6px;
  2641. }
  2642.  
  2643. #CustomGamesSection #Act1Radio > Label,
  2644. #CustomGamesSection #Act2Radio > Label
  2645. {
  2646.     text-transform: uppercase;
  2647.     font-size: 18px;
  2648.     letter-spacing: 1px;
  2649.     color: gradient( linear, 100% 0%, 0% 0%, from( #54D7A2 ), to( #CEEFE8 ) );
  2650.     text-shadow: 0px 1px 2px 2.0 #000;
  2651. }
  2652.  
  2653. #CustomGamesSection #Act2Radio > Label
  2654. {
  2655.     color: #648A6E;
  2656. }
  2657.  
  2658.  
  2659. #Act2Soon
  2660. {
  2661.     font-size: 14px;
  2662.     letter-spacing: 2px;
  2663.     text-transform: uppercase;
  2664.     color: #506F58;
  2665.     margin-left: 25px;
  2666.     text-align: center;
  2667.     text-shadow: 0px 1px 2px 2.0 #000;
  2668.     font-style: italic;
  2669. }
  2670.  
  2671.  
  2672. .GameStyle Label
  2673. {
  2674.     font-size: 20px;
  2675.     font-weight: thin;
  2676.     color: #666666;
  2677.     text-transform: uppercase;
  2678.     letter-spacing: 2px;
  2679.     margin-left: 20px;
  2680. }
  2681.  
  2682. .GameStyle:selected Label
  2683. {
  2684.     font-size: 20px;
  2685.     font-weight: bold;
  2686.     margin-left: 8px;
  2687.  
  2688. }
  2689.  
  2690. .GameStyle .RadioBox
  2691. {
  2692.     visibility: collapse;
  2693. }
  2694.  
  2695. .PlayTabSection
  2696. {
  2697.     height: 50px;
  2698.     width: 100%;
  2699.     background-color: sectionbg_inactive;
  2700.     background-color: none;
  2701.  
  2702.     margin-bottom: 8px;
  2703.     transition-property: height, opacity;
  2704.     transition-duration: 0.3s;
  2705.     transition-timing-function: ease-in;
  2706. }
  2707.  
  2708. #GameModeSection
  2709. {
  2710.     flow-children: down;
  2711.     margin-bottom: 8px;
  2712. }
  2713.  
  2714. DOTAPlay.SectionVisible_Normal #GameModeSection
  2715. {
  2716.     height: 370px;
  2717. }
  2718.  
  2719. #NormalSectionContent
  2720. {
  2721.     opacity: 0.0;
  2722.     width: 100%;
  2723.  
  2724.     transition-property: opacity;
  2725.     transition-duration: 0.2s;
  2726.     transition-timing-function: ease-in;
  2727. }
  2728.  
  2729. DOTAPlay.SectionVisible_Normal #NormalSectionContent
  2730. {
  2731.     opacity: 1.0;
  2732. }
  2733.  
  2734. .GameModeCheckBox
  2735. {
  2736.     width: 100%;
  2737.     tooltip-position: left;
  2738.     tooltip-body-position: 0% 50%;
  2739. }
  2740.  
  2741.  
  2742. #RankedGameModes, #SeasonalRankedGameModes, #RankedLaneSelectionGameModes
  2743. {
  2744.     width: 100%;
  2745.     padding-top: 8px;
  2746.     padding-left: 8px;
  2747. }
  2748.  
  2749. #UnrankedGameModes
  2750. {
  2751.     visibility: visible;
  2752.     width: 100%;
  2753.     padding-top: 8px;
  2754.     padding-left: 8px;
  2755.     padding-right: 8px;
  2756. }
  2757.  
  2758. DOTAPlay.RankedMode #UnrankedGameModes
  2759. {
  2760.     visibility: collapse;
  2761. }
  2762.  
  2763. .SectionHeader
  2764. {
  2765.     width: 100%;
  2766. }
  2767.  
  2768. .LowPriWarningText
  2769. {
  2770.     color: #960e0e;
  2771. }
  2772.  
  2773. #ExpandGameModesButton
  2774. {
  2775.     horizontal-align: right;
  2776.     width: 20px;
  2777.     height: 20px;
  2778.  
  2779.     background-image: url("s2r://panorama/images/control_icons/icon_collapse_png.vtex");
  2780.     background-size: 100% 100%;
  2781.     background-position: 50% 50%;
  2782.     background-repeat: no-repeat;
  2783.  
  2784.     visibility: collapse;
  2785. }
  2786.  
  2787. #CollapseGameModesButton
  2788. {
  2789.     horizontal-align: right;
  2790.     width: 20px;
  2791.     height: 20px;
  2792.  
  2793.     background-image: url("s2r://panorama/images/control_icons/icon_collapse_png.vtex");
  2794.     background-size: 100% 100%;
  2795.     background-position: 50% 50%;
  2796.     background-repeat: no-repeat;
  2797.  
  2798.     visibility: visible;
  2799. }
  2800.  
  2801. .Divider
  2802. {
  2803.     height: 0px;
  2804.     background-color: #404b4a;
  2805.     width: 100%;
  2806.     margin-top: 0px;
  2807.     margin-bottom: 4px;
  2808. }
  2809.  
  2810. #RegionLanguageSection
  2811. {
  2812.     width: 100%;
  2813.     flow-children: none;
  2814.     margin-bottom: 0px;
  2815. }
  2816.  
  2817. #RegionLanguageSection Label
  2818. {
  2819.     color: white;
  2820. }
  2821.  
  2822. #LanguageButtonLabel
  2823. {
  2824.     text-transform: uppercase;
  2825.     padding: 2px 4px 0px 4px;
  2826.     border: 2px solid #aaaaaa00;
  2827.     wash-color: #657373;
  2828.     margin-right: 16px;
  2829.  
  2830.     transition-property: border, wash-color, background-color;
  2831.     transition-delay: 0.0s;
  2832.     transition-duration: 0.15s;
  2833.     transition-timing-function: linear;
  2834. }
  2835.  
  2836. #LanguageButtonLabel:hover
  2837. {
  2838.     border: 2px solid #65737322;
  2839.     wash-color: white;
  2840.     background-color: #65737301;
  2841. }
  2842.  
  2843. #RegionButton
  2844. {
  2845.     horizontal-align: right;
  2846.     padding: 2px 4px 0px 4px;
  2847.     border: 2px solid #aaaaaa00;
  2848.     wash-color: #657373;
  2849.  
  2850.     transition-property: border, wash-color, background-color;
  2851.     transition-delay: 0.0s;
  2852.     transition-duration: 0.15s;
  2853.     transition-timing-function: linear;
  2854. }
  2855.  
  2856. #RegionButton Label
  2857. {
  2858.     text-transform: uppercase;
  2859. }
  2860.  
  2861. #RegionButton:hover
  2862. {
  2863.     border: 2px solid #65737322;
  2864.     wash-color: white;
  2865.     background-color: #65737301;
  2866. }
  2867.  
  2868. #CustomGamesButton
  2869. {
  2870.     horizontal-align: center;
  2871.     margin-bottom: 4px;
  2872.     width: 70%;
  2873.     margin-top: 10px;
  2874.     background-color: #3e464b;
  2875.  
  2876.     transition-property: wash-color;
  2877.     transition-delay: 0.0s;
  2878.     transition-duration: 0.25s;
  2879.     transition-timing-function: ease-in-out;
  2880.     flow-children: right;
  2881. }
  2882.  
  2883. #CustomGamesButtonIcon
  2884. {
  2885.     width: 14px;
  2886.     height: 14px;
  2887.     margin-bottom: 13px;
  2888.     margin-left: 6px;
  2889.     vertical-align: middle;
  2890.     background-image: url("s2r://panorama/images/control_icons/arrow_top_right_png.vtex");
  2891.     background-size: contain;
  2892.     background-repeat: no-repeat;
  2893.     transform: scaleX(-1) translateX( 5px ) translateY( 5px );
  2894.     wash-color: #91aba6;
  2895.  
  2896.  
  2897.     transition-property: wash-color, transform;
  2898.     transition-delay: 0.0s;
  2899.     transition-duration: 0.25s;
  2900.     transition-timing-function: ease-in-out;
  2901. }
  2902.  
  2903. .CustomGamesButton:hover #CustomGamesButtonIcon
  2904. {
  2905.     wash-color: white;
  2906.     transform: scaleX(-1) translateX( 0px )  translateY( 0px );
  2907. }
  2908.  
  2909. .LobbyButton
  2910. {
  2911.     margin-bottom: 4px;
  2912.     width: 100%;
  2913.     height: fit-children;
  2914.  
  2915.     padding-top: 10px;
  2916.     padding-bottom: 10px;
  2917.     background-color: sectionbg_inactive;
  2918.  
  2919.     margin-bottom: 8px;
  2920.  
  2921.     transition-property: wash-color;
  2922.     transition-delay: 0.0s;
  2923.     transition-duration: 0.25s;
  2924.     transition-timing-function: ease-in-out;
  2925. }
  2926.  
  2927. #WeekendTourneyButton
  2928. {
  2929.     flow-children: down;
  2930. }
  2931.  
  2932. .ExpandWeekendTourney #WeekendTourneyButton
  2933. {
  2934.     background-color: green;
  2935.     background-image: url("s2r://panorama/images/weekend_tourney/battle_cup_tooltip_backer_play_psd.vtex");
  2936.     background-size: 100% 100%;
  2937.     box-shadow: black -4px -4px 8px 8px;
  2938.     transition-property: brightness;
  2939.     transition-duration: .2s;
  2940.     padding-bottom: 0px;
  2941. }
  2942.  
  2943. .SelectedTourneyDivisionIsChampionsCup #WeekendTourneyButton #BattleCupRegularSeasonContainer,
  2944. #WeekendTourneyButton #ChampionsCupContainer
  2945. {
  2946.     visibility:collapse;
  2947. }
  2948.  
  2949. .SelectedTourneyDivisionIsChampionsCup #WeekendTourneyButton #ChampionsCupContainer
  2950. {
  2951.     visibility:visible;
  2952. }
  2953.  
  2954. .ExpandWeekendTourney #WeekendTourneyButton:hover
  2955. {
  2956.     brightness: 2;
  2957. }
  2958.  
  2959. #WeekendTourneyTitle
  2960. {
  2961.     width: 100%;
  2962.     flow-children: right;
  2963. }
  2964. DOTABattleCupVictoryIcon
  2965. {
  2966.     margin-top: 4px;
  2967.     margin-left: 2px;
  2968.     width: 22px;
  2969.     height: 22px;
  2970.     margin-left: 6px;
  2971. }
  2972.  
  2973. #WeekendTourneyStatus
  2974. {
  2975.     width: 100%;
  2976.  
  2977.     background-color: none;
  2978.  
  2979.     //margin-bottom: 8px;
  2980.  
  2981.     transition-property: wash-color;
  2982.     transition-delay: 0.0s;
  2983.     transition-duration: 0.25s;
  2984.     transition-timing-function: ease-in-out;
  2985.     visibility: collapse;
  2986.  
  2987.     padding-bottom: 12px;
  2988.     padding-top: 5px;
  2989. }
  2990.  
  2991. .ExpandWeekendTourney #WeekendTourneyStatus
  2992. {
  2993.     visibility: visible;
  2994. }
  2995.  
  2996. #PrivateLobbyButton
  2997. {
  2998. }
  2999.  
  3000. #CreateLobbyShortcutButton
  3001. {
  3002. }
  3003.  
  3004. .PrivateLobbyButtonIcon
  3005. {
  3006.     width: 16px;
  3007.     height: 16px;
  3008.     vertical-align: middle;
  3009.     background-image: url("s2r://panorama/images/control_icons/double_arrow_left_png.vtex");
  3010.     background-position: 1.5% 50%;
  3011.     background-size: 16px 16px;
  3012.     background-repeat: no-repeat;
  3013.     wash-color: #91aba6;
  3014.  
  3015.     transform: translateX( 6px );
  3016.  
  3017.     transition-property: transform, wash-color;
  3018.     transition-delay: 0.0s;
  3019.     transition-duration: 0.25s;
  3020.     transition-timing-function: ease-in-out;
  3021. }
  3022.  
  3023. .ExpandWeekendTourney #WeekendTourneyButton .PrivateLobbyButtonIcon
  3024. {
  3025.     wash-color: none;
  3026. }
  3027.  
  3028. .LobbyButton:hover
  3029. {
  3030. }
  3031.  
  3032. .LobbyButton:hover .PrivateLobbyButtonIcon
  3033. {
  3034.     background-position: 0% 50%;
  3035.     transform: translateX( 0px );
  3036.     wash-color: white;
  3037. }
  3038.  
  3039. .LobbyButton Label
  3040. {
  3041.     font-size: 20px;
  3042.     font-weight: thin;
  3043.     color: #999999;
  3044.     text-transform: uppercase;
  3045.     letter-spacing: 2px;
  3046.     margin-top: 4px;
  3047.     margin-left: 32px;
  3048.     vertical-align: center;
  3049.  
  3050.     transition-property: color;
  3051.     transition-delay: 0.0s;
  3052.     transition-duration: 0.25s;
  3053.     transition-timing-function: ease-in-out;
  3054. }
  3055.  
  3056. .ExpandWeekendTourney #WeekendTourneyButton.LobbyButton Label
  3057. {
  3058.     color: #ffe0a3;
  3059.     text-shadow: 0px 0px 6px 1.0 #fca64a;
  3060.     font-weight: bold;
  3061. }
  3062.  
  3063.  
  3064. .LobbyButton:hover Label
  3065. {
  3066.     color: white;
  3067. }
  3068.  
  3069. .Lobbydivider
  3070. {
  3071.     height: 1px;
  3072.     background-color: #404b4aaa;
  3073.     width: 100%;
  3074.     margin-bottom: 10px;
  3075. }
  3076.  
  3077. #CreateLobby
  3078. {
  3079.     horizontal-align: right;
  3080.     padding: 8px;
  3081.     padding-bottom: 0px;
  3082.     width: 100%;
  3083.     margin-top: 0px;
  3084. }
  3085.  
  3086. #CreateLobbyControls
  3087. {
  3088.     flow-children: right;
  3089.     horizontal-align: right;
  3090.     vertical-align: bottom;
  3091.     margin-top: 16px;
  3092.     margin-right: 8px;
  3093. }
  3094.  
  3095. #HostLocallyCheckBox
  3096. {
  3097.     margin-right: 22px;
  3098. }
  3099.  
  3100. #CreateLobbyButton
  3101. {
  3102.     width: 330px;
  3103.     min-height: 36px;
  3104.     box-shadow: fill transparent 0px 0px 0px 0px;
  3105.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #102149cc ), to( #1e3565cc ) );
  3106.     border-top: 1px solid #486ca944;
  3107.     border-left: 1px solid #486ca944;
  3108.     horizontal-align: right;
  3109.     margin: 0px;
  3110.     padding: 0px;
  3111. }
  3112.  
  3113. #CreateLobbyButton:hover
  3114. {
  3115.     box-shadow: fill transparent 0px 0px 0px 0px;
  3116.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #102149ff ), to( #345288 ) );
  3117. }
  3118.  
  3119.  
  3120. #CreateLobbyButton Label
  3121. {
  3122.     //color: #486ca9;
  3123. }
  3124.  
  3125. #CreateLobbyButton:disabled
  3126. {
  3127.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #444444cc ), to( #888888cc ) );
  3128. }
  3129.  
  3130. #CreateLobbyText
  3131. {
  3132.     width: 100%;
  3133.     text-align: center;
  3134.     margin-top: 12px;
  3135.     font-size: 20px;
  3136.     font-weight: thin;
  3137.     text-transform: uppercase;
  3138.     letter-spacing: 2px;
  3139.     font-size: 22px;
  3140.  
  3141. }
  3142.  
  3143. #LowPrioritySection
  3144. {
  3145.     width: 100%;
  3146.     height: fit-children;
  3147.     padding: 0px 12px;
  3148.     background-color: none;
  3149.  
  3150.     visibility: collapse;
  3151. }
  3152.  
  3153.  
  3154. #LowPriGlow
  3155. {
  3156.     vertical-align: bottom;
  3157.     height: 50%;
  3158.     width: 100%;
  3159.     background-color: gradient( radial, 50% 90%, 0% 0%, 50% 50%, from( #88000055 ), to( #00000000 ) );
  3160.     opacity: 0;
  3161.  
  3162.     transition-property: opacity;
  3163.     transition-duration: 0.4s;
  3164.     transition-timing-function: ease-in-out;
  3165. }
  3166.  
  3167. DOTAPlay.SlideOutVisible.LobbySelectorVisible #LowPriGlow, DOTAPlay.SlideOutVisible.LobbyVisible #LowPriGlow
  3168. {
  3169.     opacity: 0;
  3170. }
  3171.  
  3172. DOTAPlay.MatchingRestriction.SlideOutVisible.LobbySelectorVisible #PlaySlideOut, DOTAPlay.MatchingRestriction.SlideOutVisible.LobbyVisible #PlaySlideOut
  3173. {
  3174.     background-color: gradient( linear, 100% 0%, 100% 100%, from( #111111 ), color-stop( 0.01, #202327 ), color-stop( 0.2, #141619 ), to( #000000 ) );
  3175. }
  3176.  
  3177. DOTAPlay.MatchingRestriction #LowPriGlow
  3178. {
  3179.     opacity: 1;
  3180. }
  3181.  
  3182. #ReadyUp
  3183. {
  3184.     visibility: collapse;
  3185.     flow-children: down;
  3186. }
  3187.  
  3188. .ReadyUpSlot
  3189. {
  3190.     background-color: #222222;
  3191.     width: 16px;
  3192.     height: 16px;
  3193.     margin-bottom: 8px;
  3194. }
  3195.  
  3196. .ReadyUpSlot.Declined
  3197. {
  3198.     background-color: #732a2d;
  3199. }
  3200.  
  3201. .ReadyUpSlot.Accepted
  3202. {
  3203.     background-color: green;
  3204. }
  3205.  
  3206. // lobby settings edit button
  3207. #SettingsEditButton
  3208. {
  3209.     horizontal-align: right;
  3210.     margin-right: 100px;
  3211. }
  3212.  
  3213. #SettingsEditButton Label
  3214. {
  3215.     color: #DDDDDD;
  3216.     margin-top: 2px;
  3217. }
  3218.  
  3219. #SettingsEditButton:hover Label
  3220. {
  3221.     color: white;
  3222. }
  3223.  
  3224. #SettingsEditButton Image
  3225. {
  3226.     margin-top: -1px;
  3227. }
  3228.  
  3229. #LowPrioritySection Label
  3230. {
  3231.     color: #d04c23;
  3232.     text-overflow: shrink;
  3233.     visibility: collapse;
  3234. }
  3235.  
  3236. .MatchDenied_AccountDisabled #MatchDeniedReason_AccountDisabled
  3237. {
  3238.     visibility: visible;
  3239. }
  3240.  
  3241. .MatchDenied_MatchDisabledParty #MatchDeniedReason_MatchDisabledParty
  3242. {
  3243.     visibility: visible;
  3244. }
  3245.  
  3246. .MatchDenied_MatchDisabledLocal #MatchDeniedReason_MatchDisabledLocal
  3247. {
  3248.     visibility: visible;
  3249. }
  3250.  
  3251. .MatchDenied_LowPriorityParty #MatchDeniedReason_LowPriorityParty
  3252. {
  3253.     visibility: visible;
  3254. }
  3255.  
  3256. .MatchDenied_LowPriorityLocal #MatchDeniedReason_LowPriorityLocal
  3257. {
  3258.     visibility: visible;
  3259. }
  3260.  
  3261.  
  3262. .MatchDenied #PlayButton
  3263. {
  3264.     background-color: #530202;
  3265.     border-top: 1px solid #6D2929;
  3266.     border-left: 1px solid #6D2929;
  3267. }
  3268.  
  3269. DOTAPlay.MatchDenied #PlayButton:hover
  3270. {
  3271.     background-color: #6D2929;
  3272. }
  3273.  
  3274. DOTAPlay.SlideOutVisible.LobbySelectorVisible.MatchDenied_AccountDisabled #DeniedPlayButton, DOTAPlay.SlideOutVisible.LobbyLeaderStart.MatchDenied_AccountDisabled #DeniedPlayButton, DOTAPlay.SlideOutVisible.SectionVisible_PracticeBots #DeniedPlayButton
  3275. {
  3276.     visibility: collapse;
  3277. }
  3278.  
  3279. DOTAPlay.SlideOutVisible.MatchDenied_AccountDisabled #DeniedPlayButton, DOTAPlay.SlideOutVisible.MatchDenied_AccountDisabled.SectionVisible_PracticeBots.CoopBotSelected #DeniedPlayButton
  3280. {
  3281.     visibility: visible;
  3282. }
  3283.  
  3284. #DeniedPlayButton
  3285. {
  3286.     visibility: visible;
  3287.     vertical-align: bottom;
  3288.     horizontal-align: right;
  3289.     background-color: #530202;
  3290.  
  3291.     border-top: 1px solid #330000;
  3292.     border-left: 1px solid #330000;
  3293.     box-shadow: #53020266 -4px -4px 8px 8px;
  3294.     opacity: 0;
  3295.  
  3296.     transition-property: opacity;
  3297.     transition-duration: 0.0s;
  3298. }
  3299.  
  3300. #DeniedPlayButton Label
  3301. {
  3302.     color: #330000;
  3303. }
  3304.  
  3305. DOTAPlay.MatchDenied_LowPriorityParty #PlayButton
  3306. {
  3307.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #576f3f ), to( #554422 ) );
  3308. }
  3309.  
  3310. DOTAPlay.MatchDenied_LowPriorityParty #PlayButton:hover
  3311. {
  3312.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #779950 ), to( #735E2C ) );
  3313. }
  3314.  
  3315. // Leaver Consequences
  3316.  
  3317. .LeaverConsequences
  3318. {
  3319.     margin-right: 420px;
  3320.     margin-bottom: 72px;
  3321.     width: 630px;
  3322.     height: fit-children;
  3323.     vertical-align: bottom;
  3324.     horizontal-align: right;
  3325.     flow-children: right;
  3326.     padding-top: 5px;
  3327.     padding-left: 10px;
  3328.     padding-right: 10px;
  3329.  
  3330.     transition-property: opacity;
  3331.     transition-duration: 0.4s;
  3332.     transition-delay: 0.3s;
  3333.     transition-timing-function: ease-in;
  3334.  
  3335.     tooltip-position: top;
  3336.     tooltip-body-position: 100% 50%;
  3337.     tooltip-arrow-position: 96% 50%;
  3338.  
  3339.     opacity: 0;
  3340. }
  3341.  
  3342. .Warning
  3343. {
  3344.     height: 32px;
  3345. }
  3346.  
  3347.  
  3348. .LeaverConsequences Label
  3349. {
  3350.     text-align: right;
  3351. }
  3352.  
  3353. DOTAPlay.CanDisconnect .LeaverConsequences
  3354. {
  3355.     margin-right: 58px;
  3356. }
  3357.  
  3358. .Warning
  3359. {
  3360.     color: #b63b21;
  3361. }
  3362.  
  3363. .InfoIcon
  3364. {
  3365.     wash-color: #b63b21dd;
  3366.     margin-bottom: 4px;
  3367. }
  3368.  
  3369. .Consequences
  3370. {
  3371.     text-align: right;
  3372.     //width: 100%;
  3373.     font-size: 18px;
  3374. }
  3375.  
  3376. #ConsequencesContainer
  3377. {
  3378.     flow-children: right;
  3379.     horizontal-align: right;
  3380. }
  3381.  
  3382. .LeaverConsequence_Safe #LeaverConsequences
  3383. {
  3384.     opacity: 1;
  3385.     visibility: visible;
  3386. }
  3387.  
  3388. DOTAPlay.Connecting #LeaverConsequences
  3389. {
  3390.     visibility: collapse;
  3391. }
  3392.  
  3393. .LeaverConsequence_Safe #LeaverConsequences Label
  3394. {
  3395.     text-shadow: 0px 0px 6px 1.0 #00ff00aa;
  3396.     text-align: right;
  3397.     horizontal-align: right;
  3398.     color: #bbffdd;
  3399. }
  3400.  
  3401. .LeaverConsequence_Warning #LeaverConsequences_Warning
  3402. {
  3403.     opacity: 1;
  3404.     visibility: visible;
  3405. }
  3406.  
  3407. DOTAPlay.Connecting #LeaverConsequences_Warning
  3408. {
  3409.     visibility: collapse;
  3410. }
  3411.  
  3412. #BackgroundClickCatcher
  3413. {
  3414.     width: 100%;
  3415.     height: 100%;
  3416.     opacity: 1;
  3417.     color: red;
  3418.     //visibility: collapse;
  3419. }
  3420.  
  3421. #TeamIdentity
  3422. {
  3423.     visibility: collapse;
  3424.     flow-children: right;
  3425.  
  3426.     padding: 16px;
  3427.     padding-bottom: 8px;
  3428.     margin-top: 10px;
  3429.     margin-bottom: 0px;
  3430.     margin-left: 12px;
  3431.     margin-right: 12px;
  3432.     background-color: #15171944;
  3433.     box-shadow: inset #00000066 0px 2px 6px 0px;
  3434.  
  3435.     width: 100%;
  3436.     padding-top: 12px;
  3437. }
  3438.  
  3439. DOTAPlay.ValidTeamIdentity.EligibleForRanked #TeamIdentity
  3440. {
  3441.     visibility: visible;
  3442. }
  3443.  
  3444. #UseTeamIdentityCheckbox
  3445. {
  3446.     width: fill-parent-flow( 1.0 );
  3447. }
  3448.  
  3449. #TeamPrevious
  3450. {
  3451.     vertical-align: center;
  3452. }
  3453.  
  3454. #TeamNext
  3455. {
  3456.     vertical-align: center;
  3457. }
  3458.  
  3459. #TeamMMRRow
  3460. {
  3461.     visibility: collapse;
  3462. }
  3463.  
  3464. DOTAPlay.ValidTeamIdentity.EligibleForRanked #TeamMMRRow
  3465. {
  3466.     visibility: visible;
  3467. }
  3468.  
  3469. #NoValidTeamIdentitiesLabel
  3470. {
  3471.     visibility: visible;
  3472.     width: 100%;
  3473.     text-align: center;
  3474.     margin-top: 6px;
  3475.     color: baseText;
  3476.     font-size: 16px;
  3477. }
  3478.  
  3479. DOTAPlay.ValidTeamIdentity.EligibleForRanked #NoValidTeamIdentitiesLabel
  3480. {
  3481.     visibility: collapse;
  3482. }
  3483.  
  3484. .ViolatorTag
  3485. {
  3486.     margin-top: -70px;
  3487.     margin-bottom: 48px;
  3488.     horizontal-align: right;
  3489.     margin-right: 12px;
  3490.     background-color: #ccfaf1;
  3491.     background-color: gradient( linear, 0% 0%, 0% 100%, from( #ccfaf1 ), to( #52b5A1 ) );
  3492.     border: 1px solid #517360;
  3493.     padding-left: 6px;
  3494.     padding-top: 2px;
  3495.     padding-right: 4px;
  3496.     text-transform: uppercase;
  3497.     letter-spacing: 1px;
  3498.     text-align: center;
  3499.     font-size: 14px;
  3500.     color: #384254;
  3501.     font-weight: bold;
  3502.     transform: translateY(0px);
  3503.     opacity: 0;
  3504.  
  3505.     transition-property: transform, opacity;
  3506.     transition-duration: .2s;
  3507. }
  3508.  
  3509. .GCStatusVisible .ViolatorTag
  3510. {
  3511.     opacity: 0;
  3512. }
  3513.  
  3514. .MatchmadeCustomGameAvailable .ViolatorTag
  3515. {
  3516.     opacity: 1;
  3517. }
  3518.  
  3519.  
  3520. .SectionVisible_CustomGames .ViolatorTag
  3521. {
  3522.     transform: translateY(26px);
  3523. }
  3524.  
  3525. #TeamLogo
  3526. {
  3527.     height: 50px;
  3528.     width: 50px;
  3529.     margin: 5px;
  3530.     border-radius: 7px 7px;
  3531.     background-color: #000000;
  3532. }
  3533.  
  3534. #BotScriptWorkshopURL
  3535. {
  3536.     horizontal-align: right;
  3537. }
  3538.  
  3539. #BotScriptWorkshopURL Label
  3540. {
  3541.     color: #888;
  3542.     font-size: 16px;
  3543.     text-decoration: underline;
  3544.  
  3545.     transition-property: color;
  3546.     transition-duration: 0.1s;
  3547.     transition-timing-function: ease-in-out;
  3548. }
  3549.  
  3550. #BotScriptWorkshopURL:hover Label
  3551. {
  3552.     color: #CCC;
  3553. }
  3554.  
  3555.  
  3556. #BotScriptWorkshopURL:disabled Label
  3557. {
  3558.     color: #666;
  3559. }
  3560.  
  3561. #BotScriptWorkshopURL:disabled:hover Label
  3562. {
  3563.     color: #666;
  3564. }
  3565.  
  3566. #GameMode_AllPick
  3567. {
  3568.     background-color: #444e51;
  3569. }
  3570.  
  3571. #GameMode_AllPick > Label
  3572. {
  3573.     font-size: 28px;
  3574.     font-weight: bold;
  3575.     color: gradient( linear, 0% 0%, 0% 100%, from( #fff ), to ( #aaadae ));
  3576.     text-shadow: 2px 2px 0px black;
  3577.     letter-spacing: 1px;
  3578. }
  3579.  
  3580. #GameMode_Turbo
  3581. {
  3582.     margin-top: 8px;
  3583.     margin-bottom: 4px;
  3584.     background-color: #444e51;
  3585. }
  3586.  
  3587. #GameMode_Turbo > Label
  3588. {
  3589.     font-size: 22px;
  3590.     font-weight: bold;
  3591.     color: #ccc;
  3592.     text-shadow: 1px 1px 0px black;
  3593.     letter-spacing: 1px;
  3594. }
  3595.  
  3596. .SmallGameModeViolator,
  3597. .GameModeViolator
  3598. {
  3599.     vertical-align: middle;
  3600.     margin-left: 4px;
  3601. }
  3602.  
  3603. .SmallGameModeViolator.Acknowledged,
  3604. .GameModeViolator.Acknowledged
  3605. {
  3606.     visibility: collapse;
  3607. }
  3608.  
  3609. .GameModeViolator > Label
  3610. {
  3611.     color: #94cee1;
  3612.     text-shadow: 0px 0px 6px #94cee1;
  3613.     font-size: 18px;
  3614.     letter-spacing: 1px;
  3615. }
  3616.  
  3617. .SmallGameModeViolator > Label
  3618. {
  3619.     color: #94cee1;
  3620.     text-shadow: 0px 0px 6px #94cee1;
  3621.     font-size: 14px;
  3622.     letter-spacing: 1px;
  3623. }
  3624.  
  3625.  
  3626. .RankTierContainer
  3627. {
  3628.     vertical-align: center;
  3629.     horizontal-align: right;
  3630.  
  3631.     width: 88px;
  3632.     height: 88px;
  3633.  
  3634.     tooltip-position: bottom;
  3635.     tooltip-body-position: 50% 10%;
  3636.  
  3637.     background-size: 100%;
  3638. }
  3639.  
  3640.  
  3641. .RankTierImage, .RankPipImage
  3642. {
  3643.     width: 100%;
  3644.     height: 100%;
  3645.     background-size: 100%;
  3646. }
  3647.  
  3648. .RankLeaderboardLabel
  3649. {
  3650.     color: #F7E5c3;
  3651.     letter-spacing: 1px;
  3652.     font-size: 18px;
  3653.     text-align: center;
  3654.     text-shadow: 2px 2px #00000080;
  3655.     horizontal-align: center;
  3656.     vertical-align: bottom;
  3657.  
  3658.     background-color: #00000060;
  3659.     width: 100%;
  3660.     visibility: collapse;
  3661. }
  3662.  
  3663. .HasLeaderboardRank .RankLeaderboardLabel
  3664. {
  3665.     visibility: visible;
  3666. }
  3667.  
  3668.  
  3669. .RankTierInfo
  3670. {
  3671.     width: 24px;
  3672.     height: 24px;
  3673.     horizontal-align: right;
  3674.     vertical-align: bottom;
  3675.     background-image: url("s2r://panorama/images/icon_info_png.vtex");
  3676.     background-size: 100%;
  3677.     opacity: 0.5;
  3678. }
  3679.  
  3680. .BackgroundFX
  3681. {
  3682.     width: 100%;
  3683.     height: 100%;
  3684.     opacity-mask: url("s2r://panorama/images/masks/softedge_box_irregular_png.vtex");
  3685. }
  3686.  
  3687.  
  3688. #RankedGameModesContainer
  3689. {
  3690.     width: 100%;
  3691. }
  3692.  
  3693. #RankedLaneSelectionSection
  3694. {
  3695.     width: 100%;
  3696.     margin-bottom: 8px;
  3697. }
  3698.  
  3699. DOTAPlay.SectionVisible_RankedLaneSelection #RankedLaneSelectionSection
  3700. {
  3701.     background-color: sectionbg_active;
  3702.     height: fit-children;
  3703.     opacity: 1.0;
  3704. }
  3705.  
  3706. DOTAPlay.SectionVisible_RankedLaneSelection.EligibleForRankedLaneSelection #RankedLaneSelectionSection
  3707. {
  3708.     background-color: sectionbg_active;
  3709.     opacity: 1.0;
  3710. }
  3711.  
  3712. #RankedLaneSelectionSection .InfoIcon
  3713. {
  3714.     wash-color: #888888FF;
  3715.     width: 12px;
  3716.     height: width-percentage( 100% );
  3717.     margin-left: 1px;
  3718.     margin-top: 1px;
  3719. }
  3720.  
  3721. #RankedLaneSelectionLocked
  3722. {
  3723.     margin-left: 2px;
  3724.     margin-top: -2px;
  3725.     width: 25px;
  3726.     height: 28px;
  3727.     wash-color: #62BECF;
  3728. }
  3729.  
  3730. #RankedLaneSelectionSectionContent_Locked
  3731. {
  3732.     opacity: 0.0;
  3733.     width: 100%;
  3734.  
  3735.     padding: 14px;
  3736.  
  3737.     transition-property: opacity;
  3738.     transition-duration: 0.2s;
  3739.     transition-timing-function: ease-in;
  3740.     visibility: collapse;
  3741. }
  3742.  
  3743. #RankedLaneSelectionSectionContent_Locked Label
  3744. {
  3745.     width: 274px;
  3746. }
  3747.  
  3748. #RankedLaneSelectionSectionContent_Locked Label a
  3749. {
  3750.     color: #B1CBC6;
  3751. }
  3752.  
  3753. .SectionVisible_RankedLaneSelection #RankedLaneSelectionSectionContent_Locked
  3754. {
  3755.     opacity: 1.0;
  3756.     visibility: visible;
  3757. }
  3758.  
  3759. .EligibleForRankedLaneSelection #RankedLaneSelectionSectionContent_Locked
  3760. {
  3761.     visibility: collapse;
  3762. }
  3763.  
  3764. #RankedLaneSelectionSectionContent
  3765. {
  3766.     opacity: 0.0;
  3767.     width: 100%;
  3768.  
  3769.     transition-property: opacity;
  3770.     transition-duration: 0.2s;
  3771.     transition-timing-function: ease-in;
  3772.     visibility: collapse;
  3773. }
  3774.  
  3775. .SectionVisible_RankedLaneSelection.EligibleForRankedLaneSelection #RankedLaneSelectionSectionContent
  3776. {
  3777.     opacity: 1.0;
  3778.     visibility: visible;
  3779. }
  3780.  
  3781. #ChallengeModeContainer
  3782. {
  3783.     flow-children: down;
  3784.     width: 100%;
  3785.     height: fit-children;
  3786.     padding-top: 20px;
  3787. }
  3788.  
  3789. #ChallengeModeContainer ToggleButton:disabled Label
  3790. {
  3791.     color: #666;
  3792. }
  3793.  
  3794. #ChallengeModeTokens
  3795. {
  3796.     width: 100%;
  3797.     height: fit-children;
  3798.     flow-children: right;
  3799.     padding-left: 30px;
  3800. }
  3801.  
  3802. #ChallengeModeTokens Image
  3803. {
  3804.     height: 32px;
  3805.     width: 32px;
  3806. }
  3807.  
  3808. #ChallengeModeTokens Label
  3809. {
  3810.     vertical-align: center;
  3811.     font-size: 20px;
  3812. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top