/*=====================================================
=            Bootstrap 2.3.2 Media Queries            =
=====================================================*/
@media only screen and (max-width : 1200px) {
   #block-1 .card > div{
        padding: 10px 20px;
        height: 525px;
    }
}

@media only screen and (max-width : 979px) {
    .menu{
        display: none;
        position: absolute;
        z-index: 1;
        top: 80px;
        right: 0;
        background: #bce4fa;
        width: 100%;
        text-align: center;
    }
    .menu-container .container{
        padding: 0;
    }
    #hero.fiataloknak .headline,
    #hero.mindennapok .headline,
    #hero.jovotervezes .headline,
    #hero.otthonteremtes .headline{
        margin-top: 50px;
    }
    .menu-container .menu li{
        margin: 0;
        display: block;
        border-bottom: 1px solid rgb(0, 73, 123);;
        width: 100%;
        text-align: center;
    }
    .menu-container .menu li:last-of-type{
        border: 0;
    }
    .burger{
        display: inline-block;
    }

    #footer-links ul,
    #footer-links .cont{
        display: none;
    }
    #footer-links h4{
        cursor: pointer;
    }
    #footer-links h4 i{
        display: inline-block;
    }
}

@media only screen and (max-width : 767px) {
    #hero{
        height: 300px;
    }
    #hero .headline{
        margin-top: 100px;
    }
    #block-gray li{
        background-size: 50px;
    }
    .footer-top span{
        margin-bottom: 15px;
        display: inline-block;
    }

}

@media only screen and (max-width : 480px) {

}

@media only screen and (max-width : 320px) {

}

@media (pointer:coarse) {
    #block-1 #card-container,
    #block-2 #num-container{
        overflow:scroll;
    }
}