Sin descripción

ms-vertical.css 3.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. .ms-tabs-vertical-template {
  2. padding: 5px 140px 5px 5px;
  3. margin: 0 auto;
  4. background-color: #ffffff;
  5. }
  6. .ms-tabs-vertical-template .ms-sbar .ms-bar{
  7. background-color: #ffffff;
  8. }
  9. .ms-tabs-vertical-template .ms-nav-next {
  10. top: 50%;
  11. right: 0;
  12. background:#a19f98;
  13. width: 40px;
  14. height: 40px;
  15. margin-top: -20px;
  16. text-align:center;
  17. line-height:40px;
  18. }
  19. .ms-tabs-vertical-template .ms-nav-next:before {
  20. content:'\f105';
  21. font-family:'FontAwesome';
  22. color: #ffffff;
  23. font-size: 14px;
  24. }
  25. .ms-tabs-vertical-template .ms-nav-prev{
  26. top: 50%;
  27. left: 0;
  28. background:#a19f98;
  29. width: 40px;
  30. height: 40px;
  31. margin-top: -20px;
  32. text-align:center;
  33. line-height:40px;
  34. }
  35. .ms-tabs-vertical-template .ms-nav-prev:before {
  36. content:'\f104';
  37. font-family:'FontAwesome';
  38. color: #ffffff;
  39. font-size: 14px;
  40. }
  41. .ms-tabs-vertical-template .ms-nav-next:hover,
  42. .ms-tabs-vertical-template .ms-nav-prev:hover{
  43. background:#6a7577;
  44. }
  45. .ms-vertical-template .ms-thumb-list.ms-dir-h {
  46. bottom: -101px;
  47. width: 100%;
  48. height: 113px;
  49. }
  50. .ms-vertical-template .ms-thumb-list.ms-dir-v {
  51. height: 100%;
  52. width: 135px;
  53. right: -135px;
  54. top: 0;
  55. }
  56. .ms-vertical-template .ms-thumb-frame {
  57. cursor: pointer;
  58. }
  59. .ms-vertical-template .ms-thumb-list.ms-dir-h .ms-thumb-frame {
  60. width: 214px;
  61. height: auto;
  62. margin: 12px 0 0 0;
  63. }
  64. .ms-vertical-template .ms-thumb-list.ms-dir-v .ms-thumb-frame {
  65. width: 135px;
  66. /*height: 85px;*/
  67. margin: 0 0 5px 5px;
  68. opacity: 1;
  69. -webkit-transition: opacity 300ms;
  70. -moz-transition: opacity 300ms;
  71. -ms-transition: opacity 300ms;
  72. -o-transition: opacity 300ms;
  73. transition: opacity 300ms;
  74. }
  75. .ms-vertical-template .ms-thumb-frame-selected {
  76. opacity: 0.80 !important;
  77. }
  78. .ms-vertical-template .ms-thumb-frame-selected h3{
  79. color:#4b8aac;
  80. }
  81. .ms-vertical-template .ms-thumblist-fwd, .ms-thumblist-bwd {
  82. width: 100%;
  83. position: absolute;
  84. top: 0;
  85. height: 15px;
  86. cursor: pointer;
  87. background: url(arrow.png) no-repeat;
  88. background-position: 50% -106px;
  89. }
  90. .ms-vertical-template .ms-thumblist-bwd {
  91. top: auto;
  92. bottom: 0;
  93. background-position: 50% -145px;
  94. }
  95. @media (max-width: 600px) {
  96. .ms-vertical-template .ms-thumb-list.ms-dir-v {
  97. width: 80px;
  98. right: -80px;
  99. }
  100. .ms-vertical-template .ms-thumb-list.ms-dir-v .ms-thumb-frame {
  101. width: 80px;
  102. height: 45px;
  103. }
  104. .ms-vertical-template {
  105. padding-right: 85px;
  106. }
  107. }
  108. @media (max-width: 300px) {
  109. .ms-vertical-template .ms-thumb-list.ms-dir-v {
  110. display: none;
  111. }
  112. .ms-vertical-template{
  113. padding-right: 5px;
  114. }
  115. }
  116. /* Layers */
  117. .ms-layer.video-title {
  118. font-family: "Lato",sans-serif;
  119. color: white;
  120. font-weight: 600;
  121. font-size: 42px;
  122. margin:0px;
  123. letter-spacing:0px;
  124. }
  125. .ms-layer.video-title.video-top-title {
  126. font-size: 16px;
  127. color: gray;
  128. }
  129. .ms-layer.video-title.video-sub-title {
  130. font-size: 22px;
  131. font-weight: 300;
  132. }