/* Desplazamiento elástico y eliminado del */
* {-webkit-overflow-scrolling: touch;-webkit-tap-highlight-color:transparent}

html.dropdown-modal {overflow:hidden}

/* Elementos deshabilitados */
[disabled], .disabled {opacity:0.4;pointer-events:none !important}

/* Estilo translucido (btn-glass) */
.btn-glass:hover, 
.btn-glass.hover {color:inherit;background-color:rgba(0,0,0,0.03)} 
.btn-glass:active, 
.btn-glass.active {color:inherit;background-color:rgba(0,0,0,0.08)} 
.btn-glass>div{position: relative;z-index: 1}
.bgdark .btn-glass:hover,  
.bgdark .btn-glass.hover {color:white;background-color:rgba(255,255,255,0.3)} 
.bgdark .btn-glass:active, .bgdark .btn-glass.active {color:inherit;background-color:rgba(255,255,255,0.2)} 
.btn-glass:after{
    background: transparent;
    content: "";
    position: absolute;
    z-index:0;
    left: 0px;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    backdrop-filter: saturate(180%) blur(20px);
    border-radius: 10px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    display: block;
    opacity: 0.9;

}




/* Animación para botones: Zoom */
.btn-zoom:hover {transform:scale(1.02) perspective(1px);}
.btn-zoom:active {transform:scale(1) perspective(1px);}

/* Animación para botones: Press */
.btn-press:active {transform:scale(.98) perspective(1px);}

/* Animación para botones: moveup */
.btn-moveup:hover {transform:translateY(-2px);}
.btn-moveup:active {transform:translateY(0px);}                                       
                                             
.search-wrapper div.busy{animation:none}
.search-wrapper div.busy.absolute.size19{left:5px;top:3px;margin:0px}
.search-wrapper div.busy{opacity:0;transition:opacity 0.2s;display:block !important}
.search-wrapper div.button{opacity:1;transition:opacity 0.2s;display:block !important}
.search-wrapper div.process .busy{opacity:1;transition:opacity 0.3s;animation:vcpspinneranimation 850ms infinite linear}
.search-wrapper div.process .button{opacity:0;transition:opacity 0.3s}

/* Form default */
input:focus,button:focus {outline:none}
input[type=text],textarea,select {max-width:100%}
input {height:44px;;font-size:16px;}
 
.dropdown-panel {box-shadow:0 0 5px rgba(0,0,0,.5);position:relative;background:inherit}

/*Default de piezas*/
.piece.padding{padding: 5em 0}
.piece.margin{margins:2em 0;margin:calc(var(--margin-spacer) * 2) 0}


/* Botón de cierre de dropdown modal */
.page a[vsm-ddp-close]{position: absolute;top: 10px;right: 10px;width: 40px;height: 40px;opacity: 1;transition: opacity 250ms}
.page a[vsm-ddp-close]:after{position: absolute;left: 0;top: 0;width: 100%;height: 100%;line-height:4 0px;content: "\02A2F";color: white;font-size: 30px;opacity: 1}
.page a[vsm-ddp-close]:hover{opacity:0.8}
.page a[vsm-ddp-close]:active{opacity:0.5}

/*Tooltip*/
#vsmtooltip{padding:10px;background-color:#000;color:#f0f0f0;border:0px solid rgba(0,0,0,1);max-width:400px;border-radius:3px;font-size:1.4em;}

[vsm-ddp-pos='top'] {animation:vsmddptop 0.3s ease;transform:translate3D(0,0,0)}  /* Translate3D en 0 es para zafar de un bug de Chrome (versión 54 y 55 al menos) donde después de la animación desaparece el dropdown panel en algunos casos */
[vsm-ddp-pos='bottom'] {animation:vsmddpbottom 300ms ease;transform:translate3D(0,0,0)} /* Translate3D en 0 es para zafar de un bug de Chrome (versión 54 y 55 al menos) donde después de la animación desaparece el dropdown panel en algunos casos */
[vsm-ddp-pos='left'] {animation:vsmddpleft 300ms ease;transform:translate3D(0,0,0)} /* Translate3D en 0 es para zafar de un bug de Chrome (versión 54 y 55 al menos) donde después de la animación desaparece el dropdown panel en algunos casos */
[vsm-ddp-pos='right'] {animation:vsmddpright 300ms ease;transform:translate3D(0,0,0)} /* Translate3D en 0 es para zafar de un bug de Chrome (versión 54 y 55 al menos) donde después de la animación desaparece el dropdown panel en algunos casos */
[vsm-ddp-pos='modal'],
[vsm-ddp-pos='center'] {animation:vsmddpcenter 0.5s ease;transform:translate3D(0,0,0)} /* Translate3D en 0 es para zafar de un bug de Chrome (versión 54 y 55 al menos) donde después de la animación desaparece el dropdown panel en algunos casos */
@keyframes vsmddptop {0% {opacity:0;transform:translateY(8px);pointer-events:none}}
@keyframes vsmddpbottom {0% {opacity:0;transform:translateY(-8px);pointer-events:none}}
@keyframes vsmddpleft {0% {opacity:0;transform:translateX(8px);pointer-events:none}}
@keyframes vsmddpright {0% {opacity:0;transform:translateX(-8px);pointer-events:none}}
@keyframes vsmddpcenter {0% {opacity:0;transform:translateY(20px);pointer-events:none}}

/*detalles del curso/evento/publicacion, usado en el interior y en la pieza grilla con curso/evento/publicacion*/

.attributes{font-size:1.6em;line-height: 20px;vertical-align: middle;margin-top: 0.5em}
.attributes .itemtitle{display: inline-block;width:100px;font-weight: 600}
.attributes>div{line-height: 40px;border-bottom: 1px solid rgba(0,0,0,0.15);display: flex;align-items: center}
.attributes>div:before{content: "";display: inline-block;width: 20px;height: 20px;    margin-right:   5px;background-size: 20px;vertical-align: middle;flex-shrink: 0}
.attributes>div.duration:before{background-image: url(/0/course/icons/duration.svg);}
.attributes>div.modality:before{background-image: url(/0/course/icons/modality.svg);}
.attributes>div.days:before{background-image: url(/0/course/icons/days.svg);}
.attributes>div.status:before{background-image: url(/0/course/icons/status.svg);}
.attributes>div.date:before{background-image: url(/0/course/icons/date.svg);}
.attributes>div.maplocation:before{background-image: url(/0/event/icons/location.svg);}
.attributes>div.authors:before{background-image: url(/0/publications/icons/authors.svg);}
.attributes>div.language:before{background-image: url(/0/publications/icons/language.svg);}
.attributes>div.filepathurl:before{background-image: url(/0/publications/icons/publication.svg);}
.attributes>div.filepathurl a{color:var(--background-main-color)}
.attributes>div.filepathurl a:hover{text-decoration: underline}
.attributes>div.filepathurl a:hover:after{margin-left: 0.5em}
.attributes>div.filepathurl a:after{transition:all 0.3s;content: "";display: inline-block;width: 7px;height: 7px;border: 1px solid;margin-left: 0.2em;border-left: 0;border-bottom: 0;transform: rotate(45deg) translate(-1px,-1px)}
.attributes>div.schedule:before{background-image: url(/0/course/icons/schedule.svg);}

.bgdark .attributes>div:before{filter: invert(1)}
.piece  .item.publications .ts .year{font-size:1.6em;line-height: 40px;display: flex;align-items: center}
.piece .item.publications .ts .year:before{content: "";display: inline-block;width: 20px;height: 20px;    margin-right:   5px;background-size: 20px;vertical-align: middle;flex-shrink: 0}
.piece .item.publications .ts .year:before{background-image: url(/0/publications/icons/year.svg);}


@media(max-width: 768px){
    .piece.margin{margin:var(--margin-spacer) 0}
    .piece.padding{padding:var(--margin-spacer) 0}
}