You are here

Home » API reference » Opigno tour 3.x

opigno_tour.css in Opigno tour 3.x

Same filename and directory in other branches
  1. 8 css/opigno_tour.css

Styles for Tour theme.

File

css/opigno_tour.css
View source 
  1. /**

  2.  * @file

  3.  * Styles for Tour theme.

  4.  */

  5. 

  6. /* Default styles for the container */

  7. .joyride-tip-guide {

  8.   background: #000;

  9.   background: rgba(0, 0, 0, 0.8);

  10.   color: #fff;

  11.   border-radius: 5px;

  12. }

  13. 

  14. /* Mobile */

  15. @media only screen and (max-width: 767px) {

  16.   .joyride-tip-guide {

  17.     border-radius: 0;

  18.   }

  19. }

  20. 

  21. /* Add a little css triangle pip, older browser just miss out on the fanciness of it. */

  22. .joyride-tip-guide .joyride-nub {

  23.   border: solid 14px rgba(0, 0, 0, 0.8);

  24. }

  25. .joyride-tip-guide .joyride-nub.top {

  26.   border-top-color: transparent;

  27.   border-left-color: transparent;

  28.   border-right-color: transparent;

  29. }

  30. .joyride-tip-guide .joyride-nub.bottom {

  31.   border-bottom-color: transparent;

  32.   border-left-color: transparent;

  33.   border-right-color: transparent;

  34. }

  35. .joyride-tip-guide .joyride-nub.right {

  36.   border-top-color: transparent;

  37.   border-right-color: transparent; /* LTR */

  38.   border-bottom-color: transparent;

  39. }

  40. [dir="rtl"] .joyride-tip-guide .joyride-nub.right {

  41.   border-left-color: transparent;

  42.   border-right-color: rgba(0, 0, 0, 0.8);

  43. }

  44. .joyride-tip-guide .joyride-nub.left {

  45.   border-top-color: transparent;

  46.   border-left-color: transparent; /* LTR */

  47.   border-bottom-color: transparent;

  48. }

  49. [dir="rtl"] .joyride-tip-guide .joyride-nub.left {

  50.   border-left-color: rgba(0, 0, 0, 0.8);

  51.   border-right-color: transparent;

  52. }

  53. .joyride-tip-guide .joyride-nub.top-right {

  54.   border-top-color: transparent;

  55.   border-left-color: transparent;

  56.   border-right-color: transparent;

  57. }

  58. 

  59. /* Typography */

  60. .joyride-tip-guide h2 {

  61.   color: #fff;

  62. }

  63. .joyride-tip-guide p {

  64.   line-height: 1.385em;

  65. }

  66. .joyride-tip-guide a {

  67.   color: #fff;

  68. }

  69. 

  70. /* Button Style */

  71. .joyride-tip-guide .joyride-next-tip {

  72.   margin: 0;

  73. }

  74. .joyride-timer-indicator-wrap {

  75.   border: solid 1px rgba(255, 255, 255, 0.1);

  76. }

  77. .joyride-timer-indicator {

  78.   background: rgba(255, 255, 255, 0.25);

  79. }

  80. 

  81. .joyride-close-tip {

  82.   color: rgba(255, 255, 255, 0.4);

  83.   text-decoration: none;

  84.   font-size: 1.4em;

  85.   font-weight: bold;

  86. }

  87. .joyride-close-tip:hover,

  88. .joyride-close-tip:focus {

  89.   color: rgba(255, 255, 255, 0.9);

  90.   text-decoration: none;

  91. }

  92. 

  93. .joyride-modal-bg {

  94.   background: rgba(0, 0, 0, 0.5);

  95. }

  96. 

  97. .joyride-expose-wrapper {

  98.   background-color: #fff;

  99. }

  100. 

  101. .joyride-expose-cover {

  102.   background: transparent;

  103. }