﻿@import url("../Pages/product-hero.css");
@import url("../Pages/buttons.css");
@import url("../Pages/common.css");
@import url("../product/product_common.css");
@import url("../Pages/section-title.css");

/* .product_poster_section {
    background-color: var(--ma-body-bg);
    padding: 100px 0
}

    .product_poster_section img {
        max-width: 500px;
        max-height: 500px
    }

    .product_poster_section h1 {
        color: var(--ma-grey160);
        font-size: var(--ma-greeting-title);
        font-weight: 700;
        margin-bottom: 10px
    }

    .product_poster_section h2 {
        color: var(--ma-grey160);
        font-size: var(--ma-greeting-title);
        font-weight: 700;
        margin-bottom: 10px
    }

    .product_poster_section p {
        color: var(--ma-type-secondary);
        font-size: var(--ma-subject-title);
        width: 100%;
        margin-bottom: 30px
    } 

.product_action_box {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.action_box {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: center !important;
    justify-content: center !important
}

    .action_box i {
        display: inline-block;
        height: 40px;
        width: 40px;
        margin-bottom: 10px;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat
    }

    .action_box p {
        color: var(--ma-type-secondary);
        font-size: var(--ma-body-text);
        width: 100%;
        margin-bottom: 0;
        text-align: center
    }*/
/*----------------------------------------------------------------------------------------*/
.product_images_section {
    background-color: var(--ma-white);
    padding: 50px 0
}

.box_contain_part {
    padding-left: 20px;
    border-left: 5px solid var(--ma-type-primary)
}

/*----------------------------------------------------------------------------------------*/


.features_section {
    background-color: var(--ma-body-bg);
    padding: 50px 0;
}

.features_section h2 {
    color: var(--ma-grey160);
    font-size: var(--ma-page-title);
    margin-bottom: 0px;
    font-weight: 700;
    text-transform: uppercase
}

.features_box {
    padding: 0 0 0 70px;
    min-height: 70px;
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center !important;
    align-items: center !important;
    margin-bottom: 20px
}

.features_box i {
    position: absolute;
    left: 0;
    height: 50px;
    width: 50px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

.features_box p {
    color: var(--ma-type-secondary);
    font-size: var(--ma-body-text);
    width: 100%;
    position: relative;
    margin-bottom: 0
}


/*----------------------------------------------------------------------------------------*/
.specification_section {
    background-color: var(--ma-white);
    padding: 50px 0
}

.specification_section h2 {
    color: var(--ma-grey160);
    font-size: var(--ma-page-title);
    margin-bottom: 0;
    font-weight: 700
}

.specification_section h3 {
    color: var(--ma-type-primary);
    font-size: var(--ma-header);
    width: 100%;
    font-weight: 700;
    margin-bottom: 20px
}

.specification_box {
    margin-bottom: 20px
}

.specification_box p {
    color: var(--ma-type-secondary);
    font-size: var(--ma-body-text);
    width: 100%;
    position: relative;
    margin-bottom: 0
}

/*----------------------------------------------------------------------------------------*/


.position_of_finger_section {
    background-color: var(--ma-body-bg);
    padding: 50px 0;
}


/*----------------------------------------------------------------------------------------*/
.get_in_touch_section {
    background-image: url(../../../Assets/Images/home/get-in-touch.png);
    background-color: var(--ma-body-bg);
    padding: 50px 0;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: unset
}

.getin_contact_us_btn,
.getin_view_solution_btn {
    display: inline-block;
    padding: 7px 20px;
    font-size: var(--ma-body-text);
}

.get_in_touch_section h3 {
    color: var(--ma-type-secondary);
    font-size: var(--ma-page-title);
    width: 100%;
    margin-bottom: 0
}

.get_in_touch_section p {
    color: var(--ma-type-secondary);
    font-size: var(--ma-body-text);
    margin-bottom: 10px
}

.schedule_appointment_btn {
    border: 1px solid var(--ma-type-primary);
    background-color: var(--ma-type-primary);
    color: var(--ma-white);
    border-radius: 7px;
    margin-bottom: 10px
}

.schedule_appointment_btn:active,
.schedule_appointment_btn:focus,
.schedule_appointment_btn:hover {
    border: 1px solid var(--ma-type-primary);
    background-color: #fff0;
    color: var(--ma-type-primary);
    transition: .3s
}

/*-------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1400px) {
    /* .product_poster_section img {
        max-width: 100%;
        max-height: unset
    } */
}

@media screen and (max-width:1200px) {
    .product_poster_section {
        padding: 70px 0
    }

    .system_requirements_section .system_requirements_img {
        background-size: 100%
    }
}

@media screen and (max-width:992px) {
    /* .product_poster_section {
        padding: 50px 0
    } */

    .system_requirements_section {
        background-size: 100% 500px;
        padding: 50px 0;
        background-position: bottom -220px center
    }

    .system_requirements_section .system_requirements_img {
        background-size: auto 100%;
        height: 100%;
        margin-top: 50px
    }
}

@media screen and (max-width:768px) {
    /* .product_poster_section {
        padding: 0 0 50px
    } */

    .product_images_section {
        text-align: center
    }

    .product_images_section img {
        max-height: 200px;
        max-width: 200px
    }

    .optical_finger_scanner_section img {
        max-width: 100%;
        max-height: unset;
        margin-top: 20px
    }

    .acquisition_box,
    .high_performance_section img {
        margin-bottom: 20px
    }

    .system_requirements_section .system_requirements_img {
        height: 200px;
        margin: 50px 0 0
    }

    .system_requirements_section {
        background-size: 100% 500px;
        padding: 50px 0 0;
        background-position: bottom -270px center
    }

    .acquisition_box img {
        max-height: 100px
    }

    .acquisition_box p {
        min-height: unset
    }

    .acquisition_heand_box {
        min-height: 200px
    }
}