You are here

skin.css in Views Slideshow JCarousel 7.2

.jcarousel-skin-tango .jcarousel-container {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
   border-radius: 10px;
    background: #F0F6F9;
    border: 1px solid #346F97;
}

.jcarousel-skin-tango .jcarousel-direction-rtl {
	direction: rtl;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 245px;
    padding: 20px 40px;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 75px;
    height: 245px;
    padding: 40px 20px;
}

.jcarousel-skin-tango .jcarousel-clip {
    overflow: hidden;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  245px;
    height: 75px;
}

.jcarousel-skin-tango .jcarousel-clip-vertical {
    width:  75px;
    height: 245px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 75px;
    height: 75px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
	margin-left: 0;
    margin-right: 10px;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal {
	margin-left: 10px;
    margin-right: 0;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 43px;
    right: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: 5px;
    right: auto;
    background-image: url(prev-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-horizontal:focus {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 43px;
    left: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: 5px;
    background-image: url(next-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover, 
.jcarousel-skin-tango .jcarousel-prev-horizontal:focus {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-vertical:focus {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-next-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:focus,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-vertical:focus {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:focus,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

File

skins/tango/skin.css
View source
  1. .jcarousel-skin-tango .jcarousel-container {
  2. -moz-border-radius: 10px;
  3. -webkit-border-radius: 10px;
  4. border-radius: 10px;
  5. background: #F0F6F9;
  6. border: 1px solid #346F97;
  7. }
  8. .jcarousel-skin-tango .jcarousel-direction-rtl {
  9. direction: rtl;
  10. }
  11. .jcarousel-skin-tango .jcarousel-container-horizontal {
  12. width: 245px;
  13. padding: 20px 40px;
  14. }
  15. .jcarousel-skin-tango .jcarousel-container-vertical {
  16. width: 75px;
  17. height: 245px;
  18. padding: 40px 20px;
  19. }
  20. .jcarousel-skin-tango .jcarousel-clip {
  21. overflow: hidden;
  22. }
  23. .jcarousel-skin-tango .jcarousel-clip-horizontal {
  24. width: 245px;
  25. height: 75px;
  26. }
  27. .jcarousel-skin-tango .jcarousel-clip-vertical {
  28. width: 75px;
  29. height: 245px;
  30. }
  31. .jcarousel-skin-tango .jcarousel-item {
  32. width: 75px;
  33. height: 75px;
  34. }
  35. .jcarousel-skin-tango .jcarousel-item-horizontal {
  36. margin-left: 0;
  37. margin-right: 10px;
  38. }
  39. .jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal {
  40. margin-left: 10px;
  41. margin-right: 0;
  42. }
  43. .jcarousel-skin-tango .jcarousel-item-vertical {
  44. margin-bottom: 10px;
  45. }
  46. .jcarousel-skin-tango .jcarousel-item-placeholder {
  47. background: #fff;
  48. color: #000;
  49. }
  50. /**
  51. * Horizontal Buttons
  52. */
  53. .jcarousel-skin-tango .jcarousel-next-horizontal {
  54. position: absolute;
  55. top: 43px;
  56. right: 5px;
  57. width: 32px;
  58. height: 32px;
  59. cursor: pointer;
  60. background: transparent url(next-horizontal.png) no-repeat 0 0;
  61. }
  62. .jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
  63. left: 5px;
  64. right: auto;
  65. background-image: url(prev-horizontal.png);
  66. }
  67. .jcarousel-skin-tango .jcarousel-next-horizontal:hover,
  68. .jcarousel-skin-tango .jcarousel-next-horizontal:focus {
  69. background-position: -32px 0;
  70. }
  71. .jcarousel-skin-tango .jcarousel-next-horizontal:active {
  72. background-position: -64px 0;
  73. }
  74. .jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
  75. .jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
  76. .jcarousel-skin-tango .jcarousel-next-disabled-horizontal:focus,
  77. .jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
  78. cursor: default;
  79. background-position: -96px 0;
  80. }
  81. .jcarousel-skin-tango .jcarousel-prev-horizontal {
  82. position: absolute;
  83. top: 43px;
  84. left: 5px;
  85. width: 32px;
  86. height: 32px;
  87. cursor: pointer;
  88. background: transparent url(prev-horizontal.png) no-repeat 0 0;
  89. }
  90. .jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
  91. left: auto;
  92. right: 5px;
  93. background-image: url(next-horizontal.png);
  94. }
  95. .jcarousel-skin-tango .jcarousel-prev-horizontal:hover,
  96. .jcarousel-skin-tango .jcarousel-prev-horizontal:focus {
  97. background-position: -32px 0;
  98. }
  99. .jcarousel-skin-tango .jcarousel-prev-horizontal:active {
  100. background-position: -64px 0;
  101. }
  102. .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
  103. .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
  104. .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:focus,
  105. .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
  106. cursor: default;
  107. background-position: -96px 0;
  108. }
  109. /**
  110. * Vertical Buttons
  111. */
  112. .jcarousel-skin-tango .jcarousel-next-vertical {
  113. position: absolute;
  114. bottom: 5px;
  115. left: 43px;
  116. width: 32px;
  117. height: 32px;
  118. cursor: pointer;
  119. background: transparent url(next-vertical.png) no-repeat 0 0;
  120. }
  121. .jcarousel-skin-tango .jcarousel-next-vertical:hover,
  122. .jcarousel-skin-tango .jcarousel-next-vertical:focus {
  123. background-position: 0 -32px;
  124. }
  125. .jcarousel-skin-tango .jcarousel-next-vertical:active {
  126. background-position: 0 -64px;
  127. }
  128. .jcarousel-skin-tango .jcarousel-next-disabled-vertical,
  129. .jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
  130. .jcarousel-skin-tango .jcarousel-next-disabled-vertical:focus,
  131. .jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
  132. cursor: default;
  133. background-position: 0 -96px;
  134. }
  135. .jcarousel-skin-tango .jcarousel-prev-vertical {
  136. position: absolute;
  137. top: 5px;
  138. left: 43px;
  139. width: 32px;
  140. height: 32px;
  141. cursor: pointer;
  142. background: transparent url(prev-vertical.png) no-repeat 0 0;
  143. }
  144. .jcarousel-skin-tango .jcarousel-prev-vertical:hover,
  145. .jcarousel-skin-tango .jcarousel-prev-vertical:focus {
  146. background-position: 0 -32px;
  147. }
  148. .jcarousel-skin-tango .jcarousel-prev-vertical:active {
  149. background-position: 0 -64px;
  150. }
  151. .jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
  152. .jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
  153. .jcarousel-skin-tango .jcarousel-prev-disabled-vertical:focus,
  154. .jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
  155. cursor: default;
  156. background-position: 0 -96px;
  157. }