* {
    margin: 0;
    box-sizing: border-box;
}

body {
    font-family: "Georgia", Times, serif;
}

.grid-container {
    display: grid;
    grid-template-areas:
        'logo1 link1 mobile1 mobile1 link2 menu11'
        'menu12 menu12 menu12 menu12 menu12 menu12'
        'scroll1 scroll1 scroll1 scroll1 scroll1 scroll1'
        '. title1 title1 title1 title1 title1'
        'menu2 content1 content1 content1 content1 .'
        '. . . . . .'
        '. . . . . .'
        'menu3 content2 content2 content2 content2 .'
        '. . . . . .'
        '. . . . . .'
        'menu4 content3 content3 content3 content3 .'
        '. . . . . .'
        '. . . . . .'
        'menu5 content4 content4 content4 content4 .'
        '. . content5 content5 . .'
        'image2 image2 form1 form1 form1 form1'
        'footer footer footer footer footer footer';
    gap: 10px;
    background-color: white;
    padding: 10px 0px 0px 0px;
}

.grid-container>div {}

.item1 {
    grid-area: logo1;
    background-color: white;
    padding: 45px 0px 0px 100px;
}

.item101 {
    grid-area: link1;
    padding: 40px 20px 0px 0px;
}

.item2 {
    grid-area: mobile1;
    text-align: center;
    color: red;

    padding: 0px 20px 0px 0px;
}

.item2 img {
    Width: 100%;
    Height: auto;
}

.item102 {
    grid-area: link2;
    padding: 40px 40px 0px 0px;
}

.item104 {
    grid-area: menu11;
    background-color: white;
    padding: 45px 55px 0px 0px;
}

.item3 {
    grid-area: menu12;
    text-align: center;
    color: red;
    background-color: white;
    font-size: 12px;
    font-weight: bold;
    padding: 0px 10px 0px 20px;
    font-family: Keraleeyam, sans-serif;
    src: url(/downloads/fonts/keraleeyam/Keraleeyam-Regular.woff2?v=Version3.0.2) format("woff2");
}

.image-scroller {
    grid-area: scroll1;
    overflow-x: hidden; 
    white-space: nowrap;
    padding: 0px 0px 0px 0px;
}
.image-wrapper {
    display: inline-flex; 
}
.image-wrapper img {
    height: 250px; 
    margin-right: 0px;  
    margin-left: 0px; 
}
.image-wrapper img:last-child {
    margin-right: 0; 
}

.item6 {
    grid-area: title1;
    font-size: 13px;
    padding: 0px 200px 0px 0px;
}

.item6 h2 {
    Color: #F4902E;
    text-align: center;
}

.item7 {
    grid-area: menu2;
    padding: 0px 0px 0px 90px;
}

.button2 {
    font-family: "Georgia", Times, serif;
    background-color: #F4902E;
    border: none;
    color: #F9E203;
    padding: 5px 5px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    display: block;
    width: 96%;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}

.button2:hover {
    background-color: white;
    color: #F4902E;
}

.button2:active {
    background-color: blue;
}

.item8 {
    grid-area: content1;
    padding: 0px 10px 0px 10px;
}

.item8 p {
    font-size: 12px;
    text-align: justify;
    color: black;
}

.item9 {
    grid-area: menu3;
    padding: 0px 0px 0px 90px;
}

.item10 {
    grid-area: content2;
    background-color: white;
    padding: 0px 10px 0px 10px;
}

.item10 p {
    font-size: 12px;
    text-align: justify;
    color: black;
}

.item11 {
    grid-area: menu4;
    padding: 0px 0px 0px 90px;
}

.item12 {
    grid-area: content3;
    padding: 0px 10px 0px 10px;
}

.item12 p {
    font-size: 12px;
    text-align: justify;
    color: black;
}

.item13 {
    grid-area: menu5;
    padding: 0px 0px 0px 90px;
}

.item14 {
    grid-area: content4;
    background-color: white;
    padding: 0px 10px 0px 10px;
}

.item14 p {
    font-size: 12px;
    text-align: justify;
    color: black;
}

.item20 {
    grid-area: content5;
    padding: 20px 0px 0px 160px;
}

.item20 h3 {
    color: #F9E203;
    text-align: center;
}

.item20 p {
    color: #F4902E;
    text-align: center;
}

.item21 {
    grid-area: image2;
    background-color: white;
    padding: 5px 0px 0px 40px;
}

.item21 img {
    max-width: 100%;
    height: 338px;
}

.item22 {
    grid-area: form1;
    padding: 0px 10px 0px 40px;
}

input[type=text],
select,
textarea {
    width: 100%;
    padding: 5px;
    border: 0px solid #ccc;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    outline: none;
    box-shadow: 2px 2px 5px #F4902E;
    font-family: 'Garamond', serif;
    font-size: 14px;
    color: #F4902E;
    border-radius: 4px;
    resize: vertical;
}

input[type=submit] {
    background-color: #F9E203;
    color: #F4902E;
    font-family: "Georgia", Times, serif;
    font-weight: bold;
    margin: 10px 0px 0px 300px;
    padding: 7px 10px 5px 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    float: none;
}

input[type=submit]:hover {
    background-color: white;
}

.container {
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 20px;
}

.col-75 {
    float: left;
    width: 75%;
    margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

.item23 {
    grid-area: footer;
    padding: 0px 0px 10px 5px;
}

.item23 p {
    background-color: lavenderblush;
    text-align: center;
    font-size: 10px;
    font-weight: bold;
    color: #F4902E;
}

@media only screen and (max-width: 600px) {
    .item2 img {
        Height: 100px;
        width: auto;
        padding: 0px 0px 0px 20px;
    }

    /* No line break by default (desktop/tablet) */
    .mobile-break {
        display: inline;
    }

    /* Line break on mobile devices (below 768px) */
    @media (max-width: 767px) {
        .mobile-break {
            display: block;
        }
    }

    @media only screen and (max-width: 600px) {
        .item101 {
            background-color: white;
            padding: 0px 0px 0px 0px;
        }

        @media only screen and (max-width: 600px) {
            .item102 {
                background-color: white;
                padding: 0px 0px 0px 0px;
            }

            @media only screen and (max-width: 600px) {
                .item1 {
                    background-color: white;
                    padding: 0px 0px 0px 10px;
                }

                @media only screen and (max-width: 600px) {
                    .item1 img {
                        Height: 40px;
                    }

                    @media only screen and (max-width: 600px) {
                        .item104 {
                            background-color: white;
                            padding: 0px 0px 0px 0px;
                        }

                        @media only screen and (max-width: 600px) {
                            .item104 img {
                                Height: 40px;
                            }

                           @media only screen and (max-width: 600px) {
    .image-wrapper img {
    height: 140px;
}

                                    @media only screen and (max-width: 600px) {
                                        .item6 {
                                            font-size: 13px;
                                            padding: 0px 0px 0px 0px;
                                        }

                                        @media only screen and (max-width: 600px) {
                                            .item7 {
                                                padding: 0px 5px 0px 12px;
                                            }

                                            @media only screen and (max-width: 600px) {
                                                .item8 {
                                                    text-align: left;
                                                    padding: 0px 15px 0px 10px;
                                                }

                                                @media only screen and (max-width: 600px) {
                                                    .item9 {
                                                        padding: 0px 5px 0px 12px;
                                                    }

                                                    @media only screen and (max-width: 600px) {
                                                        .item10 {
                                                            text-align: left;
                                                            padding: 0px 15px 0px 10px;
                                                        }

                                                        @media only screen and (max-width: 600px) {
                                                            .item11 {
                                                                padding: 0px 5px 0px 12px;
                                                            }

                                                            @media only screen and (max-width: 600px) {
                                                                .item12 {
                                                                    text-align: left;
                                                                    padding: 0px 15px 0px 10px;
                                                                }

                                                                @media only screen and (max-width: 600px) {
                                                                    .item13 {
                                                                        padding: 0px 5px 0px 12px;
                                                                    }

                                                                    @media only screen and (max-width: 600px) {
                                                                        .item14 {

                                                                            padding: 0px 15px 0px 10px;
                                                                        }

                                                                        @media only screen and (max-width: 600px) {
                                                                            .item20 {
                                                                                padding: 0px 15px 0px 10px;
                                                                            }

                                                                            @media only screen and (max-width: 600px) {
                                                                                .item21 {
                                                                                    padding: 0px 0px 0px 15px;
                                                                                }

                                                                                @media only screen and (max-width: 600px) {
                                                                                    .item22 {
                                                                                        padding: 0px 0px 0px 8px;
                                                                                    }

                                                                                    @media only screen and (max-width: 600px) {
                                                                                        .item23 {
                                                                                            padding: 0px 15px 0px 10px;
                                                                                        }

                                                                                        /* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
                                                                                        @media screen and (max-width: 600px) {

                                                                                            .item22 .col-25,
                                                                                            .col-75,
                                                                                            input[type=submit] {
                                                                                                width: 90%;
                                                                                                padding: 0px 0px 0px 30px;
                                                                                            }

                                                                                            input[type=submit] {
                                                                                                width: 40%;
                                                                                                height: 30px;
                                                                                                text-align: center;
                                                                                                padding: 0px 0px 0px 0px;
                                                                                                margin: 10px 0px 0px 100px;
                                                                                            }

                                                                                            @media only screen and (max-width: 600px) {
                                                                                                .item2 {
                                                                                                    grid-area: 1 / span 6;
                                                                                                }

                                                                                                .item3 {
                                                                                                    grid-area: 2/ span 6;
                                                                                                }

                                                                                                .item1 {
                                                                                                    grid-area: 3/ span 1;
                                                                                                }

                                                                                                .item101 {
                                                                                                    grid-area: 3/ span 2;
                                                                                                }

                                                                                                .item104 {
                                                                                                    grid-area: 3/ span 2;
                                                                                                }

                                                                                                .item102 {
                                                                                                    grid-area: 3/ span 1;
                                                                                                }

                                                                                               .image-scroller {grid-area: 4 / span 6;}

                                                                                                .item6 {
                                                                                                    grid-area: 5/ span 6;
                                                                                                }

                                                                                                .item7 {
                                                                                                    grid-area: 6/ span 6;
                                                                                                }

                                                                                                .item8 {
                                                                                                    grid-area: 7/ span 6;
                                                                                                }

                                                                                                .item9 {
                                                                                                    grid-area: 8/ span 6;
                                                                                                }

                                                                                                .item10 {
                                                                                                    grid-area: 9/ span 6;
                                                                                                }

                                                                                                .item11 {
                                                                                                    grid-area: 10/ span 6;
                                                                                                }

                                                                                                .item12 {
                                                                                                    grid-area: 11/ span 6;
                                                                                                }

                                                                                                .item13 {
                                                                                                    grid-area: 12/ span 6;
                                                                                                }

                                                                                                .item14 {
                                                                                                    grid-area: 13/ span 6;
                                                                                                }

                                                                                                .item20 {
                                                                                                    grid-area: 14/ span 6;
                                                                                                }

                                                                                                .item22 {
                                                                                                    grid-area: 15/ span 6;
                                                                                                }

                                                                                                .item21 {
                                                                                                    grid-area: 16/ span 6;
                                                                                                }

                                                                                                .item23 {
                                                                                                    grid-area: 17/ span 6;
                                                                                                }
 }