@media screen and (width: 375px) and (height: 667px) {
    /*iPhone SE 375 x 667 */
    /*iPhone 12 Pro 390 x 844 */
    /*Samsung Galaxy S8 360 x 740 */
    /* Samsung Galaxy Z Fodl 5 344 X 882*/
    body {
        background-color: whitesmoke !important;
        padding: 0 0 0 0;
        overflow: scroll;
        /*       scrollbar-color: yellow;
        scrollbar-width:unset;*/
    }

    .ForGrid {
        /*            border-top: thin solid #808080;*/
        border-left: none;
        border-right: none;
        border-top: thin solid #b0c7d3;
        border-bottom: thin solid #b0c7d3;
    }

    .extendMsgBox {
        overflow-y: scroll;
    }

    .rowLineBorders {
        border-left: none;
        border-right: none;
        border-top: thin solid #b0c7d3;
        border-bottom: thin solid #b0c7d3;
    }

    #topNav {
        visibility: hidden;
        position: absolute;
        top: 0px;
        width: 100vw;
    }

    #topNavSmall {
        visibility: visible;
        position: absolute;
        top: 0px;
        width: 100vw;
        z-index:3;
    }

    #dvCompany {
        background-color: whitesmoke;
        display: none;
    }

    /* Hide scrollbar in Webkit browsers */
    ::-webkit-scrollbar {
        display: none;
    }


    #lblCompanyName {
        color: white;
        font-size: 1em;
    }


    #nvMain {
        display: none;
        padding-left: 30px;
    }

    #nvColl {
    }

    .colStyle {
        display: inline-block !important;
        /*background-color: Yellow;*/
        min-width: 100%;
        max-width: 100%;
        align-self: center;
        margin-left: auto;
        margin-right: auto;
        vertical-align: top;
    }

    .colStyle2 {
        display: inline-block !important;
        background-color: Yellow;
        min-width: 100vw;
        max-width: 100vw;
        align-self: center;
        margin-left: auto;
        margin-right: auto;
        vertical-align: top;
    }

    #primaryBox {
        place-items: center;
        justify-content: center;
        width: 100%;
        margin: auto;
        height: fit-content;
        position: relative;
        top: 50px;
        z-index: 1;
    }

    #primaryBox2 {
        place-items: center;
        justify-content: center;
        width: 100%;
        margin: auto;
        height: fit-content;
        position: relative;
        top: 60px;
        z-index: 1;
    }

    #secondaryBox {
        display: inline-block !important;
        /*        background-color: red;*/
        justify-content: center;
        width: 100%;
        margin: auto;
        height: fit-content;
    }

    #btnNext {
        width: 90vw;
        text-align: center;
        align-content: center;
        align-items: center;
    }

    /*New Here*/
    .myCardHeader {
        background-color: black;
        color: white;
    }
    /*New Here*/
    a {
        color: black;
        text-decoration: none;
    }

    .box {
        /*        background-color: hotpink;*/
        padding: 0 0 0 0;
        margin: 0 0 0 0;
        min-width: 100vw !important;
        max-width: 100vw !important;
        display: flex;
        flex-wrap: wrap;
        margin-top: auto;
        flex: 1;
        overflow-y: auto;
        flex-direction: row;
        justify-content: center;
        align-content: flex-start;
        margin-left: -8px;
        overflow: scroll;
        scrollbar-width: none;
        /*       display: none;*/
    }

        .box > * {
            flex: 1;
        }

    .card {
        min-width: 80vw !important;
        max-width: 80vw !important;
        max-height: fit-content;
        min-height: fit-content;
        margin-left: 12px;
        margin-bottom: -2px;
        display: flex;
        margin-top: 12px;
        border-right: none;
        border-radius: 0;
        border-bottom: none;
        border-color: #0094ff !important;
        box-shadow: 4px 5px 5px #a7d3f3;
        border-left: solid thin #d8e3eb !important;
    }

    /*New Here*/
    .cardImage {
        max-width: 90vw !important;
        min-width: 90vw !important;
        max-height: 180px !important;
        min-height: 180px !important;
        margin-left: 12px;
        margin-bottom: -2px;
        display: flex;
        margin-top: 12px;
        box-shadow: 4px 5px 5px #a7d3f3;
        text-align: left;
        border-color: #a7d3f3 !important; /*New*/
        color: black;
        font-family: 'Arial Rounded MT';
        font-weight: bold;
        display: flex;
        text-align: center !important;
        justify-content: center !important;
        vertical-align: middle !important;
        align-content: center !important;
        border: none !important;
    }

    /*New Here*/
    .pTextImage {
        max-width: 90vw !important;
        min-width: 90vw !important;
        margin-bottom: 4px;
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
        border: none !important;
        justify-content: center;
        align-self: center;
        text-decoration: none;
        padding-left: 15px;
        padding-right: 15px;
    }
    /*New Here*/
    .pTextImageDark {
        color: white;
    }

    .pTextImageLight {
        color: black;
    }

    .pTitle_1 {
        font-size: 1.4em;
        /*        color: yellow !important;*/ /*else*/
    }

    .pTitle_2 {
        font-size: 1.4em;
        /*        color: yellow !important;*/ /*> 60 And Len(hyp.Text) < 81*/
    }

    .pTitle_4 {
        font-size: 1.8em;
        /*        color: yellow !important;*/ /*> 41 And Len(hyp.Text) < 61*/
    }

    .pTitle_6 {
        font-size: 2.3em; /*> 29 And Len(hyp.Text) < 42*/
        /*        color: yellow !important;*/
    }

    .pTitle_8 {
        font-size: 2.5em; /*<30*/
        /*        color:green !important;*/
    }

    .pHeader {
        font-size: .9em;
        font-weight: 500;
        max-width: 100%;
        min-width: 100%;
        max-height: fit-content;
        min-height: fit-content;
        padding-left: 2px;
        padding-right: 24px;
        border-right: none;
        border-bottom-color: #0094ff;
        border-bottom-style: outset !important;
        border-bottom-width: medium;
        text-decoration: none;
        color: black;
        text-align: center;
    }

        .pHeader a {
            font-size: .9em;
            width: 90vw;
            max-width: fit-content !important;
            min-width: fit-content !important;
            max-height: fit-content !important;
            min-height: fit-content !important;
            margin-left: 4px;
            border-bottom: thick !important;
            border-bottom-color: royalblue !important;
            color: white;
            margin-left: 30px;
            text-decoration: none;
            border-bottom-left-radius: 0px !important;
        }

    .pText {
        font-size: .8em;
        min-width: 100%;
        max-width: 100%;
        max-height: fit-content;
        min-height: fit-content;
        padding-left: 4px;
        padding-right: 24px;
        text-decoration: none;
        border-top: blue;
        font-weight: 300;
        letter-spacing: .5px;
        color: black;
        font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    }

        .pText a {
            text-decoration: none;
        }

    p {
        font-size: 3vmin;
    }


    small {
        font-size: 3vmin;
    }

    .cardListGroup {
        border-color: red;
    }

    .list-group {
        border-color: blue;
    }
}