/
jcider.css
84 lines (76 loc) · 1.83 KB
/
jcider.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
/*
* jCider v3.0.8 (https://pratinav.github.io/jCider/)
* (c) 2015 Pratinav Bagla (https://www.pratinavbagla.com/)
* Released under the MIT License (https://github.com/pratinav/jCider/blob/master/LICENSE.txt)
**/
@charset "UTF-8";
/*Default Font icons*/
@import url(https://fontastic.s3.amazonaws.com/CoBsvmhLG8dQosPCdCFvBM/icons.css);
/*Positioning and styling for navigation controls.*/
/*Change at your will.*/
/*Parent container for navigation arrows*/
.jcider-nav {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 4;
width: 100%;
color: white;
font-size: 30px;
}
/*Both right and left nav arrows*/
.jcider-nav span {
text-align: center;
cursor: pointer;
position: absolute;
font-size: 50px;
color: white;
transition: all 300ms;
line-height: 1;
}
.jcider-nav span.disabled {
pointer-events: none;
color: rgba(255,255,255,0.2);
}
/*Left nav arrow*/
.jcider-nav .jcider-nav-left {
left: 5px;
}
/*Right nav arrow*/
.jcider-nav .jcider-nav-right {
right: 5px;
}
/*Pagination container can be styled by '.jcider-pagination'*/
.jcider-pagination {
text-align: center;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
/*Styling for pagination points*/
.jcider-pagination-point {
position: relative;
background: none;
border-radius: 50%;
margin: 8px;
display: inline-block;
width: 8px;
height: 8px;
cursor: pointer;
background: rgba(255,255,255,0.5);
transition: all 300ms;
}
/*Styling for active pagination point*/
.jcider-pagination-point.active {
background: white;
-webkit-transform: scale(1.5);
-moz-transform: scale(1.5);
-ms-transform: scale(1.5);
-o-transform: scale(1.5);
transform: scale(1.5);
}