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

@media screen and (min-width:1001px) and (max-width:1366px) {
    /* font scaling for normal monitor */

    h6 {
        font-size: 5vw;
    }
}

@media screen and (min-width:621px) and (max-width:1000px) {
    /* font scaling for smaller monitor */

    h6 {
        font-size: 4.5vw;
    }
}

@media screen and (min-width:621px) and (max-width:693px) {
    /*snap copyright to mobile view for medium screens*/

    #inner_container {
        padding-bottom: 70px;
    }

    .first_footer_menu,
    .footer_menu {
        display: none;
    }

    #footer {
        height: 80px;
    }

    #copyright {
        float: none;
        width: 100%;
        height: 50px;
        margin: 0px;
        padding-top: 30px;
        text-align: center;
        top: 0px
    }
}

@media screen and (min-width:621px) and (max-width:899px) {

    .solutions {
        padding-left: 7px;
        padding-right: 7px;
    }

    .solutions_items {
        width: 260px;
        height: 580px;
        margin: 10px;
    }
}

@media only screen and (max-width:620px) {
    /* For mobile phones:*/

    .container,
    body,
    ul.horizontal,
    .header,
    .banner,
    #menu,
    #company_info_box,
    .quote_box,
    .titlebox_center {
        width: 100%;
    }

    #policy {
        text-align: left;
        padding: 25px;
    }

    h3.policy {
        font-size: 20px;
        padding-top: 6px;
        padding-bottom: 4px;
    }

    h4.policy {
        font-size: 24px;
        padding-bottom: 6px;
    }
    
    .box_right {
        width: 80%;
        margin-top: 40px;
        padding-top: 20px;
        float: none;
        overflow: hidden;
        display: block;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .banner {
        padding-top: 20px;
    }

    .logo {
        float: none;
        padding: 0px;
    }

    ul.horizontal {
        padding: 0px;
        padding-top: 20px;
    }

    ul.horizontal li {
        height: 16px;
        padding: 0px;
    }

    #menu {
        margin: 0px;
        float: none;
        text-align: center;
    }

    .header {
        padding: 0px;
        padding-top: 20px;
        text-align: center;
        height: 100px;
    }

    .center_image {
        display: none;
        /*width: 185px;
        height: auto;*/
    }

    .center_image_mobile {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 185px;
    }

    .button_positon {
        bottom: -75px;
    }

    .text_positon {
        left: 50%;
        bottom: 70px;
    }

    #company_info_box {
        margin-top: 20px;
    }

    .company_info {
        padding-top: 30px;
        width: 80%;
    }

    .solutions_box {
        width: 100%;
        height: auto;
        text-align: center;
        padding-bottom: 20px;
    }

    .solution_img_left,
    .solution_img_right {
        width: 50%;
        padding-top: 30px;
        float: none;
    }

    .solutions {
        max-width: 100%;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .solutions_items {
        width: 90%;
        height: auto;
        padding: 10px;
        display: block;
        box-shadow: 0px 0px 0px;
    }

    .solutions_items_img {
        height: 130px;
        margin-top: 10px;
        margin-bottom: -5px;
    }

    .h4_solutions {
        padding-top: 0px;
    }


    .natively_logo_box_right {
        display: none;
    }

    .mm_app_box {
        padding-top: 60px;
    }


    .portfolio_box {
        width: 100%;
        height: auto;
        text-align: center;
        padding-bottom: 20px;
    }

    .portfolio_box_gray {
        width: 100%;
        height: auto;
        text-align: center;
        padding-bottom: 20px;
    }

    .natively_portfolio_box {
        padding-top: 30px;
        text-align: center;
        padding-bottom: 20px;
    }

    .natively_titlebox_right {
        width: 80%;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 30px;
        text-align: center;
        float: none;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .titlebox_right {
        width: 80%;
        float: none;
        text-align: center;
        padding-top: 15px;
        padding-right: 0px;
        padding-bottom: 20px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .titlebox_left {
        width: 80%;
        float: none;
        text-align: center;
        padding-top: 15px;
        padding-bottom: 20px;
        padding-left: 0px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .portfolio_img {
        width: 90%;
        padding: 0px;
        float: none;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .portfolio_img2 {
        width: 80%;
        padding-top: 30px;
        float: none;
    }

    .portfolio_img3 {
        width: 80%;
        padding-top: 30px;
        float: none;
    }

    .portfolio_img4 {
        width: 80%;
        padding-top: 30px;
        float: none;
    }

    .portfolio_img5 {
        width: 80%;
        padding-top: 30px;
        float: none;
    }

    .portfolio_img6 {
        width: 80%;
        padding-top: 30px;
        float: none;
    }

    .appstore {
        height: 30px;
    }

    .mobile_contact_message {
        width: 100%;
        display: inline-block;
        padding-bottom: 10px;
    }

    .box_left {
        display: none;
    }

    h3 {
        line-height: 25px;
    }

    h3.large {
        line-height: 60px;
    }

    h4 {
        font-size: 18px;
        line-height: 22px;
    }

    h4_mm {
        font-size: 5vw;
        line-height: 26px;
    }

    h5 {
        font-size: 32px;
        padding-top: 0px;
        padding-bottom: 40px;
        max-width: 100%;
        margin: 0px;
    }

    h6 {
        font-size: 18pt;
    }

    .text_position {
        bottom: 20%;
    }

    .slick-prev:before,
    .slick-next:before {
        display: none;
    }

    .services {
        width: 100%;
        margin-top: 0px;
        padding: 0px;
    }

    .services_items {
        margin: 0px;
        padding: 5px;
        padding-left: 15px;
        padding-right: 15px;
        width: 35%;
        height: auto;
    }

    .form_text {
        max-width: 600px;
        overflow: hidden;
    }

    .form_box {
        width: 85%;
    }

    .contact_box {
        margin-top: 20px;
        height: 100%;
    }

    #inner_container {
        padding-bottom: 70px;
    }

    #footer {
        height: 80px;
    }

    .first_footer_menu,
    .footer_menu {
        display: none;
    }

    #copyright {
        float: none;
        width: 100%;
        height: 50px;
        margin: 0px;
        padding-top: 30px;
        text-align: center;
        top: 0px;
    }
}