﻿/*About css*/

body
{
    height: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0;
}

.main {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    width: 100%;
    margin: 0 auto;
    flex-grow: 1;
}

.text-container,
.img_container {
    flex: 1 1 300px;
    max-width: 600px;
    width: 90%;
    margin: 0 auto;
}


.img_container img {
    max-width: 100%;
    height: auto;
    border: 2px solid ghostwhite;
}

.about-text
{
    padding: 40px;
    color: darkorange;
    font-weight: bold;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
}

.about_paragraph {
    padding: 0 40px 20px 40px;
    color: black;
    font-size: clamp(1rem, 2.5vw, 1.2rem);
}



.review_header
{
    text-align: center;
    font-weight: bold;


}

.review_text {
    color: darkslategray;
    text-align: center;
    margin: auto;
    padding: 0 40px 20px 40px;
    color: black;
    font-size: clamp(1rem, 2.5vw, 1rem);
}

/*section css*/

.sec_container {
    margin-top: 15px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 30px;
}

.sec_title {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    max-width: 100%;
    width: 300px; /* a little wider for better fit */
    height: auto;
    background-color: darkblue;
    color: black;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    padding: 10px 20px;
    text-align: center;
    border-radius: 4px;
}

.sec_title_content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sec_title h3 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: bold;
    color: #ffff;
}

.sec_title h5 {
    margin: 5px 0 0;
    font-size: 0.9rem;
    font-weight: normal;
    color: #ffff;
}




.box {
    background-color: #f2f3f4;
    text-align: center;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

.image_box
{
    overflow: hidden;
    max-width: 100%;
    max-height: 100%;
    width: 300px;
    height: auto;
    margin: 0 auto;
    padding: 20px;
    border: none;

}

.image_box img
{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    width: 100%;
    height: auto;

}

.box_title
{
    color: darkblue;
    margin: 0 auto;
    padding: 10px;
    margin-top: 15px;

}

.box_title_header {
    width: 300px;
    height: 40px;
    background-color: #0275d8;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

.box_text
{
    padding: 10px;
    color: black;

}

.banner-row {
    max-width: 1200px;
    margin: 0 auto;
}

.promo-banner {
    min-width: 250px;
    flex: 1 1 30%;
    height: 120px;
    border-radius: 10px;
    font-size: 1.2rem;
    transition: transform 0.3s ease;
    cursor: pointer;
}

    .promo-banner:hover {
        transform: scale(1.03);
    }

.banner-text {
    transition: opacity 0.5s ease;
}

.logo-img {
    max-height: auto; /* adjust as needed */
    width: 80px;
    display: inline-block;
    vertical-align: middle;
}

.click-here {
    color: #fff;
    background-color: #28a745; /* green background */
    padding: 4px 10px;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .click-here:hover {
        background-color: #218838; /* darker green on hover */
        text-decoration: none;
    }





