﻿@media (min-width:768px) /*In this CSS code,
    we are targeting screens with a minimum width of 768px.
    If the screen is more than or equal to 768px wide,
    the body code will run.*/
{

    /* START CODE IS FOR SIDE BY SIDE DIVS */
    /* code to adjust <div> margin START */
    .divMarginAdjustContact {
        /*border:solid red 1px;*/
        width: 60%;
        margin-right: 5px;
        margin-top: 20px;
        /*border: 1px solid red;*/
    }

    .divMarginAdjustContact2 {
        /*border:solid red 1px;*/

        width: 160%;
        margin-left: -40%;
        margin-top: 20px;
        /*border: 1px solid red;*/
    }

    .responsive-two-column-grid-contact {
        display: block;
    }

        /* columns */
        .responsive-two-column-grid-contact > * {
            padding: 1rem;
        }

    #head1 {
        margin-left: 10px;
    }


    /* tablet breakpoint */



    .responsive-two-column-grid-contact {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}




    @media (max-width: 768px) /*In this CSS code,
    we are targeting screens with a maximum width of 768px.
    If the screen is less than or equal to 768px wide,
    the body code will run.-------------------------
    ---------------------------------------------------------
    ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
       ---------------------------------------------------------------------------------------------------------------
*/
    {

        .responsive-two-column-grid-contact {
            display: grid;
            grid-template-columns: 1fr;
        }

        .divMarginAdjustContact {
            /*border:solid red 1px;*/
            width: 100%;
            margin-top: 20px;
            /*border: 1px solid red;*/
        }

        .divMarginAdjustContact2 {
            /*border:solid red 1px;*/

            width: 100%;
            margin-top: 20px;
            /*border: 1px solid red;*/
        }
    }
