/****************************************************************************/
/** Template Home Page ******************************************************/
/****************************************************************************/

/* Keyframes */
/*must be out of a media to work with IE*/
@-ms-keyframes
pendulum
{
    0%, 100% { transform: rotate(2deg); }
    25%, 75% { transform: rotate(-4deg); }
    50% { transform: rotate(4deg); }
}
@-webkit-keyframes
pendulum
{
    0%, 100% { transform: rotate(2deg); }
    25%, 75% { transform: rotate(-4deg); }
    50% { transform: rotate(4deg); }
}
@keyframes pendulum
{
    0%, 100% { transform: rotate(2deg); }
    25%, 75% { transform: rotate(-4deg); }
    50% { transform: rotate(4deg); }
}

@media screen,print
{
    .HomeContainer
    {
    }

    /*PUBLICITY OVERLAY*/
    .POOverlay
    {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        z-index: 3000;
        background: rgba(255,255,255,0.5);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#88ffffff,endColorstr=#88ffffff);
    }
    
    .POOverlay .POOverlayInner
    {
        height: 100vh;
    }
    
    .POOverlay .POOverlayInner iframe
    {
        height: 100vh;
        border: none;
        background-color: transparent;
        width: 100vw;
    }
    
    .HCPublicitySlideDown
    {
        background-image: url(/Css/Images/any/Publicidade/natal.png);
        background-repeat: no-repeat;
        background-position: center top;
        background-size: contain;
        width: 600px;
        height: 800px;
        position: absolute;
        top: -800px;
        left: calc(25% - 150px);
        z-index: 1000;
        cursor: pointer;
        animation: pendulum 10s infinite cubic-bezier(0.310, 0.440, 0.445, 1.650);
        -webkit-animation: pendulum 10s infinite cubic-bezier(0.310, 0.440, 0.445, 1.650);
        transform-origin: center top;
    }

}

@media screen and (max-width: 969px)
{
    
}

@media screen and (max-width: 768px)
{
    .HCPublicitySlideDown
    {
        width: 500px;
        height: 800px;
        top: -800px;
        left: calc(25% - 150px);
    }
}

@media screen and (max-width: 480px)
{
    .HCPublicitySlideDown
    {
        width: 320px;
        height: 800px;
        top: -800px;
        left: calc(50% - 160px);
    }
}

@media print
{

}