/* ########################################## */
/* ############ ONE PAGE TOOLKIT ############ */
/* ###### SCROLL INDICATORS GADGET CSS ###### */
/*   Do not edit this file! It will not be    */
/* used after saving in OnePageToolkit Admin. */
/* ########################################## */

ul.OPTK-scrollIndicators {
display:block;
list-style:none;
position:fixed; 
white-space:nowrap; 
text-align:center;
vertical-align:middle;
margin:0;
background:rgba(127,127,127,0.5);
border-radius:4em;
z-index:5001;
letter-spacing:-0.25em;
line-height:0.75em;
top:50%; 
left:1em; 
-webkit-transform:translateY(-50%);
-moz-transform:translateY(-50%);
-ms-transform:translateY(-50%);
transform:translateY(-50%);
padding:0.5em 0em; 
}

ul.OPTK-scrollIndicators li {
position:relative;
background:rgba(0,0,0,0);
text-align:center;
color:rgba(0,0,0,0.6);
padding:0;
border-radius:3em;
font-size:1em;
display:block; margin:-0.5em auto; 
}

ul.OPTK-scrollIndicators li a,
ul.OPTK-scrollIndicators li span.OPTK-scrollCounter-wrapper {
display:block;
position:relative;
overflow:hidden;
white-space:nowrap;
height:2em;
min-width:2em;
text-decoration:none;
color:rgba(0,0,0,0.6);
line-height:2em;
font-size:inherit;
padding:0 0.5em;
outline:none;
letter-spacing:0;
}

ul.OPTK-scrollIndicators li:hover,
ul.OPTK-scrollIndicators li.OPTK-scrollIndicator-isActive {
background:rgba(0,0,0,0);
text-decoration:none;
}
ul.OPTK-scrollIndicators li:hover,
ul.OPTK-scrollIndicators li.OPTK-scrollIndicator-isActive,
ul.OPTK-scrollIndicators li:hover a,
ul.OPTK-scrollIndicators li.OPTK-scrollIndicator-isActive a {
color:rgba(255,255,255,0.6);
}

ul.OPTK-scrollIndicators li.OPTK-buttonDisabled {
background:rgba(0,0,0,0);
}
ul.OPTK-scrollIndicators li.OPTK-buttonDisabled,
ul.OPTK-scrollIndicators li.OPTK-buttonDisabled a {
color:rgba(0,0,0,0.4);
}
ul.OPTK-scrollIndicators li.OPTK-buttonDisabled a {
cursor:default;
}

ul.OPTK-scrollIndicators li.OPTK-scrollIndicator a {
width:2em;
text-indent:999em; 
padding:0;
}

ul.OPTK-scrollIndicators li.OPTK-scrollIndicator a:before {
content:"";
display:block;
position:absolute;
top:50%;
left:50%;
width:0.6em;
height:0.6em;
margin:-0.3em 0 0 -0.3em;
letter-spacing:0;
background:rgba(0,0,0,0.6);
border-radius:50%;
}
ul.OPTK-scrollIndicators li.OPTK-scrollIndicator:hover a:before,
ul.OPTK-scrollIndicators li.OPTK-scrollIndicator.OPTK-scrollIndicator-isActive a:before {
background:rgba(255,255,255,0.6);
}
ul.OPTK-scrollIndicators li.OPTK-scrollIndicator.OPTK-scrollIndicator-buttonDisabled a:before {
background:rgba(0,0,0,0.4);
}
ul.OPTK-scrollIndicators li.OPTK-scrollFirst,
ul.OPTK-scrollIndicators li.OPTK-scrollFirst + br,
ul.OPTK-scrollIndicators li.OPTK-scrollLast,
ul.OPTK-scrollIndicators li.OPTK-scrollLast + br {
display:none;
}

ul.OPTK-scrollIndicators li.OPTK-scrollFirst a,
ul.OPTK-scrollIndicators li.OPTK-scrollLast a,
ul.OPTK-scrollIndicators li.OPTK-scrollPrev a,
ul.OPTK-scrollIndicators li.OPTK-scrollNext a {
width:2em;
padding:0;
}

ul.OPTK-scrollIndicators li.OPTK-scrollFirst a:before { content:"\e840"; }
ul.OPTK-scrollIndicators li.OPTK-scrollPrev  a:before { content:"\e820"; }
ul.OPTK-scrollIndicators li.OPTK-scrollNext  a:before { content:"\e822"; }
ul.OPTK-scrollIndicators li.OPTK-scrollLast  a:before { content:"\e842"; }

ul.OPTK-scrollIndicators li.OPTK-scrollFirst a:before,
ul.OPTK-scrollIndicators li.OPTK-scrollLast  a:before,
ul.OPTK-scrollIndicators li.OPTK-scrollPrev  a:before,
ul.OPTK-scrollIndicators li.OPTK-scrollNext  a:before {
font-family:arrowtic!important;
}

ul.OPTK-scrollIndicators span.OPTK-scrollCounter-of {
margin:0;
}

ul.OPTK-scrollIndicators span.OPTK-scrollCounter-of:before {
content:" / ";
white-space:pre;
}

ul.OPTK-scrollIndicators li.OPTK-scrollCounter,
ul.OPTK-scrollIndicators li.OPTK-scrollCounter + br {
display:none;
}