﻿@charset "utf-8";
/* CSS Document */

/* #### Mobile Phones Portrait #### */
@media screen and (max-width: 480px){
.customerDB .DBbottomBoxs .col-lg-3.col-sm-4.col-xs-6{ width:100%;}
.customerDB .DBbottomBoxs .col-lg-3.col-sm-4.col-xs-6 img{ height:auto!important; max-height:350px; min-height:200px;}
.col-myxs-6{ width:100%; float:left;}
.customerDB .coverBanner img{ min-height:220px!important;}
.GiftreportType_boxes .amount_item_container{ width:100%;}
.user-menu .user-header{ display:none;}

#ContentPlaceHolder1_divProductMapping .form-control div {width: 100% !important;}
#ContentPlaceHolder1_divProductMapping .form-control div input {margin: 10px !important;}
.form_row_1 div {width: 100%; margin: 0 !important;}


/*===== 9/5/2018 =====*/

.header-section .input-group div {width: 100% !important;display: inherit;margin-bottom: 5px !important;}
.input-group-btn {width: 100% !important;display: inherit;margin-bottom: 5px;padding-left: 0 !important;}
input {margin-bottom: 5px !important;}
#asideSiteMaster {margin-top: 130px;}
.ibtabs #myTab li {width: 100%;background: #ccc;}
.jumbotron_cloud {padding: 40px 40px !important;}
.jumbotron.jumbotron_cloud.loyalty-pro {padding: 40px 40px !important;}
#ContentPlaceHolder1_ucCommonDateFilter_rbtlstCategory tbody tr {display: inline-grid;}


}

/* #### Mobile Phones Portrait or Landscape #### */
@media screen and (max-width: 640px){

.customerDB .ExclusiveGift_CardEVoucher,
.customerDB .ExclusiveGift_CardPoints{ background-size:100% auto!important; width:100%!important; height:110px!important;}
.panel.panel-default.panel-1 .panel-body{width:auto !important;}
.searchby-left #ContentPlaceHolder1_txtSeacrh{width: 100% !important;margin-left: 0 !important;}
.connectedSortable-overflow{width: 100% !important;overflow: auto !important;}
.connectedSortable .connectedSortable .exportExel{position: unset !important; padding-left: 15px;}
    .mapping .col-md-2 {padding-right: 34px;padding-left: 30px;width: 100%;float: left;margin-bottom: 10px;}  
    .mapping .col-md-1 {clear: both;text-align: center;background: #dcdada;margin: 0 10px; padding: 10px 0 5px;}
    
    
}


/* #### Tablets Portrait or Landscape #### */
@media screen and (min-device-width:768px) and (max-device-width:992px){
.customerDB .CDBox .col-xs-7.bgimage{background-size:100% 100%;}
.customerDB .left-side.sidebar-offcanvas .sidebar.menu{ margin-top:0;}

/*===== 9/5/2018 =====*/

.col-md-4.col-sm-6 {margin-bottom: 5px;}
.jumbotron.jumbotron_cloud .col-md-2.col-sm-2.col-xs-2.action_icon h5 {text-align: right;margin: 0;font-size: 18px;line-height: 2;}
.jumbotron.jumbotron_cloud .col-md-10.col-sm-10.col-xs-10 span {font-size: 18px;}



div.loyalty-pro-tab ul.main-top-tab li { width: 50%;}
div.loyalty-pro-tab {clear: both;margin-top: 0;padding-top: 10px;}


}
@media screen and (min-device-width:641px) and (max-device-width:992px)
{
    .mapping .col-md-2 {padding-right: 0;padding-left: 20px;width: 32.5%;float: left; margin-bottom: 10px;}
    .mapping .col-md-1 {clear: both;text-align: center;background: #dcdada;margin: 0 10px;padding: 10px 0 5px;}
}
@media screen and (min-device-width:768px)
{
    .customerDB .CDBox .col-xs-7.bgimage{background-size:100% 100%!important;}    
    }
custom-sm-well .btn, .custom-sm-well .form-control, .custom-sm-well .input-group {
        margin-bottom:0;
    }
@media screen and (max-device-width:767px)
{
div.no-print{display:none;}
.membership_card_containerboxes{max-height:140px!important;}
.customerDB .left-side.sidebar-offcanvas .sidebar.menu{ margin-top:0;}
.customerDB .CDBox .col-xs-7.bgimage{background-size:100% auto;}
.customerDB .CDBox .colorbox, .customerDB .redeemable .bgimage,.customerDB .redeemPoints .bgimage,.customerDB .Card_eVoucher .bgimage,
.customerDB .Gifting .bgimage{ min-height:100px!important;}
.customerDB .content .counts{ font-size:38px;}
.customerDB .myactivity{ padding:10px 20px;}
.customerDB .header .logo{ display:none;}
.customerDB .redeemPoints .colorbox::after, .customerDB .redeemable .colorbox::before  { top: 50%!important;}
.customerDB .redeemable .colorbox::after, .customerDB .redeemable .colorbox::before{top:50%;}
.customerDB .content .counts{ margin-top:20px!important;}
.round-icon-wrp .glyphicon, .round-icon-wrp .fa{margin-top: -15px; padding: 50% 0 0;}
.round-icon-wrp{background: #fff;border-radius: 50%; font-size: 30px; height:80px;left: 50%; margin:-40px 0 0 -40px;padding: 0; position: absolute; text-align: center; top: 50%; width: 80px;}
.input-group{ width:100%;}
.panel-primary-new .over-flow{overflow: auto;}
.wrapper #myForm .row.form_row .col-sm-3.textfield_label{text-align: left !important;}

.dataTables_wrapper > .row{ margin:10px 0;}
.table-striped, .dataTables_wrapper{ min-width:600px;}
div.dataTables_filter input{ width:12em!important;}
.panel.panel-default.panel-1 .panel-body .col-md-7 .col-md-11 .col-md-11 span {padding-left: 0 !important; margin: 0 !important;}
.panel.panel-default.panel-1 .panel-body .col-md-7 .for-res{padding-left: 15px !important;float: left;padding-right: 0 !important;}
.well.promotions .row select { width: 100% !important;}
.well.promotions .row p {width: 100% !important ;}


/*===== 9/5/2018 =====*/

.jumbotron.jumbotron_cloud .col-md-2.col-sm-2.col-xs-2.action_icon h5 {text-align: right;margin: 0;font-size: 15px;line-height: 2.5;}
.jumbotron.jumbotron_cloud .col-md-10.col-sm-10.col-xs-10 span {font-size: 15px;}
.jumbotron_cloud .color_peter_river {font-size: 20px;}
.jumbotron_cloud .secon {font-size: 20px;}

div#ContentPlaceHolder1_ucPager_divPaging .col-xs-6 {width: 100%;text-align: center !important;display: inline-flex;padding-left: 0 !important;margin-bottom: 10px;}
div#ContentPlaceHolder1_divPaging {display: inline-block;}

div.loyalty-pro-tab ul.main-top-tab li { width: 100%;}
div.loyalty-pro-tab {clear: both;margin-top: 0;padding-top: 10px;}

div.loyalty-pro-tab #rootwizard > .tab-content {width: 100%;}
div.loyalty-pro-tab #rootwizard > .nav-tabs { width: 100%;}

select#ContentPlaceHolder1_ddlMode, input#ContentPlaceHolder1_txtcustSearch, select#ContentPlaceHolder1_ddllocation {
    margin: 5px 0;
}


}

@media screen and (max-device-width:560px){
#asideSiteMaster {margin-top: 130px;}
.activity-report .column {width: 100%;}

}


@media screen and (max-device-width:980px){
.customerDB .coverBanner img{ min-height:300px;}
.membership_card_containerboxes:focus .overlay{ background: rgba(0,0,0,0.9); }
.panel.panel-default.panel-1 .panel-body{width: 350px;margin: 0 auto;}
.panel.panel-default.panel-1 .panel-body .col-md-7 .col-md-11 .col-md-11 span {padding-left: 0 !important; margin: 0 !important;}
.panel.panel-default.panel-1 .panel-body .col-md-7 .for-res{padding-left: 15px !important;float: left;padding-right: 0 !important;}

.col-md-1.app-clear {clear: both;}
.connectedSortable .well.main-first-report .first-report div.well.clearfix {width: 100%;}

div#ContentPlaceHolder1_divPaging input, div#ContentPlaceHolder1_divPaging select {min-height: 35px;}

}

/*@media screen and (max-width: 999px)
{
    .table-responsive-new .jumbotron .col-sm-9 .row.form_row:nth-child(5){position: inherit !important;} 
}*/    

@media screen and (min-width:1100px){

.SelectOption:hover{ background:#FFFEDD;}
.customerDB .CDBox:hover .bgimage .contnt{background:rgba(0,0,0,0.8);}
.membership_card_containerboxes:hover .overlay{ background: rgba(0,0,0,0.9); }


}

img{ max-width:100%;}

/* =========== Defauly page Style by Jk Apr 2022 ===============*/

.new-form {
    width: 40%;
    height: 300px;
    background-color: white;
    margin: 13% auto;
    border-radius: 10px;
    position: relative;
}

.logo-place {
    position: absolute;
    padding: 10px;
    z-index: 1;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
}

.round-1 {
    height: 117px;
    width: 90%;
    background-color: #072e5b;
    margin: 60px 0;
    border-radius: 0 70px 70px 0;
    position: absolute;
}

.round-2 {
    position: absolute;
    height: 100px;
    width: 87%;
    background-color: white;
    margin: 68px 0;
    border-radius: 0 70px 70px 0;
    display: grid;
    align-items: center;
    justify-items: center;
}

#pnlLogin {
    padding: 60px 30px 0 0;
}

.bottom-buttons p {
    color: white;
}

.for-pass-r {
    display: flex;
    justify-content: flex-end;
    padding: 18px 40px;
}

.for-pass-l {
    display: flex;
    justify-content: flex-start;
    padding: 18px 40px;
}


/*============ Default page Responsive by Jk ===================*/

@media screen and (max-width:10000px){

    .new-form {
        width: 25%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 90px 96px;
        z-index: 1;
    }

    .round-1 {
        height: 135px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 118px;
        width: 88%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 65px 30px 0 0;
    }

    .for-passp-r {
        display: flex;
        justify-content: flex-end;
        padding: 18px 40px;
    }

    .for-passp-l {
        display: flex;
        justify-content: flex-start;
        padding: 18px 40px;
    }
}

@media screen and (max-width:1920px) {
    .new-form {
        width: 40%;
        height: 350px;
        background-color: white;
        margin: 6% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 90px 96px;
        z-index: 1;
    }

    .round-1 {
        height: 135px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 118px;
        width: 88%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 65px 30px 0 0;
    }

    .for-passp-r {
        display: flex;
        justify-content: flex-end;
        padding: 18px 40px;
    }

    .for-passp-l {
        display: flex;
        justify-content: flex-start;
        padding: 18px 40px;
    }
}


@media screen and (max-width:1680px) {
    .new-form {
        width: 40%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 83px 70px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:1600px) {
    .new-form {
        width: 40%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 85px 68px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:1400px) {
    .new-form {
        width: 40%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height:100%;
        margin: 83px 30px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:1366px) {
    .new-form {
        width: 40%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 83px 30px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:1280px) {
    .new-form {
        width: 40%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 90px 30px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:1200px) {
    .new-form {
        width: 60%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 90px 30px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:1024px) {
    .new-form {
        width: 60%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 90px 30px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:992px) {
    .new-form {
        width: 60%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 90px 30px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}





@media screen and (max-width:800px) {
    .new-form {
        width: 80%;
        height: 300px;
        background-color: white;
        margin: 13% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 90px 75px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 60px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 68px 0;
        border-radius: 0 70px 70px 0;
    }

    #pnlLogin {
        padding: 60px 30px 0 0;
    }
}


@media screen and (max-width:768px) {
    .new-form {
        width: 80% !important;
        height: 260px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 25px 30px 0 10px;
    }
}


@media screen and (max-width:700px) {
    .new-form {
        width: 60% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 88%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }
}


@media screen and (max-width:600px) {
    .new-form {
        width: 60% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 88%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }
}


@media screen and (max-width:576px) {
    .new-form {
        width: 60% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 88%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }
}


@media screen and (max-width:480px) {
    .new-form {
        width: 80% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        width: 70%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 88%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }
}


@media screen and (max-width:428px) {
    .new-form {
        width: 80% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        width: 70%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 88%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }
}


@media screen and (max-width:412px) {
    .new-form {
        width: 80% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        width: 70%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 88%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }
}


@media screen and (max-width:376px) {
    .new-form {
        width: 80% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        width: 70%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }

    .bottom-buttons p {
        text-align: left;
        padding: 25px 0 0 10px;
        color: white;
    }
}


@media screen and (max-width:360px) {
    .new-form {
        width: 90% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        width: 70%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }

    .bottom-buttons p {
        text-align: left;
        padding: 25px 0 0 10px;
        color: white;
    }
}


@media screen and (max-width:320px) {
    .new-form {
        width: 90% !important;
        height: 400px;
        background-color: white;
        margin: 40% auto;
        border-radius: 10px;
        position: relative;
    }

    .logo-place {
        position: absolute;
        width: 90%;
        margin: 35px 189px;
        z-index: 1;
    }

    .round-1 {
        height: 117px;
        width: 90%;
        background-color: #072e5b;
        margin: 14px 0;
        border-radius: 0 70px 70px 0;
        position: absolute;
    }

    .round-2 {
        position: absolute;
        height: 100px;
        width: 87%;
        background-color: white;
        margin: 23px 0;
        border-radius: 0 70px 70px 0;
        display: grid;
        align-items: center;
        justify-items: center;
    }

    #pnlLogin {
        padding: 150px 30px 0 30px;
    }

    .bottom-buttons p {
        text-align: left;
        padding: 7px 0 0 0px;
        color: white;
    }

    .for-pass-l {
        display: flex;
        justify-content: center;
        padding: 18px 20px;
    }

    .for-pass-r {
        display: flex;
        justify-content: center;
        padding: 18px 20px;
    }
}








