www/plugins/auto/anythingslider/css/theme-minimalist-round.css

   1 /*
   2         AnythingSlider v1.5.10 Minimalist Round Theme
   3         By Rob Garrison
   4 */
   5
   6 /****** SET COLORS HERE *******/
   7 /* Default State */
   8 div.anythingSlider-minimalist-round .anythingWindow {
   9         background: url('../images/slider-bg.png') 0 0 no-repeat;
  10         width: 500px;
  11         height: 207px;
  12 }
  13
  14 div.anythingSlider-minimalist-round .anythingControls ul a {
  15         background: #333;
  16 }
  17 div.anythingSlider-minimalist-round .anythingControls ul a:hover, div.anythingSlider-minimalist-round .anythingControls ul a.cur {
  18         background: #777;
  19 }
  20 div.anythingSlider-minimalist-round .start-stop {
  21         border: 1px solid #000;
  22 }
  23 div.anythingSlider-minimalist-round .start-stop.playing {
  24         background-color: #300;
  25 }
  26 div.anythingSlider-minimalist-round .start-stop:hover, div.anythingSlider-minimalist-round .start-stop.hover {
  27         color: #ddd;
  28 }
  29
  30 /* Active State */
  31 div.anythingSlider-minimalist-round.activeSlider .anythingWindow {
  32         border-color: #164054;
  33 }
  34 div.anythingSlider-minimalist-round.activeSlider .anythingControls ul a {
  35         background-color: #164054;
  36 }
  37 div.anythingSlider-minimalist-round.activeSlider .anythingControls ul a:hover, div.anythingSlider-minimalist-round.activeSlider .anythingControls ul a.cur {
  38         background: #fff;
  39 }
  40 div.anythingSlider-minimalist-round.activeSlider .start-stop.playing {
  41         background-color: #f00;
  42 }
  43 div.anythingSlider-minimalist-round .start-stop:hover, div.anythingSlider-minimalist-round .start-stop.hover {
  44         color: #fff;
  45 }
  46
  47 /* Navigation Arrows */
  48 div.anythingSlider-minimalist-round .arrow {
  49         top: 50%;
  50         position: absolute;
  51         display: block;
  52 }
  53 div.anythingSlider-minimalist-round .arrow a {
  54         display: block;
  55         height: 48px;
  56         margin-top: -20px; /* half height of image */
  57         width: 30px;
  58         text-align: center;
  59         outline: 0;
  60         background: url(../images/arrows-minimalist.png) no-repeat;
  61 }
  62 div.anythingSlider-minimalist-round .forward { right: 0; }
  63 div.anythingSlider-minimalist-round .back { left: 0; }
  64 div.anythingSlider-minimalist-round .forward a { background-position: right bottom; }
  65 div.anythingSlider-minimalist-round .back a { background-position: left bottom; }
  66 div.anythingSlider-minimalist-round .forward a:hover, div.anythingSlider-minimalist-round .forward a.hover { background-position: right top; }
  67 div.anythingSlider-minimalist-round .back a:hover, div.anythingSlider-minimalist-round .back a.hover { background-position: left top; }
  68
  69 /* Navigation Links */
  70 div.anythingSlider-minimalist-round .anythingControls {
  71         float: right;
  72         position: absolute;
  73         bottom: 1.5em;
  74         right: 4em;
  75         z-index: 100;
  76         opacity: 0.90;
  77         filter: alpha(opacity=90);
  78 }
  79 div.anythingSlider-minimalist-round .anythingControls ul {
  80         margin: 0;
  81         z-index: 100;
  82 }
  83 div.anythingSlider-minimalist-round .anythingControls ul li {
  84         display: block;
  85         float: left;
  86 }
  87 div.anythingSlider-minimalist-round .anythingControls ul a {
  88         display: block;
  89         height: 10px;
  90         width: 10px;
  91         margin: 3px;
  92         padding: 0;
  93         outline: 0;
  94         border-radius: 5px;
  95         -moz-border-radius: 5px;
  96         -webkit-border-radius: 5px;
  97 }
  98
  99 /* Navigation size window arrows */
 100 div.anythingSlider-minimalist-round .anythingControls li.next a span, div.anythingSlider-minimalist-round .anythingControls li.prev a span {
 101         text-indent: 1px;
 102         margin-top: 3px;
 103 }
 104 div.anythingSlider-minimalist-round .anythingControls li.prev a, div.anythingSlider-minimalist-round .anythingControls li.next a {
 105         color: #ddd;
 106 }
 107 div.anythingSlider-minimalist-round .anythingControls li.next a:hover, div.anythingSlider-minimalist-round .anythingControls li.prev a:hover {
 108         color: #000;
 109 }
 110
 111 /* slider autoplay right-to-left, reverse order of nav links to look better */
 112 div.anythingSlider-minimalist-round.rtl .anythingControls ul a { float: right; } /* reverse order of nav links */
 113 div.anythingSlider-minimalist-round.rtl .anythingControls ul { float: left; }    /* move nav link group to left */
 114 /* div.anythingSlider-minimalist-round.rtl .start-stop { float: right; } */ /* move start/stop button - in case you want to switch sides */
 115
 116 /* Autoplay Start/Stop button */
 117 div.anythingSlider-minimalist-round .start-stop {
 118         margin: 3px;
 119         padding: 0;
 120         display: inline-block;
 121         width: 14px;
 122         height: 14px;
 123         position: relative;
 124         bottom: 2px;
 125         left: 0;
 126         z-index: 100;
 127         text-align: center;
 128         text-decoration: none;
 129         float: right;
 130         border-radius: 7px;
 131         -moz-border-radius: 7px;
 132         -webkit-border-radius: 7px;
 133 }
 134
 135 /* Extra - replace defaults */
 136 div.anythingSlider-minimalist-round {
 137         padding: 0 30px;
 138 }
 139
 140 /* text indent moved to span inside "a", for IE7; apparently, a negative text-indent on an "a" link moves the link as well as the text */
 141 div.anythingSlider-minimalist-round .arrow a span, div.anythingSlider-minimalist-round .anythingControls ul a span, div.anythingSlider-minimalist-round .start-stop span {
 142         display: block;
 143         line-height: 1px; /* needed for IE7 */
 144         text-indent: -9999px;
 145 }