

span.sprite {
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	    
    display:inline;

}

button>span, button:disabled:hover>span {
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	    
    background-size: contain;
    background-color: transparent;
    background-repeat: no-repeat;
}

button.searchbutton>span, button.searchbutton:disabled:hover>span {
    position:absolute;
    left:0px;
    top:4px;
    left:4px;
    width:16px;
    height:16px;	    
    background-size: contain;
    background-color: transparent;
    background-repeat: no-repeat;
}


button span.signup, button:disabled:hover span.signup {    
    background-image: url(../img/buttons/signup.png);    
}

button {
    outline: none;
    border-radius: 3px;
}
button:hover span.signup {    
    background-image:url(../img/buttons/signup_hot.png);    
    
}

div.dialog-buttons div.left button {
    margin-right: 5px;
}
div.dialog-buttons div.right button {
    margin-left: 5px;
}
/*
table.showclients div.left button {
    margin-right: 0px;
}
table.showclients div.right button {
    margin-left: 0px;
}
*/
button span.edit, button:disabled:hover span.edit {
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	

    background: transparent url(../img/buttons/edit.png) no-repeat;
    background-size: contain;
}

button:hover span.edit {

    background: transparent url(../img/buttons/edit_hot.png) no-repeat;
    background-size: contain;
}

button span.expander, button:disabled:hover span.expander {
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	

    background: transparent url(../img/buttons/arrow-down.png) no-repeat;
    background-size: contain;
}

button:hover span.expander {

    background: transparent url(../img/buttons/arrow-down_hot.png) no-repeat;
    background-size: contain;
}

button span.down, button:disabled:hover span.down{
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	

    background: transparent url(../img/buttons/arrow-down.png) no-repeat;
    background-size: contain;
}

button:hover span.down {    
    background: transparent url(../img/buttons/arrow-down_hot.png) no-repeat;
    background-size: contain;
}

button span.up, button:disabled:hover span.up{
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	

    background: transparent url(../img/buttons/arrow-up.png) no-repeat;
    background-size: contain;
}

button:hover span.up{    
    background: transparent url(../img/buttons/arrow-up_hot.png) no-repeat;
    background-size: contain;
}

button span.add, button:disabled:hover span.add {
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	

    background: transparent url(../img/buttons/add.png) no-repeat;
    background-size: contain;
}
button:hover span.add {  
    background: transparent url(../img/buttons/add_hot.png) no-repeat;
    background-size: contain;
}


button span.backtolist, button:disabled:hover span.backtolist {
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	
    background: transparent url(../img/buttons/back-to-list.png) no-repeat;
    background-size: contain;
}

button:hover span.backtolist {
    background: transparent url(../img/buttons/back-to-list_hot.png) no-repeat;
    background-size: contain;
}

button span.prev, button:disabled:hover span.prev {
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	
    background: transparent url(../img/buttons/back-to-list.png) no-repeat;
    background-size: contain;
}

button:hover span.prev {
    background: transparent url(../img/buttons/back-to-list_hot.png) no-repeat;
    background-size: contain;
}


button span.stop, button:disabled:hover span.stop{
    position:absolute;
    left:0px;
    top:6px;
    left:5px;
    width:20px;
    height:20px;	
    background: transparent url(../img/buttons/stop.png) no-repeat;
    background-size: contain;
}
button:hover span.stop {
    background: transparent url(../img/buttons/stop_hot.png) no-repeat;
    background-size: contain;
}

button span.save, button:disabled:hover span.save {
    background-image: url(../img/buttons/save.png);    
}
button:hover span.save {  
    background-image:url(../img/buttons/save_hot.png);    
}


button span.next, button:disabled:hover span.next{    
    background-image:url(../img/buttons/next.png) ;

}

button:hover span.next {
    background-image: url(../img/buttons/next_hot.png);    
}


button span.view, button:disabled:hover span.view{    
    background-image: url(../img/buttons/view.png);    
}

button:hover span.view {
    background-image: url(../img/buttons/view_hot.png) ;
}

button span.play, button:disabled:hover span.play{    
    background-image: url(../img/buttons/play.png) ;   
}

button:hover span.play {
    background-image: url(../img/buttons/play_hot.png);    
}

button span.search, button:disabled:hover span.search {
    background-image: url(../img/buttons/search.png); 
}
button:hover span.search {  
    background-image: url(../img/buttons/search_hot.png);    
}
button.searchbutton span.search, button:disabled:hover span.search {
    background-image: url(../img/buttons/search.png); 	
}
button.searchbutton:hover span.search {  
    background-image: url(../img/buttons/search_hot.png);    
}

button span.delete, button:disabled:hover span.delete{
    background-image: url(../img/buttons/stop.png) ;   
}
button:hover span.delete {
    background-image: url(../img/buttons/stop_hot.png);    
}

button span.download, button:disabled:hover span.download{    
    background-image: url(../img/buttons/download.png);    
}
button:hover span.download {
    background-image: url(../img/buttons/download_hot.png);
}

button span.calendar, button:disabled:hover span.calendar {    
    background-image: url(../img/buttons/calendar_small.png) ;    
}

button:hover span.calendar {    
    background-image: url(../img/buttons/calendar_small_hot.png);    
}

button span.today, button:disabled:hover span.today{
    background-image: url(../img/buttons/btn_today.png);    
}

button:hover span.today{    
    background-image: url(../img/buttons/btn_today_hot.png);    
}
button span.list, button:disabled:hover span.list{    
    background-image: url(../img/buttons/btn_list.png);    
}

button:hover span.list{    
    background-image:url(../img/buttons/btn_list_hot.png);    
}
button.active {
    background-color: white;
}
button.active span.list{    
    background-image: url(../img/buttons/btn_list_hot.png);    
}

button span.enlarge, button:disabled:hover span.enlarge{
    background-image: url(../img/buttons/btn_wide.png); 
}
button:hover span.enlarge{    
    background-image: url(../img/buttons/btn_wide_hot.png);   
}

button span.shrink, button:disabled:hover span.shrink{    
    background-image: url(../img/buttons/btn_small.png);    
}
button:hover span.shrink{    
    background-image:url(../img/buttons/btn_small_hot2.png);;    
}

button span.list_selectall, button:disabled:hover span.list_selectall{
    background-image: url(../img/buttons/btn_check.png);
}
button:hover span.list_selectall{    
    background-image: url(../img/buttons/btn_check_hot.png);
}

button span.list_deselectall, button:disabled:hover span.list_deselectall{
    background-image: url(../img/buttons/stop.png);
}
button:hover span.list_deselectall{    
    background-image: url(../img/buttons/stop_hot.png);
}

button span.list_deselectall_lists, button:disabled:hover span.list_deselectall_lists{
    background-image: url(../img/buttons/btn_deselect_all.png);
}
button:hover span.list_deselectall_lists{    
    background-image: url(../img/buttons/btn_deselect_all_hot.png);
}



button span.list_additems, button:disabled:hover span.list_additems{
    background-image: url(../img/buttons/btn_plus.png);
}

button:hover span.list_additems{    
    background-image: url(../img/buttons/btn_plus_hot.png);
}

button span.list_deleteitems, button:disabled:hover span.list_deleteitems{
    background-image: url(../img/buttons/btn_min.png);
}

button:hover span.list_deleteitems{    
    background-image: url(../img/buttons/btn_min_hot.png);
}

button span.swap, button:disabled:hover span.swap{
    background-image: url(../img/buttons/swap.png);
}

button:hover span.swap{    
    background-image: url(../img/buttons/swap_hot.png);
}


span.es_icon {
    position:absolute;
    width:20px;
    height:20px;    
    top:6px;
    background-size: contain;
    background-color: transparent;
    background-repeat: no-repeat;
}

span.es_search {
    background-image: url(../img/buttons/search.png);
}

button.ui-multiselect>span{
    position:initial;
}

button.check_all_button {
    width:100%;
    height:auto;
    padding:3px 10px;
    font-size:10px;
}

table.grid.tablet td button.check_all_button {
    width:100%;
    height:50px;
    padding:3px 10px;
    font-size:10px;
}

button.glyphiconbutton {    
    position:relative;
    width:34px;
    height:34px;
    /*padding:10px;   
    padding-left:9px;*/
    text-align: left;
    display:inline-block;    
    overflow: hidden;
    padding-left: 0px;
}

button.glyphiconbutton.center {
    text-align: center;
}

button.glyphiconbutton span.flaticon:before {    
    position:absolute;
    left: 0px;
    top: 0px;
    font-size:20px;
}


/*
button.glyphiconbutton {
    padding-top:0px;
    padding-bottom:0px;
    padding: 0;
    height: 34px;
    display: inline-block;
    line-height: 10px;
}
*/


button.glyphiconbutton span.glyphicon {
    margin-right:0px;
    font-size:18px;
    
}
button.glyphiconbuttonsmall {    
    width:23px;
    height:25px;
    padding:0px;    
    text-align:center;
    display:inline-block;    
}
button.glyphiconbuttonsmall>span {    
    left:1px;
}
button.glyphiconbutton.red {
    background-color: #FF0000;
    border:1px solid #FF0000;
}

button.glyphiconbutton.red:hover {
    background-color: white;
    color: #FF0000;
}

button.glyphiconbutton span.glyphicon {    
    position:absolute;
    font-size:18px;
    top:7px;
}

button.glyphiconbutton span.uicon {    
    position:absolute;
    font-size:18px;
    top:7px;
    left: 6px;
}

button.smallbutton {

    height:25px;
    width:25px;
    margin:0;
    padding:0;
    float:none;
    border:none;
    background-color: transparent;
    outline: none;
}


button.smallbutton span.add, button.smallbutton:disabled:hover span.add {
    position:absolute;
    left:2px;
    top:3px;    
    width:20px;
    height:20px;	

    background: transparent url(../img/buttons/add_hot.png) no-repeat;
    opacity: 0.8;
    background-size: contain;
}
button.smallbutton:hover span.add {  
    opacity: 1.0;
    /*background: transparent url(../img/buttons/add.png) no-repeat;
    background-size: contain;*/
}


button.navbutton,
button.submit_button,
button.glyphiconbuttontext {    

    height:34px;
    padding:10px;   
    padding-left:8px;
    padding-left:33px;
    display:inline-block;    
    line-height:10px;
    
}

button.navbutton.table_button {
    padding-left: 10px;
}

button > span.glyphicon,
button.submit_button > span.glyphicon,
button.navbutton > span.glyphicon,
button.glyphiconbuttontext > span.glyphicon {
    position:absolute;
    margin-right:10px;
    font-size:20px;
    top:6px;
    font-weight: lighter;
}

button > span.flaticon:before {    
    font-size:16px;    
}


button.glyphiconbuttontext.red {
    background-color: #FF0000;
    border:1px solid #FF0000;
    color: white;
}
button.glyphiconbuttontext.red:hover {
    background-color: white;
    border:1px solid #FF0000;
    color: red;
}
button.glyphiconbuttontext.red:disabled {
    background-color: #CCC;
    border-color: #CCC;
}
button.glyphiconbuttontext.red:disabled:hover {
    color: white;
    background-color: #CCC;
    border-color: #CCC;
}

button.glyphiconbuttontext.softred {
    background-color: #FFAAAA;
    border:1px solid #FFAAAA;
    color: white;
}
button.glyphiconbuttontext.softred:hover {
    background-color: white;
    border:1px solid #FFAAAA;
    color: red;
}
button.glyphiconbuttontext.softred:disabled {
    background-color: #CCC;
    border-color: #CCC;
}
button.glyphiconbuttontext.softred:disabled:hover {
    color: white;
    background-color: #CCC;
    border-color: #CCC;
}


button.navigate_button {
    height:25px;
    position:relative;
    margin:0;
    padding:0;	
    line-height:25px;
    border-radius: 8px;	
    vertical-align: middle;
    padding: 0px 0px;
    width:100%;
}

button.navigate_button span.glyphicon {
    position:absolute;
    font-size:16px;
    top:4px;
}
button.navigate_button.image_left {
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
    border-right-color: #2288BB;
}
button.navigate_button.image_right {
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
    border-left-color: #44AADD;
}
button.navigate_button.image_left span.glyphicon {
    left:5px;
}
button.navigate_button.image_right>span.glyphicon {
    left:initial;
    right:5px;
}

button.navbutton.image_right {
    padding-left: 10px;
    padding-right: 33px;
}
button.navbutton.image_right>span.glyphicon {
    left:initial;
    right:5px;
    margin-right: 0px;
}


button, input[type=submit], input[type=button] {    
    background-color:var(--button-background-color);
    border-color: var(--button-border-color);
    color: var(--button-text-color);
}
button:hover {    
    background-color: white;        
    color: var(--accent-text-color);
}
button.icon { 
    padding-left: 40px;
}
button.red {
    background-color: #ff7979;
    border-color: #ff7979;
}
button.red:hover {    
    background-color: white;        
    color : #ff7979;
}
button.red:disabled:hover,
button.red:disabled {
    background-color: #CCC;
    border-color: #CCC;
    color: white;
}

button.green {
    background-color: #4DDD90;
    border-color: #4DDD90;
}
button.green:hover {    
    background-color: white;        
    color : #4DDD90;
}
button.green:disabled:hover,
button.green:disabled {
    background-color: #CCC;
    border-color: #CCC;
    color: white;
}


button.grey {
    background-color: #CCC;
    border-color: #CCC;
    color: white;
}
button.grey:hover {    
    background-color: #CCC;
    border-color: #CCC;
    color: white;
}
button.grey:disabled:hover,
button.grey:disabled {
    background-color: #CCC;
    border-color: #CCC;
    color: white;
}



h1 div.title-buttons button.current {
    background-color: #44AADD;
    color: white;
}

button.filter-button {
    height: 25px;
}

button.fl-left {
    float:left;
    margin-right: 5px;
}
button.fl-right {
    float:right;
    margin-left: 5px;
}


button.noimage { 
    padding-left: 8px;
}


div.upload-image-button {    
    border: 1px solid var(--button-border-color);
    display: inline-block;
    padding: 5px 10px;
    background-color: var(--button-background-color);
    color: white;    
    cursor: pointer;    
}
div.upload-image-button:hover {
    background-color: white;
    color: var(--accent-text-color);
}



span.upload-image-button {    
    width: 30px;
    height: 30px;
    line-height: 30px;    
    background-color: var(--button-background-color);
    color: white;
    border-radius: 50%;
    text-align: center;
    border: 1px solid var(--button-border-color);
    cursor: pointer;
}
span.upload-image-button:hover {
    background-color: white;
    color: var(--accent-text-color);
}
span.upload-image-button.disabled {
    background-color: #DDD;
    border-color: #DDD;
    cursor: default;
    color: white;
}

span.upload-image-button.disabled:hover {
    background-color: #DDD;
    border-color: #DDD;    
    color: white;
    cursor: default;
}


span.upload-image-button span.flaticon:before {
    margin: 0;
    font-size: 15px;
}

div.btn-select-file {
    display: inline-block;
    border: 1px solid var(--button-border-color);
    background-color: var(--button-background-color);
    padding: 5px 10px;
    color: white;
    height:34px;
    line-height:20px;
    cursor: pointer;
}

div.btn-select-file:hover {
    background-color: white;
    color: var(--accent-text-color);
}


div.button {
    display: inline-block;
    position:relative;
    border: 1px solid var(--button-border-color);
    background-color: var(--button-background-color);
    padding: 5px 10px;
    color: white;
    height:34px;
    line-height:20px;
    cursor: pointer;
}

div.button:hover {
    background-color: white;
    color: var(--accent-text-color);
}

div.button.icon {
    padding-left: 34px;
}
div.button.icon span.glyphicon {
    position:absolute;
    left: 7px;
    top: 5px;
    font-size: 20px;
}

div.button.iconbutton {
    padding-left: 5px;
    width: 34px;
}


button.glyphiconbutton span.plus-one {
    position:absolute;
    border: 1px solid white;
    border-radius: 50%;
    width: 15px;
    height: 15px;    
    top: 15px;
    left: 16px;
    line-height: 14px;
    font-size: 10px;
    background-color: var(--button-background-color);
    text-align: center;
}
button.glyphiconbutton:hover span.plus-one {
    color: white;
}

button.glyphiconbuttonsmall span.glyphicon  {
    display:inline;
    font-size:inherit;
}
button#btn-set-vacination-status[status='0'] {
    background-color: #DDD;
    border-color: #CCC;
}
button#btn-set-vacination-status[status='0']:hover {
    color: white;
    background-color: #CCC;
}

span.table-button {
    background-color: var(--button-background-color);
    color: white;
    border-radius: 3px;
    padding: 0.25rem;
    cursor: pointer;
    border: 1px solid var(--button-border-color);
    font-size: 10px;
}
span.table-button:hover {
    background-color: white;
    color: var(--accent-text-color);
}


a.button {
    display: inline-block;
    color: white;
    font-size: 16px;
    position:relative;
    padding:10px;
    border:1px solid #38BCE8;
    background-color:#38BCE8;
    color: white;
    padding-left:30px;
	
    line-height:14px;
    vertical-align:middle;
    text-decoration: none;
        border-radius: 3px;
}
a.button:hover {
    background-color: white;
    color: #38BCE8;
    cursor:pointer;
}

a.button.noimage {
    padding-left: 10px;
}
