@keyframes animationFrames{
    0% {
        opacity: 0;
        transform: translateY(-30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@-moz-keyframes animationFrames{
    0% {
        opacity: 0;
        transform: translateY(-30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@-webkit-keyframes animationFrames {
    0% {
        opacity: 0;
        transform: translateY(-30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@-o-keyframes animationFrames {
    0% {
        opacity: 0;
        transform: translateY(-30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@-ms-keyframes animationFrames {
    0% {
        opacity: 0;
        transform: translateY(-30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.alert-animation{

    -webkit-animation: animationFrames ease-in-out .3s;
    -webkit-animation-iteration-count: 1;
    -webkit-transform-origin: 50% 50%;

    -moz-animation: animationFrames ease-in-out .3s;
    -moz-animation-iteration-count: 1;
    -moz-transform-origin: 50% 50%;

    -o-animation: animationFrames ease-in-out .3s;
    -o-animation-iteration-count: 1;
    -o-transform-origin: 50% 50%;

    -ms-animation: animationFrames ease-in-out .3s;
    -ms-animation-iteration-count: 1;
    -ms-transform-origin: 50% 50%;

    animation: animationFrames ease-in-out .3s;
    animation-iteration-count: 1;
    transform-origin: 50% 50%;
}





#api-vigile-header,
#api-vigile-footer{
    position: fixed;
    left: 0;
    right: 0;
    height: 0;
    z-index: 1500;
}
#api-vigile-header{
    top: 0;
}
#api-vigile-footer{
    bottom: 0;
}

.alert-vigile{

}

.alert-alert{
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
}

#api-vigile-header > .api-vigili-rigth > .alert,
#api-vigile-header > .api-vigili-center > .alert,
#api-vigile-header > .api-vigili-left > .alert,
#api-vigile-footer > .api-vigili-rigth > .alert,
#api-vigile-footer > .api-vigili-center > .alert,
#api-vigile-footer > .api-vigili-left > .alert{
    margin: 15px 0;
}


#api-vigile-header .api-vigili-rigth,
#api-vigile-header .api-vigili-center,
#api-vigile-header .api-vigili-left,
#api-vigile-footer .api-vigili-rigth,
#api-vigile-footer .api-vigili-center,
#api-vigile-footer .api-vigili-left{
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    padding: 0 15px;
}

@media (min-width: 768px) {
    #api-vigile-header,
    #api-vigile-footer{
        display: flex;
        flex-wrap: nowrap;
    }
    #api-vigile-header .api-vigili-rigth,
    #api-vigile-header .api-vigili-center,
    #api-vigile-header .api-vigili-left,
    #api-vigile-footer .api-vigili-rigth,
    #api-vigile-footer .api-vigili-center,
    #api-vigile-footer .api-vigili-left{
        position: relative;
        left: auto;
        right: auto;
        flex-basis: 0;
        flex-grow: 1;
        max-width: 100%;
    }
}


.callout{
    padding: 15px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}
.callout > h1:first-child,
.callout > h2:first-child,
.callout > h3:first-child,
.callout > h4:first-child,
.callout > h5:first-child,
.callout > h6:first-child{
    margin-top: 0;
}
.callout > *:first-child {
    margin-bottom: 0;
}
.callout code {
    border-radius: 3px;
}

.callout + .callout {
    margin-top: -5px;
}



.callout-danger {
    border-left-color: #a94442;
}
.callout-danger h1,
.callout-danger h2,
.callout-danger h3,
.callout-danger h4,
.callout-danger h5,
.callout-danger h6{
    color: #a94442;
}

.callout-warning {
    border-left-color: #8a6d3b;
}
.callout-warning h1,
.callout-warning h2,
.callout-warning h3,
.callout-warning h4,
.callout-warning h5,
.callout-warning h6{
    color: #8a6d3b;
}

.callout-info {
    border-left-color: #31708f;
}
.callout-info h1,
.callout-info h2,
.callout-info h3,
.callout-info h4,
.callout-info h5,
.callout-info h6{
    color: #31708f;
}

.callout-success {
    border-left-color: #3c763d;
}
.callout-success h1,
.callout-success h2,
.callout-success h3,
.callout-success h4,
.callout-success h5,
.callout-success h6{
    color: #3c763d;
}