form, body, html {
    font-size: 12px !important;
    font-family: Oswald, sans-serif, Noto Sans;
    margin: 0px;
    padding: 0px;
    /* height: 100%;*/
    width: 100%;
    background-color: darkgray;
    scroll-behavior: smooth;
}

    html .t-container-fluid,
    html .t-row-wrap > .t-row {
        max-width: none !important;
        padding: 0;
        margin: 0;
        height: 100%;
        height: 100%;
    }

.surveytitle {
    font-family: Oswald, sans-serif, Noto Sans;
    text-align: center;
    font-weight: normal !important;
    font-size: medium;
    color: #2b506e !important;
}

.surveythankyou {
    font-family: Oswald, sans-serif, Noto Sans;
    text-align: center;
    font-weight: normal !important;
    font-size: 14px;
    color: #262626;
}

.survey1 {
    font-family: Oswald, sans-serif, Noto Sans;
    text-align: justify;
    font-weight: normal !important;
    font-size: 14px;
    color: #262626;
}

        .survey1 input[type="radio"] {
            margin-top: 12px;
        }

        .divquestionaire {
            background-color: #f2f2f2;
            box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
            margin-top: 10px;
            margin-left: 1px;
            margin-right: 1px;
            padding: 8px;
            padding-bottom: 10px;
            border-width: thin;
            border-radius: 10px;
            border-color: #f2f2f2;
            border-style: solid;
        }
.mode {
    padding: 8px;
    color: #2b506e;
    white-space: nowrap;
    text-align: center;
    margin-bottom: 8px;
    font-size: 20px;
    border-radius: 16px;
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.floatright {
    float: right;
    margin-top: 10px;
    vertical-align: middle !important;
    margin-right: 10px;
}


.btnoptions {
    width: 100%;
    text-align: center;
    padding: 10px;
    font-family: Oswald, sans-serif, Noto Sans;
    font-size: medium;
    color: #2b506e;
    margin: 2px;
    background-color: white;
    border-style: solid;
    border-width: thin;
    border-color: silver;
    border-radius: 15px;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}


    .btnoptions:hover {
        box-shadow: rgba(255, 255, 255, .2) 0 3px 15px inset, rgba(0, 0, 0, .1) 0 3px 5px, rgba(0, 0, 0, .1) 0 10px 13px;
        transform: scale(1.03);
        transition: all .3s;
    }



.opacityPulse-css {
    animation: opacityPulse 5s ease-out;
    animation-iteration-count: infinite;
    opacity: 10;
}

@-webkit-keyframes opacityPulse {
    0% {
        opacity: 0.3;
        color: black;
    }

    50% {
        opacity: 1.0;
    }

    100% {
        opacity: 0.8;
        color: black;
    }
}




.txtbox2 {
    font-family: Oswald, sans-serif, Noto Sans;
    border-color: rgb(3, 102, 214) !important;
    border-radius: 4px;
    border-width: 1px !important;
    padding: 6px;
    font-size: 14px;
    width: 100%;
    transition: box-shadow 300ms ease-out;
    /*  -moz-box-shadow: 0 0 8px rgba(82,168,236,.6); */
    /*box-shadow: 0 0 8px rgba(82,168,236,.6) !important; */
    /* box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;*/
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em;
}


    .txtbox2:focus {
        border-color: rgba(82,168,236,.8);
        outline: 0;
        outline: thin;
    }

.txtbox {
    opacity: 1 !important;
    font-family: "Oswald script=latin rev=2", sans-serif !important;
    border-color: rgb(3, 102, 214) !important;
    border-style: solid;
    border-width: 1px;
    font-weight: normal !important;
    border-radius: 4px;
    transition: box-shadow 300ms ease-out;
    width: 100%;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em;
    /*  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgb(209, 213, 219) 0px 0px 0px 1px inset;*/
    /*  box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;*/
    /*  box-shadow: rgb(3, 102, 214) 0px 0px 0.5px 0.5px !important; */
}




body .Mywrapper2 .rddlList,
body .Mywrapper2 .rddlItem,
body .Mywrapper2 .rddlInner,
body .Mywrapper2 .rddlItemSelected {
    font-family: Oswald, sans-serif, Noto Sans !important;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em !important;
    border-color: rgb(3, 102, 214) !important;
    font-size: 14px !important;
}


body .Mywrapperdrop .rcblList,
body .Mywrapperdrop .rrblItem,
body .Mywrapperdrop .rcbInner,
body .Mywrapperdrop .rcblItemSelected {
    font-family: Oswald, sans-serif, Noto Sans !important;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em !important;
    border-color: rgb(3, 102, 214) !important;
    font-size: 14px !important;
}



body .Mywrapper .riTextBox,
body .MyWrapper .riHover,
body .MyWrapper .riError,
body .MyWrapper .riNegative
body .Mywrapper .riEnabled,
body .Mywrapper .riDisplay {
    font-family: Oswald, sans-serif, Noto Sans !important;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em !important;
    border-color: rgb(3, 102, 214) !important;
    border-width: thin;
    font-size: 14px;
    font-weight: normal !important;
}


.highlight {
    color: black;
}

.RadLabel_Bootstrap {
    font-family: Oswald, sans-serif, Noto Sans !important;
}

body .MyWrapper .riFocused {
    font-family: Oswald, sans-serif, Noto Sans !important;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em !important;
    border-color: rgba(82,168,236,.8);
    font-size: 14px;
}






body .MyWrapper3 .riTextBox,
body .MyWrapper3 .riHover,
body .MyWrapper3 .riError,
body .MyWrapper3 .riNegative
body .Mywrapper3 .riEnabled,
body .Mywrapper3 .riDisplay {
    font-family: Oswald, sans-serif, Noto Sans !important;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em !important;
    border-color: rgb(3, 102, 214) !important;
    border-width: thin;
    font-size: 18px;
    font-weight: normal !important;
    border-radius: 4px;
}



body .MyWrapper3 .riFocused {
    font-family: Oswald, sans-serif, Noto Sans !important;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em !important;
    border-color: rgba(82,168,236,.8);
    font-size: 18px;
    border-radius: 4px;
}

.btnpayoptions {
    width: 100%;
    text-align: center;
    padding: 10px;
    font-family: Oswald, sans-serif, Noto Sans;
    font-size: medium;
    color: #2b506e;
    margin: 2px;
    border-style: solid;
    border-width: thin;
    border-color: silver;
    border-radius: 10px;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}

.btnpaypal {
    max-width: 250px;
    border-style: solid;
    border-width: thin;
    border-color: transparent;
    border-radius: 4px;
    text-align: center;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    background-color: white;
    width: 100%;
    height: auto;
    font-size: medium;
    color: white;
    padding: 11px;
    background-image: url('../img/pp.png');
    background-repeat: no-repeat;
    background-position: center;
}

.btnapay {
    max-width: 250px;
    border-style: solid;
    border-width: thin;
    border-color: transparent;
    border-radius: 4px;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
    background-color: white;
    width: 100%;
    height: auto;
    font-size: medium;
    color: white;
    padding: 11px;
    background-image: url('../img/apay.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 78px 36px;
}

.btngpay {
    max-width: 250px;
    border-style: solid;
    border-width: thin;
    border-color: transparent;
    border-radius: 4px;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
    background-color: black;
    width: 100%;
    height: auto;
    font-size: medium;
    color: white;
    padding: 11px;
    background-image: url('../img/gpay.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 75px 32px;
}


.btncard {
    border-style: solid;
    border-width: thin;
    border-color: transparent;
    border-radius: 4px;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
    background-color: #023064;
    width: 100%;
    font-family: Oswald, sans-serif, Noto Sans;
    height: auto;
    font-size: medium;
    color: white;
    padding: 11px;
    background-blend-mode: difference;
    background-image: url('../img/blankcard.png');
    text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
    background-repeat: no-repeat;
    background-position-x: 18%;
    background-position-y: 6px;
    background-size: 45px 32px;
}

.btncheq {
    border-style: solid;
    border-width: thin;
    border-color: transparent;
    border-radius: 4px;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    width: 100%;
    font-family: Oswald, sans-serif, Noto Sans;
    text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
    height: auto;
    font-size: medium;
    color: #2b506e;
    padding: 11px;
    background-color: whitesmoke;
    background-image: url('../img/cheq.png');
    text-align: center;
    background-repeat: no-repeat;
    background-position-x: 18%;
    background-position-y: 4px;
    /*  background-position-x: 38px;
    background-position-y: 4px; */
    background-size: 50px 35px;
}


.schedulegroup {
    background: white !important;
    padding: 0px !important;
    width: 100%;
    position: relative;
    float: left;
    max-width: 600px;
    display: block;
    white-space: nowrap;
}

.Initialsched {
    display: block;
    font-family: Oswald, sans-serif, Noto Sans;
    width: 100%;
    background-color: white;
    border-style: none !important;
    float: left;
}

.leftContainer {
    width: 85%;
    max-width: 600px;
    margin: 0 auto;
    position: relative;
    padding: 0px;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    border-radius: 16px;
    font-family: 'Roboto';
    background: #ffffff;
    z-index: 999 !important;
    opacity: 10 !important;
    float: right;
    margin-top: 10px;
    height: 625px;
}





.featuredimage {
    margin-top: 2px !important;
    padding-top: 7px !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
    border-radius: 16px;
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;   
    background-color:white;
}

   #imgmain {    
        object-fit:contain;
        max-height:275px;
    }


.logo1 {
    padding-top: 5px;
    padding-left: 10px;
    height: 50px;
    width: 55px;
    vertical-align: top;
    margin-top: 5px;
    margin-bottom: 10px;
}

.img1 {
    width: 100%;
    height: 100%;
    object-fit: contain;
    max-height: 320px;
}



.img2 {
    width: 100%;
    height: 100%;
}

.featuredimage2 {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: black;
}

    .featuredimage2 :hover {
        box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    }



.featuredmessage {
    font-size: 13px;
    padding: 14px;
    margin-left: 10px;
    margin-right: 10px;
    text-align: justify;
}
/**cards*/

.flag {
    background-repeat: no-repeat;
    background-image: url('../img/bg-flag2.png');
    background-size: cover;
}

.fullheight {
    vertical-align: top;
    /* height: 57.5vh; */
    height: 100%;
}

#div1 {
    height: 57.5vh;
}

#div1b {
    height: 57.5vh;
}

.bottom {
    position: absolute !important;
    bottom: 0px !important;
    width: 100%;
}




.upsellmsg {
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 25px;
    text-align: left;
    font-size: 18px;
    color: black;
}


.navbutton {
    background-color: steelblue !important;
    border-style: none !important;
    color: white !important;
    border-radius: 0px !important;
    padding: 10px;
    font-size: 16px !important;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    animation: pulse 2s infinite;
    
}





@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1, 1.2);
    }

   70% {
        transform: scale(1, 1.3);
    } 

    100% {
        transform: scale(1);
    }
}

.hidden {
    visibility: hidden !important;
}

.show {
    visibility: visible !important;
}

.back {
    Font-Size: 24px;
    background-color: transparent;
    border-style: none !important;
    text-align: center !important;
    margin-left: 10px;
    color: maroon;
}

.card-bounding {
    /*  background: linear-gradient(to right, transparent, silver);*/
    width: 100% !important;
    /* max-width: 550px;*/
    margin: 0 auto;
    position: relative;
    font-size: medium;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
    border-radius: 16px;
    font-family: 'Roboto';
    z-index: 999 !important;
    background-color: white;
    float: left;
    overflow: hidden;
    margin-top: 10px;
    height: 625px;
}

    .card-bounding:hover {
        box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    }

    .card-bounding aside {
        /*  font-size: 24px; */
        padding-bottom: 8px;
    }

.card-container {
    width: 100%;
    padding-left: 80px;
    padding-right: 40px;
    position: relative;
    /*  box-sizing: border-box; */
    /*  border: 1px solid #ccc; */
    /*  margin: 0 auto 30px auto;*/
    padding-bottom: 2px;
}

    .card-container input {
        width: 100%;
        letter-spacing: 1px;
        /*   font-size: 30px; */
        padding: 15px 15px 15px 25px;
        border: 0;
        outline: none;
        /*  box-sizing: border-box;  */
    }

.card-type {
    width: 62px;
    height: 49px;
    background: url("../img/blankcard.png");
    background-size: 55px 40px;
    background-repeat: no-repeat;
    /*  position: absolute; */
    /* top: 1px; */
    left: 4px;
    margin: 3px;
}

    .card-type.mastercard {
        background: url("../img/mc.png");
        background-repeat: no-repeat;
        background-position: 0 -10px;
    }

    .card-type.visa {
        background: url("../img/visa.png");
        background-repeat: no-repeat;
        background-size: 60px 50px;
    }

    .card-type.amex {
        background: url("../img/amex.png");
        background-repeat: no-repeat;
    }

    .card-type.discover {
        background: url("../img/discover.png");
        background-repeat: no-repeat;
        background-size: 59px 49px;
    }


    .card-type.diners_club_carte_blanche {
        background: url("../img/diners.jpg");
        background-repeat: no-repeat;
        background-size: 50px 40px;
    }

    .card-type.diners_club_international {
        background: url("../img/diners.jpg");
        background-repeat: no-repeat;
        background-size: 50px 40px;
    }

    .card-type.jcb {
        background: url("../img/jcb.png");
        background-repeat: no-repeat;
        background-size: 59px 49px;
    }

.card-valid {
    text-align: left;
    padding-left: 5px;
    line-height: 40px;
    font-size: 25px;
    font-weight: bold;
    font-family: 'icons';
    color: transparent;
    visibility: hidden;
}

    .card-valid.active {
        color: #42ca7c;
        visibility: visible !important;
    }

.card-details {
    width: 100%;
    text-align: left;
    /*   margin-bottom: 30px;*/
    transition: 300ms ease;
}

    .card-details input {
        font-size: 30px;
        padding: 15px;
        /*   box-sizing: border-box; */
        width: 100%;
    }

        .card-details input.error {
            border: 1px solid #c2313c;
            /*   box-shadow: 0 4px 8px 0 rgba(238,76,87,0.3); */
            outline: none;
        }

    .card-details .expiration {
        width: 50%;
        float: left;
        padding-right: 5%;
    }

    .card-details .cvv {
        width: 45%;
        float: left;
    }

.active {
    visibility: visible;
}

.inactive {
    visibility: hidden;
}

.paygroup {
    display: flex;
    white-space: nowrap;
    width: 100%;
}

.InitialSub {
    display: block;
    padding: 10px;
    float: left;
    font-family: Oswald, sans-serif, Noto Sans;
    font-size: medium;
    background-color: white;
    color: #2b506e;
    margin: 2px;
    max-width: 610px;
    width: 100%;
    border-style: solid;
    border-width: thin;
    border-color: silver;
    border-radius: 18px;
}

    .InitialSub:hover {
        color: white;
        font-family: Oswald, sans-serif, Noto Sans;
        font-size: medium;
        transition: all 0.25s ease-in-out;
        background-color: #4078a5;
        border-radius: 18px;
    }

.ClickedSub {
    float: left;
    padding: 10px;
    display: block;
    font-family: Oswald, sans-serif, Noto Sans;
    font-size: medium;
    background-color: #2b506e;
    border-radius: 18px;
    color: white;
    margin: 2px;
    max-width: 610px;
    width: 100%;
    border-style: solid;
    border-width: thin;
    border-color: #2b506e;
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
    /* box-shadow: rgba(1,60,136,.5) 0 -1px 3px 0 inset,rgba(0,44,97,.1) 0 3px 6px 0; */
}

.fontbold {
    font-weight: bold !important;
    color: #2b506e !important;
}

.CheckBox {
    color: #325d81;
}

.tabs {
    width: 100%;
    border-radius: 12px;
    color: white;
    text-align: center !important;
    font-size: 15px;
    background-color: transparent;
}

.txtamount {
    font-size: 22px;
    color: steelblue;
}

.txtamount_freq {
    font-size: 18px;
    color: gray;
}

.socialmedia {
    font-size: large !important;
    border-style: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

.divsocialmedia {
    bottom: 0px;
}

.breakdown {
    width: 100%;
    padding-left: 14%;
    padding-right: 14%;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.fees {
    box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px;
    background-color: #6c9dc6;
    border-style: solid;
    border-width: thin;
    border-color: #6c9dc6;
    /*box-shadow: rgba(1,60,136,.5) 0 -1px 3px 0 inset,rgba(0,44,97,.1) 0 3px 6px 0;*/
    color: black;
    white-space: nowrap !important;
    margin-top: 45px;
    margin-left: 50%;
    transform: translate(-50%, -50%);
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 6px;
    width: 88%;
    text-align: center;
}

.w3-padding-group {
    padding: 12px 16px !important;
    vertical-align: middle;
}


.header-shadow {
    width: 100%;
    opacity: 1;
    /*/ border-style: none;
    border-bottom-style: solid;
    border-bottom-width: thin;*/
    /*box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;*/

    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
    /*  border-bottom-color: silver;*/
    /*  box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5); */
}


#header1 {
    margin-top: 4%;
}

.footer {
    width: 100% !important;
    max-width: 85%;
    padding-top: 5%;
    margin: 0 auto;
    position: relative;
    color: black;
    font-size: 11px;
}

/* iphone se*/
@media (max-width: 320px) {
    .card-bounding {
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
        height: auto; /* 578px;*/
    }

    .mode {
        padding: 6px;
    }




    #h4a {
        font-size: 16px !important;
    }

    #useof {
        font-size: 12px;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    .filler {
        height: 50px;
    }

    #root {
        min-height: calc(100vh - 10px);
    }


   
    


}

/*iphone 6/7/8/se*/
@media (max-width: 375px) {

    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
    }


    .mode {
        padding: 6px;
    }


    .floatright {
        float: right;
        margin-top: 6px;
        margin-right: 10px;
    }




    .bottom {
        margin-top: 10px;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    .breakdown {
        width: 100%;
        padding-left: 14%;
        padding-right: 14%;
        margin-bottom: 15%;
    }

    .filler {
        height: 50px;
    }

    

    /*   .fullheight {
        min-height: calc(100vh - 10px);
    } */
}





/*galaxy note*/
@media (max-width: 412px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 16px;
        margin-top: 0px;
    }

    .bottom {
        margin-top: 6%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    .breakdown {
        width: 100%;
        padding-left: 14%;
        padding-right: 14%;
        margin-bottom: 15%;
    }

    .filler {
        height: 100px;
    }
 
}




/*iphone 6/7/8 plus*/
@media (max-width: 414px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    .filler {
        height: 100px;
    }

 
}
/**surface duo */
@media (max-width: 540px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    .filler {
        height: 100px;
    }

 
}



/*iphone se landscape*/
@media (max-width: 568px) {
    .card-bounding {
        width: 100%;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
        height: auto;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    #imgmain {
        object-fit: contain;
        max-height: 225px;
    }
}


@media (max-width: 600px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    #imgmain {
        object-fit: contain;
        max-height: 225px;
    }
}


@media (max-width: 653px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    .filler {
        height: 100px;
    }
 
}


@media (max-width: 667px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
        width: 100%;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }

    .filler {
        height: 100px;
    }
}

@media (max-width: 760px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
        width: 100%;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }


    .filler {
        height: 100px;
    }
}
/*
@media (max-width: 800px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
        width:100%;
    
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }
}
*/

@media (max-width: 883px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
        height: auto;
        width: 100% !important;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }
}



@media screen and (max-width: 915px), screen and (max-height: 412px) {
    .card-bounding {
        height: auto;
        border-style: none;
        box-shadow: none;
        border-radius: 0px;
        margin-top: 0px;
        height: auto;
        width: 100% !important;
    }

    .bottom {
        margin-top: 3%;
        position: relative !important;
        bottom: 0 !important;
        width: 100%;
    }
}