/**
* General
*/
html, body {
    background: #fefefe; min-height: 100%; height: 100%;
    padding: 0; margin: 0;
}
.container { max-width: 1440px; }

.op-25 { opacity: 0.25; }
.op-50 { opacity: 0.5; }
.op-75 { opacity: 0.75; }
.box-shadow { box-shadow: 4px 4px 10px rgba(0,0,0, 0.2) }

.label-as-badge { border-radius: 1em; }

.menu {  min-height: 100%; height: 100%; border-right: #eee 1px solid; padding-top:10px; }
.menu li {  }
.menu li a { color:#666; }
.menu li:last-child  { border-bottom:none; }

.navbar [dropdown]:hover .dropdown-menu {
    display: block;
    margin-top: 0; 
}

.table .table-link {color:inherit;text-decoration:none !important; display:block;}

dd { 
    display: block;
    min-height: 38px;
    background-color: #f9f9f9;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    padding: 9px;
    border-radius: 3px;
    word-break: break-word;
}
dd:empty:after {
    content: 'vacío'; color: #bbb; font-style: italic;
}

dt { color: #777; font-weight: normal; font-size: 85%; margin-bottom: 5px; }

.filter-form { border-left: none; border-right: none; background: #f0f0f0; padding: 0 10px 0 10px; max-height: 0px;  -webkit-box-sizing: border-box; overflow: hidden;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.filter-form.expanded { padding: 10px; max-height: 500px; overflow: visible; }

.popover { max-width: 500px; }

.paginator {  }
.paginator ul { margin: 0; }
.paginator li { display: inline-block; }
.paginator p { display: inline-block; vertical-align: top; line-height: 33px;}

.message.success { 	/*! min-height: 46px; */ }
.message.error { color:red; }
.error-message { color:red; }

.bootstrap-tagsinput {
    padding: .375rem .75rem;
}
.bootstrap-tagsinput .badge {
    padding: 9px 10px;
}



/**
* Alerts
*/

.alert-body {
    display: flex;
    position: relative;
}
.alert__close {
    position: absolute;
    top: 10px;
    right: 10px;
}
.alert__icon {
    padding-right: 20px;
}

/**
* Custom columns
*/
.col-sm-20p { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; width: 20%; float:left; }


.metadata-bubble {
    padding: 5px 10px;
    border-radius: 7px;
    background: #00c5cc;
    color: white;
    display: block;
    margin: 3px;
}
.metadata-bubble-2 {
    background: #a8a8a8;
}
.metadata-bubble-3 {
    background: #d8b202;
}
.metadata-bubble-4 {
    background: #ce03e0;
}
.metadata-bubble-5 {
    background: #00bd66;
}
.metadata-bubble-6 {
    background: #0404e1;
}


/**
* Assets list
*/
    .asset-list { }
    .asset-list__img { width: 100%; height: 100px; object-fit: cover; }

/**
* Assets popup
*/
    .asset-popup { }
    .asset-popup__figure { width: 100%; text-align:center; cursor: pointer; }
    .asset-popup__caption { font-size: 10px; }
    .asset-popup__img { max-width: 100%; max-height: 100px; }
    .asset-popup__content { margin-top: 80px;  margin-bottom: 80px; }
    .asset-popup__bottom { padding: 10px 15px; }
    .asset-popup__top { padding: 10px 15px; }
    .asset-popup__title { margin-top: 3px;}
    .asset-popup__search { float:right;}



/**
* Iframes
*/

iframe {
    border: 0;
}
#preview-iframe {
    display: block;
    width: 100%;
    min-height: 500px;
    overflow: auto;
}

.iframe-container {
    position: relative;
    width: 100%;
}
.version-iframe {
    display: block;
    width: 100%;
    overflow: auto;
    min-height: 200px;
}
.iframeLoad {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
    border: 1px solid rgba(0,0,0,.125);
    background: rgba(255, 255, 255, .5);
}
.iframeLoad i {
    display: block;
}
.iframeLoad.loading {
    background: rgba(255, 255, 255, .5) url('../img/loading.gif') no-repeat center center;
    background-size: 24px 24px;
    cursor: default;
}
.iframeLoad.loading > * {
    display: none;
}

/**
* Preview Template option
*/

.preview-option { display: flex; align-items: center; background: #ffffff; }
.preview-option:hover { background: #bbbbbb; }
.preview-option__image { flex: 0 100px; text-align: center; max-height: 50px; }
.preview-option__image img { max-height: 100%; max-width: 100%; }
.preview-option__text { flex: 1; padding-left: 20px; }
.selectize-control { min-width: 300px; }
.selectize-input { padding-right: 30px; }

/**
* Custom Brand
*/

.page-container {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ec2db+1,1882c9+100 */
    background: rgb(142,194,219); /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  rgba(142,194,219,1) 1%, rgba(24,130,201,1) 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover,  rgba(142,194,219,1) 1%,rgba(24,130,201,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center,  rgba(142,194,219,1) 1%,rgba(24,130,201,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ec2db', endColorstr='#1882c9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.page-container.no-navigation {
    justify-content: center;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ec2db+1,1882c9+100 */
    background: rgb(142,194,219); /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  rgba(142,194,219,1) 1%, rgba(24,130,201,1) 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover,  rgba(142,194,219,1) 1%,rgba(24,130,201,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center,  rgba(142,194,219,1) 1%,rgba(24,130,201,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ec2db', endColorstr='#1882c9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.page-footer {
    font-size: 20px;
    color: #ffffff;

}
.page-container:not(.no-navigation) > .container {
    background: rgba(255, 255, 255, .9);
    height: 100%;
    margin-top: 40px;
    padding-top: 20px;
    border-radius: 10px;
    flex: 1;
}
.page-footer {
    font-size: 20px;
    color: #ffffff;
    padding-top: 50px;
}
.page-footer a {
    color: #ffffff;
    text-decoration: underline;
}
.btn {
    border-radius: 7px;
    font-size: 18px;
}
.btn:not(.btn-sm) {
    padding: .53rem .75rem;
}
.btn-primary {
    background: #002058;
    color: #ffffff;
}
.btn-primary:hover {
    background: #ffffff;
    color: #002058;
}
a {
    color: #002058;
}
a:hover {
    color: #002058;
}

.form-control {
    border-color: #002058;
    border-radius: 7px;
    color: #002058;
    /*! height: 46px; */
    padding: .63rem .75rem;
}
.selectize-control.multi .selectize-input > div {
    padding: 7px 5px;
}

select.form-control:not([size]):not([multiple]) {
    height: 46px;
}
.selectize-input input {
    padding: 9.5px !important;
}
.selectize-input {
    border-color: #002058;
    border-radius: 7px;
}

.selectize-input { 	/*! min-height: 46px; */ padding:  3.5px !important;}

.bootstrap-tagsinput {
    /*! padding: .6rem .75rem; */
    border-color: #002058;
    border-radius: 7px;
    min-height: 46px;
}

/**
* Login card
*/

.login-card {
    display: flex;
    flex-direction: row;
    max-width: 816px;
    margin: 0 auto;
    border-radius: 20px;
    overflow: hidden;
    justify-content: center;
    border: 0;
}
.login-card__left {
    flex: 1;
    background: #002058;
    display: flex;
    justify-content: center;
    align-items: center;
}
.login-card__image {
    width: 66%;
}
.login-card__image-small {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.login-card__right {
    flex: 0 430px;
    max-width: 430px;
}
.login-card__title {
    font-size: 20px;
}
.login-card__btn {
    min-width: 200px;
}