@charset "utf-8";
/* CSS Document */


/*
    font-family: 'Poppins'; font-weight: normal;
    font-family: 'Poppins'; font-weight: 500;
    font-family: 'Poppins'; font-weight: normal; font-style: italic;
    font-family: 'Poppins'; font-weight: 600;
    font-family: 'Courier New'; font-weight: normal; font-style: normal;
    font-family: 'Oswald'; font-weight: normal;
*/


.guidelistcontainer {
    margin: 120px 0 0 -30px;
    width: calc(100% + 60px);
}

.articlebox {
    width: calc(25% - 60px);
    margin: 0 30px 50px;
    float: left;
    display: inline-block;
    text-decoration: none;
    background: #fff;
    transition: all ease-out 0.3s !important;
    -webkit-transition: all ease-out 0.3s !important;
    -moz-transition: all ease-out 0.3s !important;
    -ms-transition: all ease-out 0.3s !important;
}

.articlebox:hover {
    -moz-transform: translate(0, -5px);
    -ms-transform: translate(0, -5px);
    -o-transform: translate(0, -5px);
    -webkit-transform: translate(0, -5px);
    transform: translate(0, -5px);
    transition: all ease-out 0.3s !important;
    -webkit-transition: all ease-out 0.3s !important;
    -moz-transition: all ease-out 0.3s !important;
    -ms-transition: all ease-out 0.3s !important;
}

.guidelistcontainer .article_middle {
    background-color: #FFFFFF;
    padding: 30px;
}

.guidelistcontainer .articlename a {
    color: #373737;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    padding: 0;
    margin-bottom: 0;
    text-decoration: none
}

.articlebox .articleimg a img {
    max-width: 100%
}



/*responsive styles*/
@media (max-width: 1599.98px) {


    /*    .inrpage_sec.toolpg .servicebx_container {margin: 100px 0 0 0;}*/


}

@media (max-width: 1440px) {

    .guidelistcontainer {
        margin: 120px 0 0 -10px;
        width: calc(100% + 20px);
    }

    .articlebox {
        width: calc(25% - 20px);
        margin: 0 10px 20px;
    }


}

@media (max-width: 1200px) {

    .articlebox {
        width: calc(33.33% - 20px);
    }



}

@media (max-width: 992px) {}

@media (max-width: 768px) {

    .articlebox {
        width: calc(50% - 20px);
        margin: 0 10px 20px;
    }

    .guidelistcontainer {
        margin: 40px 0 0 -10px;
    }



}

@media (max-width: 640px) {}

@media (max-width: 575px) {

    .articlebox {
        width: calc(100% - 20px);
    }



}

@media (max-width: 360px) {}