/**
 * Fuentes
 */

/*@font-face {
    font-family: 'vonique_64italic';
    src: url('../lib/fonts/vonique/vonique_64_italic-webfont.woff2') format('woff2'),
         url('../lib/fonts/vonique/vonique_64_italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'vonique_64regular';
    src: url('../lib/fonts/vonique/vonique_64-webfont.woff2') format('woff2'),
         url('../lib/fonts/vonique/vonique_64-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'vonique_64bold_italic';
    src: url('../lib/fonts/vonique/vonique_64_bold_italic-webfont.woff2') format('woff2'),
         url('../lib/fonts/vonique/vonique_64_bold_italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'vonique_64bold';
    src: url('../lib/fonts/vonique/vonique_64_bold-webfont.woff2') format('woff2'),
         url('../lib/fonts/vonique/vonique_64_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}*/



/**
 * Estilos generales
 */


html{
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    
}

body {
    background: #ffffff;
    /*font-family: 'Montserrat', serif;*/
    font-family: "Open Sans",Arial,sans-serif;
    /*
    IMPORTANTE! Es obligatorio para adaptar el toolbar en el iPhone X y que se visualice correctamente     
    */
    /*padding-top: constant(safe-area-inset-top);*/ /* iOS 11.0 */
    /*padding-top: env(safe-area-inset-top);*/ /* iOS 11.2 */
}
/*
* IMPORTANTE !! Esto es obligatorio para adaptar el total de la pantalla al iPhone X
*/
view-main{
    /*padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);*/
}


/*iPhone 8 */
@media only screen
and (device-width : 375px)
and (device-height : 667px)
and (-webkit-device-pixel-ratio : 2)
and (orientation : portrait) {
    .framework7-root{height:667px}

    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
        height: 100%;
        top:0;
    }
    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel .page {
        padding-top: 22px;
    }
    .navbar {
        height: calc(constant(safe-area-inset-bottom) + 65px) !important;
        height: calc(env(safe-area-inset-bottom) + 65px) !important;
        left: 0;
        bottom: 0;
    }
    .toolbar {
        height: calc(constant(safe-area-inset-bottom) + 50px) !important;
        height: calc(env(safe-area-inset-bottom) + 50px) !important;
        left: 0;
        bottom: 0;
    }
    .ios .toolbar-inner {
        padding: 8px 8px;
        height: auto;
    }
    .ios .toolbar.tabbar.button-big {
        height: calc(constant(safe-area-inset-bottom) + 68px) !important;
        height: calc(env(safe-area-inset-bottom) + 68px) !important;
    }
    .ios .navbar-inner {
        height: 100%;
        padding-top: 33px;
    }
    html.with-statusbar.device-ios .framework7-root, html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root { padding-top: 0;}
    html.with-statusbar .statusbar {display: none;}
    .page-content {
        padding-top: 60px !important;
    }
    .page.smart-select-page .searchbar, .page.smart-select-page .page-content{
        margin-top: 20px!important;
    }
}









/* iPhone X y XS */
@media only screen
and (device-width : 375px)
and (device-height : 812px)
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape) {
    .framework7-root{height:375px}
    .page-content{padding-left: 44px;padding-right: 44px;}
    .navbar {
        height: calc(constant(safe-area-inset-bottom) + 22px) !important;
        height: calc(env(safe-area-inset-bottom) + 22px) !important;
        left: 0;
        bottom: 0;
    }
    .toolbar {
        height: calc(constant(safe-area-inset-bottom) + 44px) !important;
        height: calc(env(safe-area-inset-bottom) + 44px) !important;
        left: 0;
        bottom: 0;
    }
    .ios .toolbar-inner {
        padding: 8px 44px;
        height: auto;
    }
    .ios .navbar-inner {
        height: 100%;
        padding-top: 11px;
    }
    html.with-statusbar.device-ios .framework7-root, html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root { padding-top: 0;}
    html.with-statusbar .statusbar {display: none;}
}
@media only screen
and (device-width : 375px)
and (device-height : 812px)
and (-webkit-device-pixel-ratio : 3)
and (orientation : portrait) {
    .framework7-root{height:812px}

    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
        height: 100%;
        top:0;
    }
    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel .page {
        padding-top: 22px;
    }
    .navbar {
        height: calc(constant(safe-area-inset-bottom) + 38px) !important;
        height: calc(env(safe-area-inset-bottom) + 38px) !important;
        left: 0;
        bottom: 0;
    }
    .toolbar {
        height: calc(constant(safe-area-inset-bottom) + 36px) !important;
        height: calc(env(safe-area-inset-bottom) + 36px) !important;
        left: 0;
        bottom: 0;
    }
    .ios .toolbar-inner {
        padding: 8px 8px;
        height: auto;
    }
    .ios .toolbar.tabbar.button-big {
        height: calc(constant(safe-area-inset-bottom) + 45px) !important;
        height: calc(env(safe-area-inset-bottom) + 45px) !important;
    }
    .ios .navbar-inner {
        height: 100%;
        padding-top: 33px;
    }
    html.with-statusbar.device-ios .framework7-root, html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root { padding-top: 0;}
    html.with-statusbar .statusbar {display: none;}
    .page-content {
        padding-top: 75px !important;
    }
    .page.smart-select-page .searchbar, .page.smart-select-page .page-content{
        margin-top: 25px!important;
    }
}

/* iPhone XR, XS Max y 11*/
@media only screen
and (device-width : 414px) 
and (device-height : 896px) 
and (-webkit-device-pixel-ratio : 2)
and (orientation : landscape),
screen
and (device-width : 414px) 
and (device-height : 896px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape){
    .framework7-root{height:414px}
    .page-content{padding-left: 44px;padding-right: 44px;}
    .navbar {
        height: calc(constant(safe-area-inset-bottom) + 22px) !important;
        height: calc(env(safe-area-inset-bottom) + 22px) !important;
        left: 0;
        bottom: 0;
    }
    .toolbar {
        height: calc(constant(safe-area-inset-bottom) + 44px) !important;
        height: calc(env(safe-area-inset-bottom) + 44px) !important;
        left: 0;
        bottom: 0;
    }
    .ios .toolbar-inner {
        padding: 8px 44px;
        height: auto;
    }
    .ios .navbar-inner {
        height: 100%;
        padding-top: 11px;
    }
    html.with-statusbar.device-ios .framework7-root, html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root { padding-top: 0;}
    html.with-statusbar .statusbar {display: none;}
}
@media only screen
and (device-width : 414px) 
and (device-height : 896px) 
and (-webkit-device-pixel-ratio : 2)
and (orientation : portrait),
screen
and (device-width : 414px) 
and (device-height : 896px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : portrait){
    .framework7-root{height:896px}

    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
        height: 100%;
        top:0;
    }
    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel .page {
        padding-top: 22px;
    }
    .navbar {
        height: calc(constant(safe-area-inset-bottom) + 38px) !important;
        height: calc(env(safe-area-inset-bottom) + 38px) !important;
        left: 0;
        bottom: 0;
        
    }
    .toolbar {
        height: calc(constant(safe-area-inset-bottom) + 36px) !important;
        height: calc(env(safe-area-inset-bottom) + 36px) !important;
        left: 0;
        bottom: 0;
    }
    .ios .toolbar-inner {
        padding: 8px 8px;
        height: auto;
    }
    .ios .toolbar.tabbar.button-big {
        height: calc(constant(safe-area-inset-bottom) + 56px) !important;
        height: calc(env(safe-area-inset-bottom) + 56px) !important;
    }
    .ios .navbar-inner {
        height: 100%;
        padding-top: 33px;
    }
    html.with-statusbar.device-ios .framework7-root, html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root { padding-top: 0;}
    html.with-statusbar .statusbar {display: none;}
    .page-content {
        padding-top: 75px !important;
    }
    .page.smart-select-page .searchbar, .page.smart-select-page .page-content{
        margin-top: 25px!important;
    }
}


/* iPhone 12, 12 Pro*/
@media only screen
and (device-width : 390px) 
and (device-height : 844px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape){
    .framework7-root{height:390px}
    .page-content{padding-left: 44px;padding-right: 44px;}
    .navbar {
        height: calc(constant(safe-area-inset-bottom) + 22px) !important;
        height: calc(env(safe-area-inset-bottom) + 22px) !important;
        left: 0;
        bottom: 0;
    }
    .toolbar {
        height: calc(constant(safe-area-inset-bottom) + 44px) !important;
        height: calc(env(safe-area-inset-bottom) + 44px) !important;
        left: 0;
        bottom: 0;
    }
    .ios .toolbar-inner {
        padding: 8px 44px;
        height: auto;
    }
    .ios .navbar-inner {
        height: 100%;
        padding-top: 11px;
    }
    html.with-statusbar.device-ios .framework7-root, html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root { padding-top: 0;}
    html.with-statusbar .statusbar {display: none;}
}
@media only screen
and (device-width : 390px) 
and (device-height : 844px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : portrait){
    .framework7-root{height:844px}

    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel {
        height: 100%;
        top:0;
    }
    html.with-statusbar.device-ios .panel, html.with-statusbar.ios:not(.device-ios):not(.device-android) .panel .page {
        padding-top: 22px;
    }
    .navbar {
        height: calc(constant(safe-area-inset-bottom) + 38px) !important;
        height: calc(env(safe-area-inset-bottom) + 38px) !important;
        left: 0;
        bottom: 0;
        
    }
    .toolbar {
        height: calc(constant(safe-area-inset-bottom) + 44px) !important;
        height: calc(env(safe-area-inset-bottom) + 44px) !important;
        left: 0;
        bottom: 0;
    }
    .ios .toolbar-inner {
        padding: 8px 8px;
        height: auto;
    }
    .ios .toolbar.tabbar.button-big {
        height: calc(constant(safe-area-inset-bottom) + 62px) !important;
        height: calc(env(safe-area-inset-bottom) + 62px) !important;
    }
    .ios .navbar-inner {
        height: 100%;
        padding-top: 33px;
    }
    html.with-statusbar.device-ios .framework7-root, html.with-statusbar.ios:not(.device-ios):not(.device-android) .framework7-root { padding-top: 0;}
    html.with-statusbar .statusbar {display: none;}
    .page-content {
        padding-top: 75px !important;
    }
    .page.smart-select-page .searchbar, .page.smart-select-page .page-content{
        margin-top: 25px!important;
    }
}






.statusbar-overlay{
    /*background: #CF0161;*/
    background: #a90061;
}

/*h1, h2, h3, h4, h5, h6 {
 font-family: 'Lora', sans-serif;
 font-weight: 300;
 text-transform: uppercase;
}*/

.corporativo {
    color: #FACC2E;  /* color corporativo */
}

.tabbar a.active {
    color: #a90061;
}

.loader-background {
    width: 100%;
    height: 100%;
    position: relative; /* Cambiamos de absolute a relative */
    background-color: #eaeaea4a;
    z-index: 9999;
}
.loader {
  border: 8px solid #f3f3f3;
  border-radius: 50%;
  border-top: 8px solid #a90061;
  width: 100px;
  height: 100px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
  position:absolute;
  /* Ponemos el valor de left, bottom, right y top en 0 */
  left: 0;
  bottom: 0; 
  right: 0; 
  top: 0%;  
  margin: auto; /* Centramos vertical y horizontalmente */
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

.page-content{
    overflow-x: hidden;
    overflow-y: auto;
}


.bg-white {
    background-color: #FFFFFF;
}

.bg-corporativo {
    background-color: #151515;  /* color corporativo */
}

button.corporativo, .button.corporativo {
    background-color: #a90061; /* color corporativo */
    color: #ffffff;
    border: 1px solid #a90061; /* color corporativo */
    height: 50px;
}

.buttons-row button, .buttons-row .button {
    border: 1px solid #a90061;  /* color corporativo */
    background-color: transparent;
    color: #151515
}

.buttons-row button.active, .button.active {
    background-color: #a90061;
    color: #fff;
}

.hide {
    display: none !important;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

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

.text-bold {
    font-weight: bold;
}

.text-normal {
    font-weight: normal;
}

.capitalize {
    text-transform: capitalize !important;
}

.id-title{
    font-size: 24px;
}

.list-block {
    font-size: inherit;
     margin: 20px 0;
}

.content-block {
    color: #555;
    font-weight: normal;
}

.content-block .control-label {
    color: #555;
    font-weight: bold;
}

.inline {
    display: inline-block;
}

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}

.clear {
    clear: both;
}

.data-table {
    /*border-collapse: collapse;*/
}

form .item-input span.readonly {
    opacity: 0.7;
}

form .content-block{
    margin: 15px 0;
}

form.list-block{
    margin: 15px 0;
}

form .list-block textarea {
    border: 1px solid #c8c7cc;
    background-color: #fff;
    border-radius: 3px;
    font-size: 12px;
    padding: 6px 8px;
}

.standard-input{
    border: 1px solid #ccc;
    width: 70%;
    padding: 2px;
}

.border-input{
    border: 1px solid #848484!important;
    margin: 7px 0;
}

@media screen and (max-height: 1024px) {
    form .card-header{
        min-height: 52px;
        font-size: 22px;
    }
    form .smart-select{
        min-height: 52px;
        font-size: 22px;
    }
    form .list-block textarea {
        font-size: 17px;
    }
    form.searchbar {
        margin-top:10px;
    }
    .standard-input{
        line-height: 38px;
        font-size: 22px;
    }
    button.corporativo, .button.corporativo, button.secundary {
        font-size: 24px;
    }
    button.corporativo, .button.corporativo {
        height: 70px;
    }
    .toolbar.tabbar.button-big {
        height: 80px!important;
    }
    .toolbar.tabbar .row .button.secundary {
        height: 70px!important;
    }
    
}
   

@media screen and (max-height: 992px) {
    form .card-header{
        min-height: 52px;
        font-size: 22px;
    }
    form .smart-select{
        min-height: 52px;
        font-size: 22px;
    }
    form .list-block textarea {
        font-size: 17px;
    }
    form.searchbar {
        margin-top:10px;
    }
    .standard-input{
        line-height: 38px;
        font-size: 22px;
    }
    button.corporativo, .button.corporativo, button.secundary {
        font-size: 24px;
    }
    button.corporativo, .button.corporativo {
        height: 60px;
    }
    .toolbar.tabbar.button-big {
        height: 70px!important;
    }
    .toolbar.tabbar .row .button.secundary {
        height: 60px!important;
    }
    
}

@media screen and (max-height : 820px)  {
    form .card-header{
        min-height: 42px;
        font-size: 16px;
    }
    form .smart-select{
        min-height: 42px;
        font-size: 16px;
    }
    form .list-block textarea {
        font-size: 14px;
    }
    .standard-input{
        line-height: 24px;
        font-size: 16px;
    }
    button.corporativo, .button.corporativo, button.secundary {
        font-size: 18px;
    }
    button.corporativo, .button.corporativo {
        height: 49px;
    }
    .toolbar.tabbar.button-big {
        height: 70px!important;
    }
    .toolbar.tabbar .row .button.secundary {
        height: 49px!important;
    }
}

@media screen and (max-height: 670px) {
    form .card-header{
        min-height: 42px;
        font-size: 16px;
    }
    form .smart-select{
        min-height: 42px;
        font-size: 16px;
    }
    form .list-block textarea {
        font-size: 14px;
    }
    .standard-input{
        line-height: 24px;
        font-size: 16px;
    }
    button.corporativo, .button.corporativo, button.secundary {
        font-size: 18px;
    }
    button.corporativo, .button.corporativo {
        height: 49px;
    }
    .toolbar.tabbar.button-big {
        height: 56px!important;
    }
    .toolbar.tabbar .row .button.secundary {
        height: 49px!important;
    }
}

@media screen and (max-height: 600px) {
    form .card-header{
        min-height: 42px;
        font-size: 16px;
    }
    form .smart-select{
        min-height: 42px;
        font-size: 16px;
    }
    form .list-block textarea {
        font-size: 14px;
    }
    .standard-input{
        line-height: 24px;
        font-size: 16px;
    }
    button.corporativo, .button.corporativo, button.secundary {
        font-size: 17px;
    }
    button.corporativo, .button.corporativo {
        height: 48px;
    }
    .toolbar.tabbar.button-big {
        height: 55px!important;
    }
    .toolbar.tabbar .row .button.secundary {
        height: 48px!important;
    }
    /*.list-block .item-content{
        height: 38px;
        min-height: 38px;
    }*/
}









.relative {
    position: relative;
}
.block-separator{
    margin-bottom:5px;
}

.ion-icon-large {
    font-size: 22px;
}

.line-icon-large {
    font-size: 22px;
    vertical-align: middle;
}

.toolbar .line-icon-large{
    font-size: 26px;
}

/*Tamaño especial para los elementos del Tabbar*/
@media (min-width: 768px){
    .tabbar a.tab-link, .tabbar a.link {
        width: auto;
        min-width: 115px;
    }
}    

.datePicker{
    background: #FFFFFF;
}

.text-logged{
    text-align:right;
    margin-right:3px;
}
.text-user-logged{
    color:#2E64FE;
}

.loader-center{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    font-size:60px;
}

.selectorDate i{
    font-size:48px;
}

.selectorDate input[type="date"]{
    text-align:center;
    min-height:35px;
    font-size: 36px;
}

.push-notification{
    //background:#555555;
    //color:#000000;
}

.active-star{
    color : #F2E71F!important;
}
/*
Badges
*/
.badge.color-green {
    color: #fff;
    background: #4cd964;
}
.badge.color-red {
    color: #fff;
    background: #ff3b30;
}
.badge.color-orange {
    color: #fff;
    background: #FFBF00;
}
.badge.color-yellow {
    color: #fff;
    background: #DFBD01;
}

.badge.color-corporativo {
    color: #585858;
    background: #fc0;
}    

.label-switch .checkbox {
    position: absolute;
    left: 100px;
    bottom: 15px;
    /*left: 250px;
    bottom: 15px;*/
    
    /*width: 38px;
    height: 26px;*/
}

/*
Floating buttons
*/
.floating-button{
    bottom: 50px;
    z-index: 90;
    font-size: 28px;
    background: #a90061;
    color: #fff;
    border: none;
}    

/*.label-switch .checkbox:before {
    position: absolute;
    left: 2px;
    top: 2px;
    width: 38px;
    height: 28px;
}    

.label-switch .checkbox:after {
    content: ' ';
    height: 20px;
    width: 20px;
}*/

.list-block .item-title {
    text-align:left;
}  

.list-block .item-input{
    margin-top: 0px;
}


/*
* Estilos generales, para tablet
*/

@media screen and (max-width: 1024px) {
    body{
        font-size:20px;
    }
    .button {
        font-size:17px;
        line-height: 52px;
        height: 54px;
    }
    
    .button.button-big {
        font-size: 22px;
        line-height: 66px;
        height: 66px;
    } 
    .list-block.media-list .item-title, .list-block li.media-item .item-title, .list-block .item-after {
        font-size: 24px;
    }
    .item-link .item-content .item-inner .item-title{
        font-size:24px;
        max-width: 500px;
    }
    .list-block .item-subtitle {
        font-size:20px;
    }    
    .floating-button{
        bottom: 90px;
        width: 70px;
        height: 70px;
        font-size:30px;
    }
    .badge{
        font-size:22px;
    }
}    

@media screen and (max-width: 992px) {
    body{
        font-size:18px;
    }
    .button {
        font-size:17px;
        line-height: 52px;
        height: 54px;
    }
    
    .button.button-big {
        font-size: 22px;
        line-height: 66px;
        height: 66px;
    }  
    .list-block.media-list .item-title, .list-block li.media-item .item-title, .list-block .item-after {
        font-size: 16px;
    }
    .item-link .item-content .item-inner .item-title{
        font-size:16px;
        max-width: 500px;
    }
    .list-block .item-subtitle {
        font-size:16px;
    } 
    .text-logged{
        font-size: 22px;
    }
    .input-group .buttonsupdown{
        text-align: center;
        width: 95%;
        padding-top: 5px;
        margin-left: 5px;
        font-size: 32px;
    }
    input[type = "date"],input[type = "time"],input[type = "datetime"]{
        min-height: 52px;
        font-size: 24px;
        font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
  
    }
    .ion.lg{
        font-size:22px;
    }
    .hidden-phone{
        display:table-cell;
    }
    .label-checkbox{
        font-size: 20px;
    }
    .floating-button{
        bottom: 70px;
    }
    .smart-select .item-content .item-inner .item-after{
        width: 500px;
    }
    .badge{
        font-size:16px;
    }
}

@media screen and (max-height: 900px) {
    body{
        font-size:16px;
    }
    .floating-button{
        bottom: 95px;
    }
    .smart-select .item-content .item-inner .item-after{
        width: 350px;
    }
}

@media screen and (max-height: 850px) {
    body{
        font-size:15px;
    }
    .floating-button{
        bottom: 85px;
    }
    .smart-select .item-content .item-inner .item-after{
        width: 350px;
    }
}

@media screen and (max-height: 700px) {
    body{
        font-size:15px;
    }
    .button {
        font-size:16px;
        height: 30px;
    }
    
    .button.button-big {
        font-size: 17px;
        line-height: 44px;
        height: 44px;
    }
    
    .list-block.media-list .item-title, .list-block li.media-item .item-title, .list-block .item-after {
        font-size: 14px;
    }
    .list-block .item-subtitle {
        font-size:13px;
    } 
    .text-logged{
        font-size: 17px;
    }
    .input-group .buttonsupdown{
        text-align: center;
        width: 89%;
        padding-top: 5px;
        margin-left: 5px;
        font-size: 24px;
    }
    input[type = "date"],input[type = "time"],input[type = "datetime"]{
        min-height: 35px;
        font-size: 16px;
        font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
  
    }
    .ion.lg{
        font-size:12px;
    }
    .hidden-phone{
        display:none;
    }
    .label-checkbox{
        font-size: 14px;
    }
    .item-link .item-content .item-inner .item-title{
        font-size:14px;
        max-width: 250px;
    }
    .floating-button{
        bottom: 70px;
    }
    .smart-select .item-content .item-inner .item-after{
        width: 350px;
    }
    .smart-select .item-phone_line-defecto .item-inner .item-after{
        width: 250px!important;
    }
    .badge{
        font-size:13px;
    }
} 

@media screen and (max-width: 350px) {
    body{
        font-size:15px;
    }
    .item-link .item-content .item-inner .item-title{
        font-size:14px;
        max-width: 200px;
    }
    .smart-select .item-content .item-inner .item-after{
        width: 300px;
    }
    .smart-select .item-phone_line-defecto .item-inner .item-after{
        width: 230px!important;
    }
    .badge{
        font-size:13px;
    }
    
} 

/* ========================================================================== */
/**
 * Landing
 */
.view[data-page="landing"] .navbar {
    display: none;
}

.page[data-page="landing"] {
    /*background-color: #011680;*/
}


/* ========================================================================== */
/**
 * Login
 */
.view[data-page="login"] .navbar {
    display: none;
}

.page-content.login-screen-content .content-block, .login-screen-content .list-block{
    margin: 10px auto;
}

@media screen and (max-width: 1024px) {
    .page-content.login-screen-content.login {
        background: url('../img/login-background-tablet.png') no-repeat;background-size: 100%;
    }
    .page-content.login-screen-content.register {
        background: url('../img/login-background-tablet.png') no-repeat;background-size: 100%;
    }
    .logo {
        margin: 0 auto;
        margin-top: 100px!important;
        height: 250px;
        text-align: center;
    }
    .logo img {
        width: 300px;
    }
    .logo-navbar img{
        padding-top: 10px;
        height: 78px;
    }
    .navbar-fixed .page-content {
        padding-top: 64px;
    }
    .checkRememberPassword{
        font-size:18px;
        top:5px;
        width: 400px!important;
        left: 10px;
    }
} 

@media screen and (max-width: 992px) {
    .page-content.login-screen-content.login {
        background: url('../img/login-background-tablet.png') no-repeat;background-size: 100%;
    }
    .page-content.login-screen-content.register {
        background: url('../img/login-background-tablet.png') no-repeat;background-size: 100%;
    }
    .logo {
        margin: 0 auto;
        margin-top: 100px!important;
        height: 180px;
        text-align: center;
    }
    .logo img {
        width: 250px;
    }
    .logo-navbar img{
        padding-top: 10px;
        height: 75px;
    }
    .navbar-fixed .page-content {
        padding-top: 54px;
    }
    .checkRememberPassword{
        font-size:18px;
        top:5px;
        width: 400px!important;
        left: 10px;
    }
}    

@media screen and (max-width: 600px) {
    .page-content.login-screen-content.login {
        background: url('../img/login-background.png') no-repeat;background-size: 100%;
    }
    .page-content.login-screen-content.register {
        background: url('../img/login-background.png') no-repeat;background-size: 100%;
    }
    .logo {
        margin: 0 auto;
        margin-top: 30px!important;
        height: 120px;
        text-align: center;
    }
    .logo img {
        width: 200px;
    }
    .logo-navbar img{
        padding-top: 10px;
        height: 60px;
    }
    .navbar-fixed .page-content {
        padding-top: 40px;
    }
    .page-content{
        padding-bottom: 30px;
    }
    .checkRememberPassword{
        font-size:14px;
        top:5px;
        width: 400px!important;
        left: 10px;
    }
}

@media screen and (max-width: 350px) {
    .logo {
        margin: 0 auto;
        margin-top: 50px!important;
        height: 90px;
        text-align: center;
    }
}



.logo-navbar img {
    /*margin-top:10px;*/
    /*width: 100%;*/
}

.titleModeApp {
    margin: 0 auto;
    width: 180px;
    color: #002146;
}

/*#form-login input[type="text"], #form-login input[type="password"]{
    background: #FFF;
    border: 1px solid #848484;
    border-radius: 2px;
}*/

#form-login .item-title{
    color: #FFFFFF;
}

#form-login ::placeholder{
    color: #E6E6E6;
}




/* ========================================================================== */
/**
 * Register
 */
.view[data-page="register"] .navbar {
    display: none;
}

form .required::placeholder, .popup-form .required::placeholder {
  color: red;
  opacity: 1; /* Firefox */
}

.btn-register{
    font-size:18px;
}

@media screen and (max-width: 992px) {
    .btn-register{
        position: relative;
        top: 110px;
    }
}

@media screen and (max-width: 650px) {
    .btn-register{
        position: relative;
        top: 90px;
    }   
}

@media screen and (max-width: 600px) {
    .btn-register{
        position: relative;
        top: 0px;
    }   
}

@media screen and (max-width: 350px) {
    .btn-register{
        position: relative;
        top: 5px;
    }    
}

/* ========================================================================== */
/**
 * Mode use App
 */
.view[data-page="mode"] .navbar {
    display: none;
}

#form-mode .item-media {
    font-size: 17px;
    min-width: 15px;
}

#form-mode .item-input {
    margin-left: 15px;
}



/* ========================================================================== */
/**
 * Navbar
 */
.navbar {
    border-bottom: none;
    /*background-color: #011680;*/
    /*background-color: #FACC2E;
    color: #ffffff;*/  /* color corporativo */
    background-color: #a90061;
    color: #ffffff;
    
}

.toolbar{
    /*margin-bottom: constant(safe-area-inset-bottom);*/ /* iOS 11.0 */
    /*margin-bottom: env(safe-area-inset-bottom);*/ /* iOS 11.2 */
} 

#tab-notifications .badge {
    position: absolute;
    right: 22%;
    top: -3px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 12px;
    line-height: 15px;
    padding: 1px 5px;
}
 
@media screen and (max-width: 1024px) {
    .navbar {
        font-size: 36px;
        height: 72px;
    }
    .navbar .titulo {
        font-size: 24px;
        color: #FFFFFF;
        line-height: 1.1;
    }
    .toolbar {
        font-size: 20px;
        height: 72px;
    }
}

@media screen and (max-width: 992px) {
    .navbar {
        font-size: 26px;
        height: 54px;
    }
    .navbar .titulo {
        font-size: 18px;
        color: #FFFFFF;
        line-height: 1.1;
    }
    .toolbar {
        font-size: 18px;
        height: 54px;
    }
}

@media screen and (max-width: 600px) {
    .navbar {
        font-size: 17px;
        height: 44px;
    }
    .navbar .titulo {
        font-size: 16px;
        color: #FFFFFF;
        line-height: 1.1;
    }
    .toolbar {
        font-size: 10px;
        height: 44px;
    }
}  

.navbar a.link {
    /*color: #ffffff;*/
    color: #FFFFFF;
}

.navbar a.link i {
    font-size: 24px;
}

.navbar span.logo {
    display: block;
    height: 40px;
    /*width: 60%;*/
    width: auto;
}

.navbar span.logo > img {
    /*width: 100%;*/
    height: 40px;
}


/* ========================================================================== */
/**
 * Preloader
 */
.content-block.loader {
    margin-top: 50px;
}

span.preloader {
    width:42px;
    height:42px;
    left: 50%;
    position: relative;
}

/* ========================================================================== */
/**
 * Páginas (page)
 */
.page {
    /*background: #fff;*/
    /*background-color: #efeff4;*/
    /*background-color: #f6f6ef;*/
    /*background-color: #f7f7f8;*/
    background: #fff;
    color: #363636;
}

.page-title {
    color: #555;
    font-size: 14px;
    line-height: 1.1;
    padding: 15px 15px;
    position: relative;
    //text-transform: uppercase;
    text-align:center;
    //white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: bold;
}
.page-title > i{
    font-size:24px;
    vertical-align: middle;
}
.page-title > span{
    vertical-align: middle;
}

@media screen and (max-width: 992px) {
    .page-title {
        font-size: 20px;
    }    
}

@media screen and (max-width: 600px) {
    .page-title {
        font-size: 14px;
    }
}


.page-no-content {
    color: #555;
    padding: 0 15px;
}

.page.toolbar-fixed {
    padding-bottom: 30px;
}


/* ========================================================================== */
/**
 * Toolbar
 */
.toolbar.tabbar .row {
    width: 100%;
}

.toolbar.tabbar .row .button {
    width: 100%;
}

.toolbar.tabbar .row .button.secundary {
    width: 100%;
    background: white;
    border: 1px solid rgb(216, 216, 216);
    color: #000;
    height: 50px;
}

.toolbar.tabbar.button-big {
    height: 64px;
}

/* ========================================================================== */
/**
 * Botones
 */
.button {
    border-radius: 3px;
}

.col-100 .button {
    width: 100%;
}

.col-75 .button {
    width: 100%;
}

.col-50 .button {
    width: 100%;
}

.content-block .button {
    width: 100%;
}


.button.button-fill.bg-purple, .button.button-fill.color-purple {
    background: #9c27b0 none repeat scroll 0 0;
    color: #fff;
}
.button-action .row .button{
    width: 100%;
}

/* ========================================================================== */
/*
	Android optimization hacks
*/
html.android .navbar-from-right-to-center .left.sliding .back.link .icon,
html.android .navbar-from-center-to-right .left.sliding .back.link .icon,
html.android .navbar-from-center-to-left .left.sliding .back.link .icon,
html.android .navbar-from-left-to-center .left.sliding .back.link .icon {
    -webkit-transition-duration: 200ms;
    transition-duration: 200ms;
}
html.android .navbar-from-right-to-center .sliding,
html.android .navbar-from-center-to-right .sliding,
html.android .navbar-from-center-to-left .sliding,
html.android .navbar-from-left-to-center .sliding {
    -webkit-transition-duration: 200ms;
    transition-duration: 200ms;
}
html.android .page-from-right-to-center {
    -webkit-animation: pageFromRightToCenterDegrade 200ms forwards;
    animation: pageFromRightToCenterDegrade 200ms forwards;
}
html.android .page-from-center-to-right {
    -webkit-animation: pageFromCenterToRightDegrade 200ms forwards;
    animation: pageFromCenterToRightDegrade 200ms forwards;
}
html.android .page-on-left {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
html.android .page-from-center-to-left {
    -webkit-animation: emptyAnimation 50ms forwards;
    animation: emptyAnimation 50ms forwards;
}
html.android .page-from-left-to-center {
    -webkit-animation: emptyAnimation 50ms forwards;
    animation: emptyAnimation 50ms forwards;
}
@-webkit-keyframes emptyAnimation {
    to {
        opacity: 1;
    }
}
@keyframes emptyAnimation {
    to {
        opacity: 1;
    }
}
html.android .label-switch input[type="checkbox"] + .checkbox {
    -webkit-transition-duration: 0ms;
    transition-duration: 0ms;
}
html.android .label-switch input[type="checkbox"] + .checkbox:before {
    -webkit-transition-duration: 0ms;
    transition-duration: 0ms;
}
html.android .label-switch input[type="checkbox"] + .checkbox:after {
    -webkit-transition-duration: 0ms;
    transition-duration: 0ms;
}
html.android .list-block .list-group-title {
    display: none;
}

/*
*  Home
*/

.home-screen-content {
    background: url('img/home-background.png') no-repeat;background-size: 100%;
}

@media screen and (max-width: 1024px) {
    .home-buttons{
        position:absolute;
        bottom:100px;
        right:5px;
        left:5px;
    }
}

@media screen and (max-width: 992px) {
    .home-buttons{
        position:absolute;
        bottom:80px;
        right:5px;
        left:5px;
    }
}

@media screen and (max-height: 850px) {
    .home-buttons{
        position:absolute;
        bottom:80px;
        right:5px;
        left:5px;
    }
}

@media screen and (max-height: 700px) {
    .home-buttons{
        position:absolute;
        bottom:60px;
        right:5px;
        left:5px;
    }
}

@media screen and (max-width: 350px) {
    .home-buttons{
        position:absolute;
        bottom:60px;
        right:5px;
        left:5px;
    }
}

.bocadillo-redondo {
    position: relative;
    height: 150px;
    width: 300px;
    background: white;
    border-radius: 50%;
    box-shadow: 1px 12px 33px rgba(0, 0, 0, 0.5);
}
.bocadillo-redondo:before {
    border: 25px solid white;
    content: '';
    border-left-color: transparent;
    border-bottom-color: transparent;
    border-right-color: transparent;
    position: absolute;
    bottom: -44px;
    right: 75px;
    transform: rotate(-8deg);
}

/* ========================================================================== */
/**
 * Listado de shops de usuario
 */



.list-shops-content .item-media {
    width: 50px;
}

.list-shops-content .item-subtitle {
    color: #808080;
}

.item-media img{
    border: 1px solid #D8D8D8; 
    border-radius: 50%;
}

.item-media img{
    border: 1px solid #D8D8D8; 
    border-radius: 50%;
}

.image-profile{
    border: 1px solid #D8D8D8; 
    border-radius: 50%;
}


/* ========================================================================== */
/**
 * Ventana de nuevo comercio
 */

@media screen and (max-width: 992px) {
    .shop-content button[data-action='qr'], .shop-content button[data-action='search']{
        font-size: 36px;
        height: 130px;
    }
}

@media screen and (max-width: 600px) {
    .shop-content button[data-action='qr'], .shop-content button[data-action='search']{
        font-size: 30px;
        height: 130px;
    }
}

@media screen and (max-width: 350px) {
    .shop-content button[data-action='qr'], .shop-content button[data-action='search']{
        font-size: 26px;
        height: 130px;
    }
}

/* ========================================================================== */
/**
 * Listado de busqueda de nuevos comercios
 */

/*.list-shops-content button[data-action='search']{
    position: absolute;
    right: 5px;
    top: 8px;
}*/



/* ========================================================================== */
/**
 * Detalle del comercio del usuario
 */

.shop-detail{
    margin-bottom: 40px;
}

.category-option{
    text-align: left;  
    /*background: rgba(255,255,255,1);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 56%, rgba(237,237,237,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(56%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 56%, rgba(237,237,237,1) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 56%, rgba(237,237,237,1) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 56%, rgba(237,237,237,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 56%, rgba(237,237,237,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );*/
    background: #a90061;
    border: 2px solid #FFFFFF;
    border-radius: 5px;
    color: #FFFFFF;
    margin: 2px;
    padding: 5px;
}

.category-option img{
    float: left;
    border: 2px solid #FFF;
    border-radius: 50%;
    background: #FFF;
}

.category-option .title{
    color: #FFFFFF;
    font-size: 24px;
    margin-top: 15px;
    margin-left: 70px;
}

@media screen and (max-width: 1024px) {
    
    .shop-detail .content-image-shop{
        margin:0!important;
        padding:0!important;
        margin-top:24px!important;
    }
    
    .shop-detail .content-image-shop img.cover{
        background: white;
        height: 520px;
        width: 100%;
        margin-top: -3px;
    }

    .shop-detail .content-image-shop img.profile{
        background: white;
        width: 150px;
        height: auto;
        border-radius: 120px;
        border: 1px solid #000;
        margin-top: 20px;
        position: absolute;
        left: 5px;
        top: 350px;
        z-index: 1;
    }
    
    .tab-link.button{
        line-height: 57px;
    }
    .tab-link.button i{
        font-size: 42px;
    }
    .buttons-row .button{
        height: 60px;
    }
    .shop-detail .list-block.media-list{
        height: 800px;
        overflow: scroll;
    }
    
}

@media screen and (max-width: 992px) {
    
    .shop-detail .content-image-shop{
        margin:0!important;
        padding:0!important;
        margin-top:24px!important;
    }
    
    .shop-detail .content-image-shop img.cover{
        background: white;
        height: 400px;
        width: 100%;
        margin-top: -3px;
    }

    .shop-detail .content-image-shop img.profile{
        background: white;
        width: 150px;
        height: auto;
        border-radius: 120px;
        border: 1px solid #000;
        margin-top: 20px;
        position: absolute;
        left: 5px;
        top: 220px;
        z-index: 1;
    }
    
    .tab-link.button{
        line-height: 43px;
    }
    .tab-link.button i{
        font-size: 28px;
    }
    .buttons-row .button{
        height: 45px;
    }
    .shop-detail .list-block.media-list{
        height: 600px;
        overflow: scroll;
    }
    
}

@media screen and (max-width : 375px) and (max-height : 850px)  {
    
    .shop-detail .content-image-shop{
        margin:0!important;
        padding:0!important;
        margin-top:24px!important;
    }
    .shop-detail .content-image-shop img.cover{
        background: white;
        height: 220px;
        width: 100%;
    }

    .shop-detail .content-image-shop img.profile{
        background: white;
        width: 80px;
        height: auto;
        border-radius: 50px;
        border: 1px solid #000;
        margin-top: 20px;
        position: absolute;
        left: 3px;
        top: 112px;
        z-index: 1;
    }
    .tab-link.button{
        line-height: 32px;
    }
    .tab-link.button i{
        font-size: 22px;
        margin-top: 1px;
    }
    .buttons-row .button{
        height: 36px;
    }
    .shop-detail .list-block.media-list{
        height: 390px;
        overflow: scroll;
    }
}

@media screen and (max-width : 375px) and (max-height : 700px)  {
    
    .shop-detail .content-image-shop{
        margin:0!important;
        padding:0!important;
        margin-top:24px!important;
    }
    .shop-detail .content-image-shop img.cover{
        background: white;
        height: 220px;
        width: 100%;
    }

    .shop-detail .content-image-shop img.profile{
        background: white;
        width: 80px;
        height: auto;
        border-radius: 50px;
        border: 1px solid #000;
        margin-top: 20px;
        position: absolute;
        left: 3px;
        top: 112px;
        z-index: 1;
    }
    .tab-link.button{
        line-height: 28px;
    }
    .tab-link.button i{
        font-size: 22px;
        margin-top: 1px;
    }
    .buttons-row .button{
        height: 32px;
    }
    .shop-detail .list-block.media-list{
        height: 100%;
        overflow: scroll;
    }
}

@media screen and (max-width : 330px) and (max-height : 600px)  {
    
    .shop-detail .content-image-shop{
        margin:0!important;
        padding:0!important;
        margin-top:24px!important;
    }
    .shop-detail .content-image-shop img.cover{
        background: white;
        height: 220px;
        width: 100%;
    }

    .shop-detail .content-image-shop img.profile{
        background: white;
        width: 80px;
        height: auto;
        border-radius: 50px;
        border: 1px solid #000;
        margin-top: 20px;
        position: absolute;
        left: 3px;
        top: 112px;
        z-index: 1;
    }
    .tab-link.button{
        line-height: 28px;
    }
    .tab-link.button i{
        font-size: 22px;
        margin-top: 1px;
    }
    .buttons-row .button{
        height: 29px;
    }
    .shop-detail .list-block.media-list{
        height: 100%;
        overflow: scroll;
    }
}

.item-service-active {
    background-color: #007aff!important;
    color: #fff!important;
}



@media screen and (max-width: 992px) {
    .order-content .data-table {
        /*margin: 10px 0;*/
        font-size: 15px;
    }
    .item-service-active .item-inner .item-title {
        font-weight: bold!important;
        font-size: 22px!important;
    }

    .item-service-active .item-inner .item-subtitle {
        font-weight: bold!important;
        font-size: 20px!important;
    }
}

@media screen and (max-width: 600px) {
    .order-content .data-table {
        /*margin: 10px 0;*/
        font-size: 11px;
    }
    .item-service-active .item-inner .item-title {
        font-weight: bold!important;
        font-size: 16px!important;
    }

    .item-service-active .item-inner .item-subtitle {
        font-weight: bold!important;
        font-size: 14px!important;
    }
}

.order-content .data-table thead th {
    white-space: normal;
    height: 24px;
    padding: 0 5px;
}

.order-content .data-table th,
.order-content .data-table td {
    padding: 4px;
    height: 28px;
}

.order-content .data-table-orders td {
    height: 10px;
}


/* ========================================================================== */
/**
 * Formulario de cita
 */

.shop-content{
    margin-top: -20px;
}

.shop-content.shop-detail .page-title{
    padding: 0;
}

.shop-content .item-content.corporativo{
    width: 100%;
    background: #000;
    color: #585858;
    font-size: 18px;
}

.swiper-slide img{
    border: 1px solid #D8D8D8;
    border-radius: 50%;
}

#schedulesAvailable{
    margin-bottom: 80px;
}

.item-schedule{
    padding: 5px;
    background: #fc0;
    text-align: center;
    border: 1px solid #c8c7cc;
    border-radius: 10px;
    margin-left: 8px;
    margin-bottom: 5px;
    display: inline-block;
}

.item-schedule.pending{
    border: 1px solid #fc0;
    font-weight: bold;
    background: repeating-linear-gradient( 45deg, rgba(0, 0, 0, 0) 20px, rgba(0, 0, 0, 0) 40px, #FC0 40px, #FC0 60px );
}

.item-schedule.busy{
    background: #E6E6E6;
    text-decoration:line-through;
}

.item-schedule.selected{
    background: #007aff;
    color:#FFFFFF;
    font-weight: bold;
}


@media screen and (max-width: 992px) {
    .swiper-slide .name-employe{
        position: absolute;
        top: 15px;
        right: 30%;
        margin: 0 auto;
        width: 300px;
        font-size: 14px;
    }
    .item-schedule{
        margin-left: 12px;
        font-size:14px;
        width: 10%;
    }
}

@media screen and (max-width: 600px) {
    .swiper-slide .name-employe{
        position: absolute;
        top: 15px;
        right: 20%;
        margin: 0 auto;
        width: 200px;
        font-size: 12px;
    }
    .item-schedule{
        margin-left: 10px;
        font-size:12px;
        width: 18%;
    }    
}

@media screen and (max-width: 350px) {
    .swiper-slide .name-employe{
        position: absolute;
        top: 15px;
        right: 15%;
        margin: 0 auto;
        width: 200px;
        font-size: 12px;
    }
    .item-schedule{
        margin-left: 5px;
        font-size:12px;
        width: 18%;
    }    
}

#dateBefore,#dateNext{
    font-size:56px;
    color:#0080FF;  
}

#dateBefore.disabled{
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
}



/* ========================================================================== */
/**
 * Listado de notificaciones
 */
#notifications-list .item-content .item-media {
    font-size: 20px;
}
#notifications-list .item-content.read {
    background: #F2F2F2;
}
#notifications-list .item-content .item-title.noread{
    font-size: 14px;
    font-weight: bold;
}
#notifications-list .item-content .item-subtitle.noread{
    font-size: 15px;
    font-weight: bold;
}
/* ========================================================================== */
/**
 * Formulario de usuario
 */

.form-user-content .list-block{
    margin: 10px 0;
}

.form-user-content .list-block input[type=text], .form-user-content .list-block input[type=password], .form-user-content .list-block select{
    font-size: 14px;
}
.form-user-content i {
    font-size: 24px;
}

#divImageCamera{
    text-align: center;
}

#divImageCamera img{
    max-width: 150px;
    height: auto;
    border: 1px solid #D8D8D8;
    /*border-radius: 50%;*/
    background:white;
} 


.form-user-content button[data-action="open-camera"],.form-user-content button[data-action="select-photo"]{
    margin-right: 2px;
    height: 40px;
    text-align: center;
    width: 15%;
} 

/*
Lista de puntos del usuario
*/

@media screen and (max-width: 992px) {
    #toolbarPoints{
        margin-bottom: 60px;
    }    
}

@media screen and (max-width: 600px) {
    #toolbarPoints{
        margin-bottom: 40px; 
    }    
}

@media screen and (max-width: 350px) {
    #toolbarPoints{
        margin-bottom: 40px;
    }    
    
}

/*
 Lista de opciones del comercio
*/

.shop-options i {
    font-size: 24px;
}
.shop-options .item-content{
    background: #fc0;
}

.shop-options ul{
    border-top: 0;
}

.shop-options li{
    margin-bottom: 3px;
    border-radius: 10px;
}

.shop-notifications{
    position: absolute;
    right: 35px;
    bottom: 10px;
}

i.estado_0 {
    color: #ff3b30;
}

i.estado_1 {
    color: #ff9500;
}

i.estado_2 {
    color: #ff9500;
}

i.estado_3 {
    color: #4cd964;
}

i.estado_4 {
    color: #000000;
}

i.estado_5 {
    color: #4cd964;
}

.list-block .item-text{
    height:23px!important;
}

.list-block .item-title-extra{
    width:100px;
    margin-left:80px;
}

/*
    Formulario de configuracion del comercio
*/


@media screen and (max-width: 992px) {
    
    #form-shop .content-image-shop, #form-config-assistant .content-image-shop{
        margin:0!important;
        padding:0!important;
        margin-bottom:-160px!important;
    }
    
    #form-shop .content-image-shop img.cover, #form-config-assistant .content-image-shop img.cover{
        background: white;
        height: 400px;
        width: 100%;
    }

    #form-shop .content-image-shop img.profile, #form-config-assistant .content-image-shop img.profile{
        background: white;
        width: 150px;
        height:auto;
        border-radius: 120px;
        border: 1px solid #000;
        position: relative;
        left: 5px;
        top: -160px;
        z-index: 1;
    }
    #form-suscription .content-block{
        margin: 35px 0;
    }
    #tab-config .item-title.label{
        width: 500px;
    }
    
}

@media screen and (max-width: 600px) {
    
    #form-shop .content-image-shop,#form-config-assistant .content-image-shop{
        margin:0!important;
        padding:0!important;
        margin-bottom:-95px!important;
    }
    #form-shop .content-image-shop img.cover,#form-config-assistant .content-image-shop img.cover{
        background: white;
        height: 220px;
        width: 100%;
        margin-top: 3px;
    }

    #form-shop .content-image-shop img.profile,#form-config-assistant .content-image-shop img.profile{
        background: white;
        width: 80px;
        height:auto;
        border-radius: 50px;
        border: 1px solid #000;
        position: relative;
        left: 3px;
        top: -92px;
        z-index: 1;
    }
    #form-suscription .content-block{
        margin: 20px 0;
    }
    #tab-config .item-title.label{
        width: 300px;
    }
}

/*
    Listado de citas del comercio
*/

.booking-pending{
    border-left: 10px solid orange;
    margin-bottom:5px;
}

.booking-confirmed{
    border-left: 10px solid #4cd964;
    margin-bottom:5px;
}

.booking-finished{
    border-left: 10px solid #A4A4A4;
    margin-bottom:5px;
}

.booking-canceled{
    border-left: 10px solid red;
    margin-bottom:5px;
}



@media screen and (max-width: 992px) {
    .history-button{
        font-size:70px;
    }
    
}

@media screen and (max-width: 600px) {
    .history-button{
        font-size:40px;
    }
}

/*
    Formulario de cita del comercio
*/

.img-thumbnail-service img{
    height: 48px;
}


/*
   Lista de tareas/citas
*/

.task-list i.estado_R {
    color: #ff9500;
}

.task-list i.estado_P {
    color: #ff3b30;
}

#form-task textarea {
    border: 1px solid #c8c7cc;
    background-color: #fff;
    border-radius: 3px;
    font-size: 12px;
    padding: 6px 8px;
}

#form-task select{
    font-size:16px;
    padding: 6px 8px;
}

@media screen and (max-width: 992px) {
    #form-task.card-header{
        min-height: 65px;
        font-size: 22px;
    }
    #form-task .list-block textarea {
        font-size: 17px;
    }
    
}

@media screen and (max-width: 600px) {
    #form-task .card-header{
        min-height: 45px;
        font-size: 16px;
    }
    #form-task .list-block textarea {
        font-size: 12px;
    }
}


/*
    CRM
    Nueva Oportunidad de venta
*/

.oportunity_new .list-block textarea {
    border: 1px solid #c8c7cc;
    background-color: #fff;
    border-radius: 3px;
    font-size: 12px;
    padding: 6px 8px;
}

@media screen and (max-width: 992px) {
    .oportunity_new .list-block textarea {
        font-size: 17px;
    }
    
}

@media screen and (max-width: 600px) {
    .oportunity_new .list-block textarea {
        font-size: 12px;
    }
}



/* ========================================================================== */
/**
 * input-group (basado en bootstrap)
 */
.input-group {
    border-collapse: separate;
    display: table;
    position: relative;
}

.input-group-btn {
    font-size: 0;
    position: relative;
    white-space: nowrap;
}
.input-group-addon, .input-group-btn {
    vertical-align: middle;
    white-space: nowrap;
    width: 1%;
}
.input-group .form-control, .input-group-addon, .input-group-btn {
    display: table-cell;
}

.input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group {
    margin-right: -1px;
}

.input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group {
    margin-left: -1px;
}

@media screen and (max-width: 992px) {
    .input-group-btn > .btn {
        position: relative;
        height: 46px;
        padding: 6px 20px;
        font-size: 20px;
    }  
}

@media screen and (max-width: 600px) {
    .input-group-btn > .btn {
        position: relative;
        height: 36px;
        padding: 6px 12px;
        font-size: 14px;
    }
}

.input-group .form-control {
    float: left;
    margin-bottom: 0;
    position: relative;
    /*width: 100%;*/
    z-index: 2;
}

.btn {
    -moz-user-select: none;
    background-image: none;
    border: 1px solid transparent;
    /*border-radius: 4px;*/
    cursor: pointer;
    display: inline-block;
    font-weight: 400;
    line-height: 1.42857;
    margin-bottom: 0;
    text-align: center;
    touch-action: manipulation;
    vertical-align: middle;
    white-space: nowrap;
}

.btn-white {
    background: white none repeat scroll 0 0;
    border: 1px solid #ccc;
    color: inherit;
}

.input-group-addon {
    position: relative;
    background-color: #eee;
    color: #555;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 0 8px;
    text-align: center;
}

/* ========================================================================== */
/**
 * MARGINS & PADDINGS
 */
.m-none {
    margin: 0 !important;
}

.m-xs {
    margin: 5px;
}

.m-sm {
    margin: 10px;
}

.m-md {
    margin: 20px;
}

.m-lg {
    margin: 30px;
}

.m-xl {
    margin: 50px;
}

.m-t-none {
    margin-top: 0;
}

.m-t-xxs {
    margin-top: 1px;
}

.m-t-xs {
    margin-top: 5px;
}

.m-t-sm {
    margin-top: 10px;
}

.m-t {
    margin-top: 15px;
}

.m-t-md {
    margin-top: 20px;
}

.m-t-lg {
    margin-top: 30px;
}

.m-t-xl {
    margin-top: 40px;
}

.m-b-none {
    margin-bottom: 0;
}
.m-b-xxs {
    margin-bottom: 1px;
}
.m-b-xs {
    margin-bottom: 5px;
}
.m-b-sm {
    margin-bottom: 10px;
}
.m-b {
    margin-bottom: 15px;
}
.m-b-md {
    margin-bottom: 20px;
}
.m-b-lg {
    margin-bottom: 30px;
}
.m-b-xl {
    margin-bottom: 40px;
}
.m-t-none {
    margin-right: 0;
}

.m-r-xxs {
    margin-right: 1px;
}

.m-r-xs {
    margin-right: 5px;
}

.m-r-sm {
    margin-right: 10px;
}

.m-r {
    margin-right: 15px;
}

.m-r-md {
    margin-right: 20px;
}

.m-r-lg {
    margin-right: 30px;
}

.m-r-xl {
    margin-right: 40px;
}


.p-none {
    padding: 0 !important;
}

.p-xs {
    padding: 10px;
}

.p-sm {
    padding: 15px;
}

.p-m {
    padding: 20px;
}

.p-md {
    padding: 25px;
}

.p-lg {
    padding: 30px;
}

.p-xl {
    padding: 40px;
}

.p-t-none {
    padding-top: 0;
}

.p-b-none {
    padding-bottom: 0;
}

.p-l-xs {
    padding-left: 10px;
}

.p-l-sm {
    padding-left: 15px;
}

/* ========================================================================== */
/**
 * Labels
 */
span.label {
    border-radius: 3px;
    display: inline-block;
    font-size: 0.8em;
    font-weight: bold;
    padding: 3px 8px;
    text-align: center;
    text-shadow: none;
    vertical-align: baseline;
    white-space: nowrap;
}

.label-warning {
    background-color: #f8ac59;
    color: #ffffff;
}

.label-danger {
    background-color: #ed5565;
    color: #ffffff;
}

.label-info {
    background-color: #23c6c8;
    color: #ffffff;
}

.label-plain {
    border: 1px solid #8e8e93;
    font-weight: normal !important;
}

/*
* Badges
*/

.badge{
    color: #000;
    background: #fff;
}

span.badge {
    line-height: 17px;
    padding: 3px 7px;
}

.badge-info-light{
    background-color: #E6E6E6;
    color: #000000;
}

/* ========================================================================== */
/**
 * Colores
 */
.txt-info {
    color: #23c6c8;
}

.txt-danger {
    color: #ed5565;
}

.txt-warning {
    color: #f8ac59;
}

.txt-plain {
    color: #8e8e93;
}

/* ========================================================================== */
/**
 * Checkbox
 */
label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox {
    background-color: #a90061;
}

label.label-checkbox input[type="checkbox"]:disabled + .item-media i.icon-form-checkbox {
    background-color: #ccc;
}

/* ========================================================================== */
/**
 * Formulario de códigos de barras
 */
#barcode-form .list-block {
    padding: 0;
}

#barcode-form .list-block .item-inner {
    width: auto;
}

#chk_verify{
    margin: 6px;
    height: 20px;
    width: 20px;
}



/* ========================================================================== */
/**
 * Home: listado de aplicaciones disponibles
 */
.home-app {
    border: 1px solid #ccc;
    min-height: 50px;
    border-radius: 7px;
    background: #002146;
    color: #fff;
    font-size: 17px;
    text-align: center;
    padding: 7px 12px;
    line-height: 48px;
    margin-bottom: 14px;
}

@media screen and (max-width: 992px) {
    .home-app {
        font-size: 18px;
    }    
}

@media screen and (max-width: 600px) {
    .home-app {
        font-size: 17px;
    }
}



.home-app .icon {
    margin-top: 10px;
    font-size: 32px;
}

.home-app i {
    
}

.home-app .title {
    text-transform: uppercase;
    font-weight: bold;
}

/* ========================================================================== */
/**
 * Panel lateral
 */
.panel {
    background-color: #fefefe;
}

.panel .list-block .item-content {
    padding-left: 0;
}

.panel .list-block .item-title.label {
    width: 45%;
}
.linkPersonal{
    font-size: 16px;
    font-weight: bold;
    text-decoration: underline;
}

/* ========================================================================== */
/**
 * Listado de inventarios
 */
.inventory .list-block .list-group-title {
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom: 15px;
    padding-top: 15px;
}

/*
.inventory .list-block ul {
    border-top: none;
    border-bottom: none;
}*/

/*
.inventory li.h2 {
    background-color: white;
    border-bottom: 1px solid #ccc;
    color: #000;
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    padding: 20px 15px 0;
}
*/
/*
.inventory .list-block .inventory-data .title {
    color: #000;
    font-weight: 300;
}*/

.inventory .list-block .inventory-data .description {
    color: #555;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inventory .floating-button {
    font-size: 18px;
}

/* ========================================================================== */
/**
 * Inventario: Nuevo
 */
#form-inve .list-block input[type="text"], .list-block input[type="date"], .list-block input[type="datetime-local"], .list-block select {
    font-size: 14px;
}

#form-inve .list-block .item-inner {
    margin-left: 5px;
}

#form-inve .item-title.label {
    font-weight: bold;
    text-transform: uppercase;
}

#form-inve .item-media i {
    font-size: 24px;
    min-width: 24px;
}

/* ========================================================================== */
/**
 * Inventario: Formulario
 */
#form-inve .searchbar {
    background-color: #ddd;
    border-bottom: none;
}

#lineinve-list .item-content .item-title .title {
    display: block;
    font-weight: bold;
    line-height: 24px;
}

#lineinve-list .item-content .item-title .subtitle {
    
}

#lineinve-list .item-content .item-title .subtitle2 {
    font-size:12px;
    display:block;
}


/* ========================================================================== */
/**
 * Inventario: Formulario de línea
 */
/*.lineinve-form input[type="number"], .lineinve-form input[type="text"] {
    display: inline-block;
    width: auto;
}
*/

.lineinve-form .list-block ul{
    border-top :0;
    border-bottom: 0;
}

.barcode {
    border: 1px solid #ccc;
    border-radius: 4px;
    display: inline-block;
    max-width: 28px;
    padding: 5px 4px 0;
    vertical-align: middle;
}

.barcode img  {
    width: 100%;
}

.article .card-header {
    justify-content: normal;
}

.lineinve-form .card-header.text-center {
    display: block;
}

.article input[type="text"] {
    border: 1px solid #ccc;
    border-radius: 0;
    font-size: 14px;
    line-height: 23px;
    padding: 6px 8px;
    margin-right: 5px;
}

.article .item-title {
    white-space: normal;
    color: #6d6d72;
}
/*
.article-img {
    width: 64px;
}*/

.article-img img {
    width: 50%;
}

.lineinve-form .touchspin input[type="text"] {
    border: none;
    font-size: 15px;
    font-weight: bold;
    line-height: 23px;
    margin: 0 5px;
    padding: 6px 12px;
    text-align: center;
    width: 90%;
}

.lineinve-form .input-group-btn {
    z-index: 3;
}

/* ========================================================================== */
/**
 * Search bar
 */


/*
* Popup small center screen
*/

.popup-small-center {
    width: 100px;
    height: 100px;
    background-color: red;

    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;

    margin: auto;
}


/* ========================================================================== */
/**
 * Listado de entradas
 */

.entry .floating-button {
    font-size: 18px;
    bottom: 50px;
}

#entry-list {
    font-size: 12px;
}

#entry-list tbody td{
    padding-left: 8px;
    padding-right: 8px;
}




/*
*  Ventana de documentación
*/

.icon-doc-pdf{
    background: transparent url(../img/icons-extensions.png) repeat scroll -1px -1px;
    width: 32px;
    height: 38px;
}

/*
*  Ventana de cuestionario
*/


    
@media screen and (max-width: 992px) {
    .tituloBienvenida{
        font-size: 24px;
    }
    .imagenPregunta{
        max-width: 100%;
    }  
    .tituloPregunta{
        font-size: 32px;
    }

    .tituloRespuesta{
        font-size: 18px;
        color: #6E6E6E;
    }
}

@media screen and (max-width: 600px) {
    .tituloBienvenida{
        font-size: 20px;
    }
    .imagenPregunta{
        max-width: 250px;
    } 
    .tituloPregunta{
        font-size: 24px;
    }

    .tituloRespuesta{
        font-size: 14px;
        color: #6E6E6E;
    }
}



/*
* Ventana de contatos
*/

@media screen and (max-width: 1400px) and (max-height: 1024px) {
    #toolbarDownloadContacts{
        margin-bottom: 75px;
    }
    .contacts-form{
        margin-bottom: 95px;
    }
}

@media screen and (max-width: 1024px) and (max-height: 1400px) {
    #toolbarDownloadContacts{
        margin-bottom: 55px;
    } 
    .contacts-form{
        margin-bottom: 115px;
    }
}

@media screen and (max-width: 800px) and (max-height: 1024px) {
    #toolbarDownloadContacts{
        margin-bottom: 60px; 
    } 
    .contacts-form{
        margin-bottom: 115px;
    }
}

@media screen and (max-width: 414px) and (max-height: 896px) {
    #toolbarDownloadContacts{
        margin-bottom: 50px;
    }
    .contacts-form{
        margin-bottom: 90px;
    }
}    

@media screen and (max-width: 400px) and (max-height: 700px) {
    #toolbarDownloadContacts{
        margin-bottom: 40px;
    } 
    .contacts-form{
        margin-bottom: 60px;
    }
    
}


/* CDR consumo de llamadas */
@media screen and (max-width: 350px) {
    .cdr .show-detail .item-title, .cdr .show-detail .item-after{
        font-size: 14px!important;
    }
    .cdr .show-detail .line-icon-large{
        font-size: 16px!important;
    } 
}