/*
************************************************************************************************************************************
************************************************************************************************************************************
   ###     ######  ######## ####  #######  ##    ## ##     ## #### ######## ##      ## 
  ## ##   ##    ##    ##     ##  ##     ## ###   ## ##     ##  ##  ##       ##  ##  ## 
 ##   ##  ##          ##     ##  ##     ## ####  ## ##     ##  ##  ##       ##  ##  ## 
##     ## ##          ##     ##  ##     ## ## ## ## ##     ##  ##  ######   ##  ##  ## 
######### ##          ##     ##  ##     ## ##  ####  ##   ##   ##  ##       ##  ##  ## 
##     ## ##    ##    ##     ##  ##     ## ##   ###   ## ##    ##  ##       ##  ##  ## 
##     ##  ######     ##    ####  #######  ##    ##    ###    #### ########  ###  ###  
************************************************************************************************************************************
************************************************************************************************************************************
*/
.actionview{
    outline: none;
    overflow: visible;
    padding: 0;
}
/***********************************************************************************************************************************/
/* STICKY **************************************************************************************************************************/
/***********************************************************************************************************************************/

.actionview-ui-btn-add{
    position: fixed;
    bottom: 10%;
    right: 5%;
    z-index: 100;
}
.actionview-ui-btn-add--left{
    position: fixed;
    bottom: 10%;
    left: 5%;
    z-index: 100;
}
.actionview-ui-btn-add,
.actionview-ui-btn-add--left{
     filter: drop-shadow(0px 2px 10px rgba(0, 0, 0, 0.3));
}

/***********************************************************************************************************************************/
/* CONTAINER ***********************************************************************************************************************/
/***********************************************************************************************************************************/

.actionview__wrapper{
	display: block;
	position: relative;
	width: 64px;
    box-sizing: border-box;
}

/***********************************************************************************************************************************/
/* IMAGE ***************************************************************************************************************************/
/***********************************************************************************************************************************/

.actionview:not(.disabled) .actionview__wrapper__image::after{
    border-color: #FDFFF0;
}
.actionview--hascount .actionview__wrapper__image::after{
    border-width: 0 10px 4px 0;
    height: 15px;
    left: 3px;
    top: 5px;
    width: 7px;
}

/* disabled ************************************************************************************************************************/
.actionview.disabled .actionview__wrapper__image::after,
.actionview[disabled] .actionview__wrapper__image::after{
    border-color: #d0d0d0;
}

/***********************************************************************************************************************************/
/* INNER (image or  SVG) ***********************************************************************************************************/
/***********************************************************************************************************************************/

.actionview-inner{
    width: 64px;
    height: 64px;
}
/* actionview-inner img tag ********************************************************************************************************/
.actionview-inner img{
    width: 48px;
    height: 48px;
    margin: 5px 8px 0;
}
/* actionview-inner svg tag *********************************************************************************************************/
.actionview:not(.disabled) .svg,
.actionview:not(.disabled) .content-icon-svg {
    fill: #fff;
}
.actionview.disabled .svg,
.actionview[disabled] .svg,
.actionview.disabled .content-icon-svg,
.actionview[disabled] .content-icon-svg {
    fill: #808080;
}
.actionview .svg{
    display: block;
    margin: 0 auto;
}
.actionview .svg,
.actionview .actionview__wrapper .actionview-inner a.content-icon.content-icon.content-icon,
.actionview .actionview__wrapper .actionview-inner .content-icon-svg {
    width: 32px;
    height: 32px;
}
/* actionview img tag (disabled) ***************************************************************************************************/
.actionview.disabled img,
.actionview[disabled] img{
    -webkit-filter: grayscale(1); /* Webkit */
    filter: grayscale(1); /* W3C */
}
@media all and (-ms-high-contrast:none){ /* IE & Edge */
    .actionview.disabled img,
    .actionview[disabled] img{
        opacity: .5;
    }
}
/* actionview svg background *******************************************************************************************************/
.actionview-inner > .content-icon{
    width: 32px;
    height: 32px;
    display: block;
    margin: 0 auto;
}


/***********************************************************************************************************************************/
/* LABEL ***************************************************************************************************************************/
/***********************************************************************************************************************************/

.actionview__wrapper__label{
    left: -13px; /* 90px - 64px */  
    padding: 0;
}
.actionview__wrapper__label img{
    top: 0;
    position: absolute;
}
.actionview__wrapper__label strong{
    font-weight: bold;
}
/* disabled ************************************************************************************************************************/
.actionview.disabled .actionview__wrapper__label,
.actionview[disabled] .actionview__wrapper__label{
    background: #808080;
}

/***********************************************************************************************************************************/
/* BACKGROUND (SVG) ****************************************************************************************************************/
/***********************************************************************************************************************************/

.actionview__wrapper__svg{
	top: 0;
}
.actionview-path{
    stroke-width: 2px;
    transition: all .15s ease-in-out;
}

/* disabled ************************************************************************************************************************/
.actionview.disabled .actionview-path,
.actionview[disabled] .actionview-path{
    fill: #d0d0d0;
    stroke: #808080;
}

/***********************************************************************************************************************************/
/* COUNT ***************************************************************************************************************************/
/***********************************************************************************************************************************/

.actionview__wrapper__count{
    border-width: 2px;
    box-sizing: border-box;
    font-size: 12px;
    line-height: 20px;
    min-width: 24px;    
    right: 50px;
}

/* disabled ************************************************************************************************************************/
.actionview.disabled .actionview__wrapper__count,
.actionview[disabled] .actionview__wrapper__count{
    background: #d0d0d0;
    border-color: #808080;
}

/***********************************************************************************************************************************/
/* DISABLED ***************************************************************************************************************/
/***********************************************************************************************************************************/
.actionview.ui-disabled, .actionview.ui-state-disabled, button.actionview[disabled], .ui-select .actionview.ui-btn.ui-state-disabled {
    opacity: 1 !important;
    width: auto;
}

/***********************************************************************************************************************************/
/* STATE : HIGHLIGHT ***************************************************************************************************************/
/***********************************************************************************************************************************/

/* normal **************************************************************************************************************************/
.actionview--highlighted:not(.disabled) .actionview__wrapper__label{
    animation: actionViewHighlight 1.5s infinite;
}
/* hover **************************************************************************************************************************/
.actionview--highlighted:not(.disabled):hover .actionview__wrapper__label{
    animation: none;
    box-shadow: 0 2px 7px #fff;
}
/* animation ***********************************************************************************************************************/
@keyframes actionViewHighlight{
    0% {
        box-shadow: none;
    }
    50%{
        box-shadow: 0 2px 7px #fff;
    }
    100% {
        box-shadow: none;
    }
}

/***********************************************************************************************************************************
########  ########  #### ##     ##    ###    ########  ##    ## 
##     ## ##     ##  ##  ###   ###   ## ##   ##     ##  ##  ##  
##     ## ##     ##  ##  #### ####  ##   ##  ##     ##   ####   
########  ########   ##  ## ### ## ##     ## ########     ##    
##        ##   ##    ##  ##     ## ######### ##   ##      ##    
##        ##    ##   ##  ##     ## ##     ## ##    ##     ##    
##        ##     ## #### ##     ## ##     ## ##     ##    ##    
***********************************************************************************************************************************/

.actionview--primary:not(.disabled):hover .actionview__wrapper__image::after,
.actionview--primary:not(.disabled):focus .actionview__wrapper__image::after,
.actionview--primary:not(.disabled):active .actionview__wrapper__image::after{
    border-color: #AD5B50;
}
.actionview--primary:not(.disabled):hover .actionview-path,
.actionview--primary:not(.disabled):focus .actionview-path,
.actionview--primary:not(.disabled):active .actionview-path{
    fill: #AD5B50;
}
.actionview--primary:not(.disabled) .actionview__wrapper__label,
.actionview--primary:not(.disabled) .actionview__wrapper__label strong{
    color: #fff;
}

/***********************************************************************************************************************************
 ######  ########  ######   #######  ##    ## ########     ###    ########  ##    ## 
##    ## ##       ##    ## ##     ## ###   ## ##     ##   ## ##   ##     ##  ##  ##  
##       ##       ##       ##     ## ####  ## ##     ##  ##   ##  ##     ##   ####   
 ######  ######   ##       ##     ## ## ## ## ##     ## ##     ## ########     ##    
      ## ##       ##       ##     ## ##  #### ##     ## ######### ##   ##      ##    
##    ## ##       ##    ## ##     ## ##   ### ##     ## ##     ## ##    ##     ##    
 ######  ########  ######   #######  ##    ## ########  ##     ## ##     ##    ##    
***********************************************************************************************************************************/

.actionview--secondary:not(.disabled):hover .actionview__wrapper__image::after,
.actionview--secondary:not(.disabled):focus .actionview__wrapper__image::after,
.actionview--secondary:not(.disabled):active .actionview__wrapper__image::after{
    border-color: #37659A;
}
.actionview--secondary:not(.disabled):hover .actionview-path,
.actionview--secondary:not(.disabled):focus .actionview-path,
.actionview--secondary:not(.disabled):active .actionview-path{
    fill: #37659A;
}
.actionview--secondary:not(.disabled) .actionview__wrapper__label,
.actionview--secondary:not(.disabled) .actionview__wrapper__label strong{
    color: #fff;
}

/***********************************************************************************************************************************
#### ##     ## ########   #######  ########  ########    ###    ##    ## ######## 
 ##  ###   ### ##     ## ##     ## ##     ##    ##      ## ##   ###   ##    ##    
 ##  #### #### ##     ## ##     ## ##     ##    ##     ##   ##  ####  ##    ##    
 ##  ## ### ## ########  ##     ## ########     ##    ##     ## ## ## ##    ##    
 ##  ##     ## ##        ##     ## ##   ##      ##    ######### ##  ####    ##    
 ##  ##     ## ##        ##     ## ##    ##     ##    ##     ## ##   ###    ##    
#### ##     ## ##         #######  ##     ##    ##    ##     ## ##    ##    ##    
***********************************************************************************************************************************/

.actionview--important:not(.disabled):hover .actionview__wrapper__image::after,
.actionview--important:not(.disabled):focus .actionview__wrapper__image::after,
.actionview--important:not(.disabled):active .actionview__wrapper__image::after{
    border-color: #EEC213;
}
.actionview--important:not(.disabled):hover .actionview-path,
.actionview--important:not(.disabled):focus .actionview-path,
.actionview--important:not(.disabled):active .actionview-path{
    fill: #EEC213;
}
.actionview--important:not(.disabled) .actionview__wrapper__label,
.actionview--important:not(.disabled) .actionview__wrapper__label strong{
    color: #3d251b;
}

/***********************************************************************************************************************************
##     ## ####  ######   ##     ## ##       ####  ######   ##     ## ######## 
##     ##  ##  ##    ##  ##     ## ##        ##  ##    ##  ##     ##    ##    
##     ##  ##  ##        ##     ## ##        ##  ##        ##     ##    ##    
#########  ##  ##   #### ######### ##        ##  ##   #### #########    ##    
##     ##  ##  ##    ##  ##     ## ##        ##  ##    ##  ##     ##    ##    
##     ##  ##  ##    ##  ##     ## ##        ##  ##    ##  ##     ##    ##    
##     ## ####  ######   ##     ## ######## ####  ######   ##     ##    ##    
***********************************************************************************************************************************/

.actionview--highlight:not(.disabled) .actionview__wrapper__image::after{
    border-color: #EEC213;
}
.actionview--highlight:not(.disabled) .actionview__wrapper__label,
.actionview--highlight:not(.disabled) .actionview__wrapper__label strong{
    color: #3d251b;
}

/***********************************************************************************************************************************
##     ##  #######  ########  #### ######## #### ######## ########      ##     ##     ##  #######  ########  #### ##       ######## 
###   ### ##     ## ##     ##  ##  ##        ##  ##       ##     ##    ####    ###   ### ##     ## ##     ##  ##  ##       ##       
#### #### ##     ## ##     ##  ##  ##        ##  ##       ##     ##     ##     #### #### ##     ## ##     ##  ##  ##       ##       
## ### ## ##     ## ##     ##  ##  ######    ##  ######   ########             ## ### ## ##     ## ########   ##  ##       ######   
##     ## ##     ## ##     ##  ##  ##        ##  ##       ##   ##       ##     ##     ## ##     ## ##     ##  ##  ##       ##       
##     ## ##     ## ##     ##  ##  ##        ##  ##       ##    ##     ####    ##     ## ##     ## ##     ##  ##  ##       ##       
##     ##  #######  ########  #### ##       #### ######## ##     ##     ##     ##     ##  #######  ########  #### ######## ######## 
***********************************************************************************************************************************/

.actionview--mobile{
    text-shadow: 0 1px 1px rgba(0,0,0,.35);
}
.actionview--mobile:not(.disabled) .actionview__wrapper__label{
    background: #bfd16c;
}
.actionview--mobile:not(.disabled) .actionview__wrapper__count{
    background: #e5ff70;
    border-color: #bfd16c;
}
.actionview--mobile .actionview__wrapper__count{
    color: #535b4f;
}
.actionview--mobile:not(.disabled):hover .actionview__wrapper__count{
    background: #f4fec7;
}
.actionview--mobile:not(.disabled) .actionview-path{
    fill: #AD5B50;
}
.actionview--mobile:not(.disabled) .actionview__wrapper__image::after{
    border-color: #e5ff70;
}
.actionview--mobile:not(.disabled) .actionview__wrapper__label,
.actionview--mobile:not(.disabled) .actionview__wrapper__label strong{
    color: #fff;
}

/* hover ***************************************************************************************************************************/
.actionview--mobile:not(.disabled):hover .actionview__wrapper__image::after,
.actionview--mobile:not(.disabled):focus .actionview__wrapper__image::after,
.actionview--mobile:not(.disabled):active .actionview__wrapper__image::after{
    border-color: #f4fec7;
}
.actionview--mobile:not(.disabled):hover .actionview-path,
.actionview--mobile:not(.disabled):focus .actionview-path,
.actionview--mobile:not(.disabled):active .actionview-path{
    fill: #AD5B50;
}