/**
* CSS themes for simplePagination.js
* Author: Flavius Matis - http://flaviusmatis.github.com/
* URL: https://github.com/flaviusmatis/simplePagination.js
*/

ul.simple-pagination {list-style: none;}
.simple-pagination {display: block;overflow: hidden;padding: 0 5px 5px 0;margin: 0;}
.simple-pagination ul {list-style: none;padding: 0;margin: 0;display:flex;}
.simple-pagination.right-side ul{justify-content: flex-end;}
.simple-pagination li {list-style: none;padding: 0;margin: 0;}
.simple-pagination li.disabled{opacity: 0.8;display:none;}
span.ellipse.clickable {cursor: pointer;}
.ellipse input {width: 3em;}

/*------------------------------------*\
	Compact Theme Styles
\*------------------------------------*/

.compact-theme a, .compact-theme span {float: left;color: #333;font-size:14px;line-height:24px;font-weight: normal;text-align: center;border: 1px solid #AAA;border-left: none;min-width: 14px;padding: 0 7px;	box-shadow: 2px 2px 2px rgba(0,0,0,0.2);	background: #efefef; }
.compact-theme a:hover {text-decoration: none;background: #efefef; }
.compact-theme li:first-child a, .compact-theme li:first-child span {border-left: 1px solid #AAA;border-radius: 3px 0 0 3px;}
.compact-theme li:last-child a, .compact-theme li:last-child span {border-radius: 0 3px 3px 0;}
.compact-theme .current {background: #bbbbbb; cursor: default;}
.compact-theme .ellipse {background: #EAEAEA;padding: 0 10px;cursor: default;}

/*------------------------------------*\
	Light Theme Styles
\*------------------------------------*/

.light-theme a, 
.light-theme span{display: flex;justify-content: center;align-items: center;min-width:32px;min-height:32px;	margin:0;padding: 0 7px;color: #7a7684;font-size:14px;line-height:24px;font-weight: normal;text-align: center;border: 1px solid #e0e0e0;box-shadow: 0 1px 2px rgba(0,0,0,0.2);background: #FFF; }
.light-theme li:not(:last-child) a, 
.light-theme li:not(:last-child) span{border-right:0;}
.light-theme a:hover {text-decoration:none;color: #000;background:#E0DDDD;}
.light-theme .current:not(.prev):not(.next) {color: #FFF;border-color:#000;background:#000;cursor: default;}
.light-theme .ellipse { font-weight: bold;border-radius: 0;border: none;background: none;box-shadow: none;cursor: default;}

/*------------------------------------*\
	Dark Theme Styles
\*------------------------------------*/

.dark-theme a, .dark-theme span {float: left;color: #CCC;font-size:14px;line-height:24px;font-weight: normal;text-align: center;border: 1px solid #222;min-width: 14px;padding: 0 7px;margin: 0 5px 0 0;border-radius: 3px;	box-shadow: 0 1px 2px rgba(0,0,0,0.2);	background: #555;}
.dark-theme a:hover {text-decoration: none;background: #444;}
.dark-theme .current {background: #222;color: #FFF;border-color: #000;box-shadow: 0 1px 0 rgba(255,255,255,0.2), 0 0 1px 1px rgba(0, 0, 0, 0.1) inset;cursor: default;}
.dark-theme .ellipse {background: none;border: none;border-radius: 0;box-shadow: none;font-weight: bold;cursor: default;}