Projet

Général

Profil

Paste
Télécharger (6,68 ko) Statistiques
| Branche: | Révision:

root / drupal7 / sites / all / libraries / flexslider-2.5.0 / flexslider.css @ 639c8fcb

1 
/*
2 
 * jQuery FlexSlider v2.5.0
3 
 * http://www.woothemes.com/flexslider/
4 
 *
5 
 * Copyright 2012 WooThemes
6 
 * Free to use under the GPLv2 and later license.
7 
 * http://www.gnu.org/licenses/gpl-2.0.html
8 
 *
9 
 * Contributing author: Tyler Smith (@mbmufffin)
10 
 *
11 
 */
12 
/* ====================================================================================================================
13 
 * FONT-FACE
14 
 * ====================================================================================================================*/
15 
@font-face {
16 
  font-family: 'flexslider-icon';
17 
  src: url('fonts/flexslider-icon.eot');
18 
  src: url('fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'), url('fonts/flexslider-icon.woff') format('woff'), url('fonts/flexslider-icon.ttf') format('truetype'), url('fonts/flexslider-icon.svg#flexslider-icon') format('svg');
19 
  font-weight: normal;
20 
  font-style: normal;
21 
}
22 
/* ====================================================================================================================
23 
 * RESETS
24 
 * ====================================================================================================================*/
25 
.flex-container a:hover,
26 
.flex-slider a:hover,
27 
.flex-container a:focus,
28 
.flex-slider a:focus {
29 
  outline: none;
30 
}
31 
.slides,
32 
.slides > li,
33 
.flex-control-nav,
34 
.flex-direction-nav {
35 
  margin: 0;
36 
  padding: 0;
37 
  list-style: none;
38 
}
39 
.flex-pauseplay span {
40 
  text-transform: capitalize;
41 
}
42 
/* ====================================================================================================================
43 
 * BASE STYLES
44 
 * ====================================================================================================================*/
45 
.flexslider {
46 
  margin: 0;
47 
  padding: 0;
48 
}
49 
.flexslider .slides > li {
50 
  display: none;
51 
  -webkit-backface-visibility: hidden;
52 
}
53 
.flexslider .slides img {
54 
  width: 100%;
55 
  display: block;
56 
}
57 
.flexslider .slides:after {
58 
  content: "\0020";
59 
  display: block;
60 
  clear: both;
61 
  visibility: hidden;
62 
  line-height: 0;
63 
  height: 0;
64 
}
65 
html[xmlns] .flexslider .slides {
66 
  display: block;
67 
}
68 
* html .flexslider .slides {
69 
  height: 1%;
70 
}
71 
.no-js .flexslider .slides > li:first-child {
72 
  display: block;
73 
}
74 
/* ====================================================================================================================
75 
 * DEFAULT THEME
76 
 * ====================================================================================================================*/
77 
.flexslider {
78 
  margin: 0 0 60px;
79 
  background: #ffffff;
80 
  border: 4px solid #ffffff;
81 
  position: relative;
82 
  zoom: 1;
83 
  -webkit-border-radius: 4px;
84 
  -moz-border-radius: 4px;
85 
  border-radius: 4px;
86 
  -webkit-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
87 
  -moz-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
88 
  -o-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
89 
  box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
90 
}
91 
.flexslider .slides {
92 
  zoom: 1;
93 
}
94 
.flexslider .slides img {
95 
  height: auto;
96 
}
97 
.flex-viewport {
98 
  max-height: 2000px;
99 
  -webkit-transition: all 1s ease;
100 
  -moz-transition: all 1s ease;
101 
  -ms-transition: all 1s ease;
102 
  -o-transition: all 1s ease;
103 
  transition: all 1s ease;
104 
}
105 
.loading .flex-viewport {
106 
  max-height: 300px;
107 
}
108 
.carousel li {
109 
  margin-right: 5px;
110 
}
111 
.flex-direction-nav {
112 
  *height: 0;
113 
}
114 
.flex-direction-nav a {
115 
  text-decoration: none;
116 
  display: block;
117 
  width: 40px;
118 
  height: 40px;
119 
  margin: -20px 0 0;
120 
  position: absolute;
121 
  top: 50%;
122 
  z-index: 10;
123 
  overflow: hidden;
124 
  opacity: 0;
125 
  cursor: pointer;
126 
  color: rgba(0, 0, 0, 0.8);
127 
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
128 
  -webkit-transition: all 0.3s ease-in-out;
129 
  -moz-transition: all 0.3s ease-in-out;
130 
  -ms-transition: all 0.3s ease-in-out;
131 
  -o-transition: all 0.3s ease-in-out;
132 
  transition: all 0.3s ease-in-out;
133 
}
134 
.flex-direction-nav a:before {
135 
  font-family: "flexslider-icon";
136 
  font-size: 40px;
137 
  display: inline-block;
138 
  content: '\f001';
139 
  color: rgba(0, 0, 0, 0.8);
140 
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
141 
}
142 
.flex-direction-nav a.flex-next:before {
143 
  content: '\f002';
144 
}
145 
.flex-direction-nav .flex-prev {
146 
  left: -50px;
147 
}
148 
.flex-direction-nav .flex-next {
149 
  right: -50px;
150 
  text-align: right;
151 
}
152 
.flexslider:hover .flex-direction-nav .flex-prev {
153 
  opacity: 0.7;
154 
  left: 10px;
155 
}
156 
.flexslider:hover .flex-direction-nav .flex-prev:hover {
157 
  opacity: 1;
158 
}
159 
.flexslider:hover .flex-direction-nav .flex-next {
160 
  opacity: 0.7;
161 
  right: 10px;
162 
}
163 
.flexslider:hover .flex-direction-nav .flex-next:hover {
164 
  opacity: 1;
165 
}
166 
.flex-direction-nav .flex-disabled {
167 
  opacity: 0!important;
168 
  filter: alpha(opacity=0);
169 
  cursor: default;
170 
}
171 
.flex-pauseplay a {
172 
  display: block;
173 
  width: 20px;
174 
  height: 20px;
175 
  position: absolute;
176 
  bottom: 5px;
177 
  left: 10px;
178 
  opacity: 0.8;
179 
  z-index: 10;
180 
  overflow: hidden;
181 
  cursor: pointer;
182 
  color: #000;
183 
}
184 
.flex-pauseplay a:before {
185 
  font-family: "flexslider-icon";
186 
  font-size: 20px;
187 
  display: inline-block;
188 
  content: '\f004';
189 
}
190 
.flex-pauseplay a:hover {
191 
  opacity: 1;
192 
}
193 
.flex-pauseplay a.flex-play:before {
194 
  content: '\f003';
195 
}
196 
.flex-control-nav {
197 
  width: 100%;
198 
  position: absolute;
199 
  bottom: -40px;
200 
  text-align: center;
201 
}
202 
.flex-control-nav li {
203 
  margin: 0 6px;
204 
  display: inline-block;
205 
  zoom: 1;
206 
  *display: inline;
207 
}
208 
.flex-control-paging li a {
209 
  width: 11px;
210 
  height: 11px;
211 
  display: block;
212 
  background: #666;
213 
  background: rgba(0, 0, 0, 0.5);
214 
  cursor: pointer;
215 
  text-indent: -9999px;
216 
  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
217 
  -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
218 
  -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
219 
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
220 
  -webkit-border-radius: 20px;
221 
  -moz-border-radius: 20px;
222 
  border-radius: 20px;
223 
}
224 
.flex-control-paging li a:hover {
225 
  background: #333;
226 
  background: rgba(0, 0, 0, 0.7);
227 
}
228 
.flex-control-paging li a.flex-active {
229 
  background: #000;
230 
  background: rgba(0, 0, 0, 0.9);
231 
  cursor: default;
232 
}
233 
.flex-control-thumbs {
234 
  margin: 5px 0 0;
235 
  position: static;
236 
  overflow: hidden;
237 
}
238 
.flex-control-thumbs li {
239 
  width: 25%;
240 
  float: left;
241 
  margin: 0;
242 
}
243 
.flex-control-thumbs img {
244 
  width: 100%;
245 
  height: auto;
246 
  display: block;
247 
  opacity: .7;
248 
  cursor: pointer;
249 
  -webkit-transition: all 1s ease;
250 
  -moz-transition: all 1s ease;
251 
  -ms-transition: all 1s ease;
252 
  -o-transition: all 1s ease;
253 
  transition: all 1s ease;
254 
}
255 
.flex-control-thumbs img:hover {
256 
  opacity: 1;
257 
}
258 
.flex-control-thumbs .flex-active {
259 
  opacity: 1;
260 
  cursor: default;
261 
}
262 
/* ====================================================================================================================
263 
 * RESPONSIVE
264 
 * ====================================================================================================================*/
265 
@media screen and (max-width: 860px) {
266 
  .flex-direction-nav .flex-prev {
267 
    opacity: 1;
268 
    left: 10px;
269 
  }
270 
  .flex-direction-nav .flex-next {
271 
    opacity: 1;
272 
    right: 10px;
273 
  }
274 
}