@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');

*{
    margin: 0;
    padding: 0;
    font-family: 'Poppins', sans-serif;
    box-sizing: border-box;
    scroll-behavior: smooth;
}

.main{
    background-image: url('../../assets/payment/bgpicture.png');
    padding: 2% 10%;
    background-size: cover;
    margin-top: 5%;
} 

.main .inner{
    background-color: #8aa9eb96;
    margin: 4% 7% 3% 7%;
    border-radius: 15px;
}

.main .inner .card {
    padding: 7%;
}

/* .main .inner .card input {
    padding: 3% 3%;
    width: 420px;
    border-radius: 10px;
    outline: none;
    border: 2px solid #707070;
}

.main .inner .card .form-in{
    width: 100%;
    margin: 5% 0%;
    text-align: center;
}

.main .inner .card label{
    font-weight: 500;
} */

.main .form{
    padding-right: 10%;
}

.main .form-group .form-control{
    padding: 5% 3%;
    margin: 7% 0%;
    font-size: 13px;
    font-weight: 500;
    border-radius: 6px;
    box-shadow: 2px 2px 4px 1px #8888888a;
    border: none;
}

.main .inner .card .form button {
    padding: 2% 41%;
    border-radius: 10px;
    text-align: center;
    background-color: #FACF11;
    border: 1px solid #707070;
    font-weight: 600;
    font-size: 18px;
    color: #324FAD;;
}

.main .inner .card h1 {
    text-align: center;
    font-size: 22px;
    color: white;
}

.card-course {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.top-card {
    background-color: white;
    border-radius: 7px;
    margin-bottom: 5%;
    margin-top: 3%;
}

.top-card img{
    width: 22%;
}

.pic {
    display: flex;
    flex-direction: row;
    padding: 8% 8% 6% 8%;
}

.pic h3 {
    padding-left: 10%;
    font-size: 18px;
    color: #324FAD;
    font-weight: 600;
}

.course {
    display: flex;
    width: 82%;
    margin: 0 auto;
    justify-content: space-between;
}

/* .card-course input{
    width: 378px !important;
} */

/* .bottom-card {
    background-image: url("/v3/assets/images/payment/cross.svg");
    background-repeat: no-repeat;
    border-radius: 10px;
    display: flex;
    flex-direction: row;
    padding: 4%;
    justify-content: space-between;
    display: flex;
    width: 92%;
    border: none;
    background-position: 100% 56%;
    background-size: 18% 48%;
    background-color: white;
} */

.top-card img {
    width: 28%;
    height: 100%;
}

hr {
    width: 82%;
    margin: 0 auto;
    margin-top: 2px !important;
    margin-bottom: 14px !important;
}

.course p {
    color: #324FAD;
    font-size: 14px;
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
}

.coupon .buttonInside{
    position:relative;
    margin-bottom:10px;
  }

  .coupon input{
    padding: 5% 3%;
    margin: 4% 0%;
    font-size: 13px;
    font-weight: 500;
    border-radius: 6px;
    box-shadow: 2px 2px 4px 1px #8888888a;
    border: none;
}
.coupon button{
    position: absolute;
    right: 8px;
    top: 5px;
    border: none;
    height: 27px;
    width: 27px;
    border-radius: 100%;
    outline: none;
    text-align: center;
    font-weight: bold;
    border: solid #8080809c;
    padding: 2px;
    color: grey;
}
.coupon button:hover{
  cursor:pointer;
}

@media screen and (max-width:1024px) {
    .main {
        margin-top: 8%;
    }
    .main .inner{
        margin: 4% 0% 4% 0%;
    }
    .pic h3 {
        font-size: 14px;
    }
    .course p {
        font-size: 12px;
    }
    .main .form-group .form-control {
        padding: 7% 3% !important;
        margin-top: 10%;
    }
    .main .inner .card .form button {
        padding: 2% 36% !important;
    }
    .coupon button {
        right: 8px;
        top: 6px !important;
        height: 24px;
        width: 24px;
        padding: 1px;
    }
    .coupon input{
        margin: -4% 0%;
    }
}

@media screen and (max-width:992px) {
    .main .form-group .form-control {
        padding: 5% 3%;
    }
    .main .inner .card .form button {
        padding: 2% 42%;
    }
    .coupon button {
        top: 17px;
    }
    .main {
        height: fit-content;
        background-image: url('../../assets/payment/bgresposive.png');
        background-position: 100% 100%;
        background-size: cover;
        background-repeat: no-repeat;
    }
    
    .main .inner .row{
        display: flex;
    }
    .main .inner .row .new-col{
        width: 50%;
    }
    .pic h3 {
        font-size: 15px;
    }
    .top-card {
        margin-bottom: 8%;
    }
    button {
        margin-bottom: 9%;
    }
}

@media screen and (max-width:800px) {
    .inner .card .row{
        flex-flow: column-reverse;
    display: flex;
    }
    .main .inner .row .new-col{
        width: 100%;
    }
    .main .inner{
        margin: 4% 7% 3% 7%;
    }
    .coupon button {
        top: 13px !important;
    }
    .coupon input {
        margin: 0% 0% 4% 0%;
    }
    .main .form-group .form-control {
        padding: 5% 3% !important;
        margin-top: 10%;
        margin-left: 6%;
    }
    .main .inner .card .form button {
        padding: 2% 40% !important;
        margin-left: 6%;
    }
}

@media screen and (max-width:768px) {
    /* .inner {
        width: 88%;
    } */
}

@media screen and (max-width:800px){
    .coupon button {
        top: 10px !important;
    }
    .main .inner .card .form button {
        padding: 2% 39% !important;
    }
}

@media screen and (max-width:600px){
    .coupon button {
        top: 7px !important;
    }
    .main .inner .card .form button {
        padding: 2% 36% !important;
    }
}

@media screen and (max-width:500px){
    .main {
        padding: 0px;
    }
    .main .inner{
        margin: 0px;
    }
    .coupon button {
        top: 10px !important;
    }
    .main .inner .card .form button {
        font-size: 14px;
    }
    .main .form {
        padding-right: 0%;
    }
    .main .form-group .form-control{
        margin-left: 0px;
    }
}

@media screen and (max-width:426px){
    .coupon button {
        top: 7px !important;
    }
    .main .inner .card .form button {
        padding: 2% 41% !important;
        margin-left: 0px;
    }
}

@media screen and (max-width: 376px) {
    .main .inner .card .form button {
        padding: 2% 39% !important;
    }
}

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap');

.paymentPage {
  padding: 0px;
  margin: 0px;
  width: 85%;
  margin: 0 auto;
  margin-top: 6%;
  height: 100%;
}

.buttonGroup>input:-internal-autofill-selected {
  background-color: #d5d5d5 !important;
}

.buttonGroup {
  height: 49px;
  margin-top: 2%;
}

.detailError {
  color: red;
  font-size: 14px;
}

.buttonGroup input {
  /* width: 50%; */
  width: 70%;
  height: 100%;
  background-color: #ffff;
  border: 1px solid #707070;
  outline: none;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  padding: 1% 3%;
}

.buttonGroup input::-webkit-input-placeholder {
  font-size: 12px;
  line-height: 120%;
  font-family: 'poppins';
}

.payapply-btn {
  height: 100%;
  padding: 0% 6%;
  border: none;
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px;
  font-size: 14px;
  font-weight: 300;
  font-family: 'poppins';
  background-color: #969696;
  color: #fff;
  cursor: pointer;
}

.payment-top {
  color: red;
}

.payment-getway {
  width: 100%;
  height: 100%;
  text-align: center;
}

.payment-bottom {
  display: flex;
  flex-direction: row;
  margin-top: 1.5%;
  justify-content: space-between;
  gap: 4%;
}

.inputfield {
  display: none;
}

.personalInfo {
  /* width: 60%; */
  display: flex;
  flex-direction: column;
  gap: 37px;
  margin: 0% 0% 5% 0%;
}

.order-summary {
  /* width: 40%; */
  border: 1px solid #9e9e9e;
  border-radius: 5px;
  background-color: white;
  /* box-shadow: 10px 10px 10px #b0b2b2; */
  box-shadow: 10px 10px 10px #b0b2b2;
}

.info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #9e9e9e;
  border-radius: 10px;
  /* padding: 3%; */
  padding-left: 7%;
  /* padding-top: 5px; */
  gap: 19px;
  /* padding-bottom: 32px; */
  padding-bottom: 5.5%;
  /* margin-top: 2%; */
  /* width: 85%; */
  box-shadow: 10px 10px 10px #b0b2b2;
  background-color: white;
}

.copyright-text {
  background-color: rgb(13, 28, 70);
  padding: 1% 6.1%;
  color: #fff;
  font-family: 'Poppins';
  font-size: 12px;
  letter-spacing: 0.4px;
}

.payment-bottom form{
  width: 50%;
  display: flex;
  flex-direction: column;
  margin: auto;
}

.payment-top {
  width: 9%;
}

.back-btn {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  margin-left: -3.5%;
  margin-top: 3%;
}

.material-textfield {
  position: relative;
  display: flex;
  flex-direction: column;
}

label {
  /* position: absolute; */
  font-size: 1rem;
  font-weight: 700;
  left: 0;
  top: 50%;
  /* transform: translateY(-50%); */
  background-color: white;
  color: gray;
  padding: 0 0.3rem;
  /* margin: 0 0.5rem; */
  transition: 0.1s ease-out;
  transform-origin: left top;
  pointer-events: none;
}

.material-textfield>input {
  outline: none;
  border: 1px solid #9e9e9e;
  border-radius: 5px;
  padding: 1.5%;
  width: 70%;
  color: #000000;
  /* color: gray; */
  transition: 0.1s ease-out;
  box-shadow: inset 5px 5px 5px #ede8e8;
}

.material-textfield>input:focus {
  border-color: #6200ee;
}

.material-textfield>input:focus+label {
  color: #6200ee;
  top: 0;
  transform: translateY(-50%) scale(0.9);
}

.material-textfield>input:not(:placeholder-shown)+label {
  top: 0;
  transform: translateY(-50%) scale(0.9);
}

.intership-program {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: center;
  margin-bottom: 3%;
}

.order {
  border: 1px solid #9e9e9e;
  border-radius: 12px;
  margin: 5% 3.5%;
  /* margin: 5% 5% 5%; */
  padding: 2%;
  display: flex;
  flex-direction: column;
}

.inner-price {
  display: flex;
  flex-direction: row;
  gap: 34%;
  margin-right: 16%;
}

.order-summary>p {
  margin-left: '28px';
}

.imgdata {
  padding-right: 31%;
  font-size: 14px;
  color: rgb(13, 28, 70);
  font-family: Poppins;
  line-height: 120%;
}

.promo-code {
  border-bottom: 1px solid #9E9E9E;
  border-top: 1px solid #9e9e9e;
  padding: 4% 4%;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.inputfield {
  background-color: #0d1c46;
  border-radius: 7px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  color: white;
  padding-top: 2%;
  padding-left: 4%;
  padding-right: 7%;
  padding-bottom: 2%;
}

.inputfield>input {
  width: 71%;
  padding: 1.5%;
  border-radius: 5px;
}

.coupon {
  display: flex;
  flex-direction: column;
  margin-left: -43%;
}

/* .pay-price {
margin-left: 65%;
} */

.pay-price>button {
  display: flex;
  flex-direction: row;
  /* grid-gap: 46px; */
  /* position: relative; */
  /* grid-gap: 46px; */
  /* left: 68%; */
  gap: 46px;
  padding: 2%;
  /* margin-left: 66%; */
  background-color: #0d1c46;
  border-radius: 7px;
  border: none;
  color: white;
  font-size: 12px;
  font-family: 'Poppins';
  line-height: 120%;
}

/* .sub-total { */
  /* border: 1px solid;
border-radius: 7px; */
/* } */

.type-inner {
  display: flex;
  flex-direction: row;
  gap: 12%;
}

.type {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.base-price {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-left: 5%;
  margin-right: 5%;
}

.sub-total {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  gap: 9px;
  padding: 5% 0%;
  /* padding-top: 21px; */
  /* padding-top: 4%; */
}

.inputfield>button {
  padding: 1.5%;
  width: 25%;
  border-radius: 8px;
}

.info>P {
  font-family: 'Poppins', sans-serif;
  margin-top: 3%;
  margin-bottom: 0%;
  color: #0d1c46;
  line-height: 120%;
}

.order-tag {
  font-family: 'Poppins', sans-serif;
  color: #0d1c46;
  margin: 2% 0% 0% 3%;
}

.typedata {
  font-family: 'Poppins', sans-serif;
  color: #0d1c46;
  font-family: 'Poppins';
  font-size: 15px;
  line-height: 120%;
}

.promo-content {
  color: #0d1c46;
  opacity: 0.35;
  font-family: 'Poppins';
  font-size: 14px;
  line-height: 120%;
}

.discount {
  color: #0d1c46;
  opacity: 0.5;
  line-height: 120%;
  font-size: 11px;
  font-family: 'Poppins';
}

.discount-price {
  color: #12b600;
  font-family: 'Poppins';
  font-size: 11px;
  line-height: 120%;
}

.base {
  color: #0d1c46;
  font-size: 13px;
  opacity: 0.7;
  line-height: 120%;
  font-family: 'Poppins';
}

.base-amount {
  color: #737c94;
  font-size: 13px;
  line-height: 120%;
  /* font-family: 'Poppins'; */
  font-family:cursive;
}

.coupondata {
  /* font-family: 'Poppins'; */
  font-family:cursive;
  font-size: 13px;
  line-height: 120%;
}

#totaldis, #payamount{
  font-family:cursive;
}

.subtotal {
  color: #0d1c46;
  font-size: 15px;
  line-height: 120%;
}

.sales {
  color: #0d1c46;
  opacity: 0.75;
  /* font-family: 'Poppins'; */
  font-size: 13px;
  margin-top: 1%;
  font-family:cursive;
}

@media screen and (max-width: 1166px) {
  .pay-price>button {
    margin-left: 58%;
  }

  .coupon {
    margin-left: -32%;
  }
}

@media screen and (max-width: 1024px) {
  .coupon {
    margin-left: -19%;
  }

  .pay-price>button {
    margin-left: 59%;
  }
}

@media screen and (max-width: 960px) {
  .imgdata {
    padding-right: 8%;
  }

  .inner-price {
    gap: 26%;
    margin-right: 8%;
  }

  .pay-price>button {
    margin-left: 56%;
  }
}

@media screen and (max-width: 885px) {
  .pay-price>button {
    margin-left: 53%;
  }
}

@media screen and (max-width: 801px) {
  .pay-price>button {
    margin-left: 48%;
  }

  .coupon {
    margin-left: 0%;
  }

  .back-btn>a {
    margin-left: -1% !important;
  }
}


@media screen and (max-width:768px) {
  .payment-bottom form{
    flex-direction: column;
    width: 100%;
  }

  .personalInfo, .order-summary, .info{
    width: 100%;
  }

  .info{
    margin: 5% 0% 0% 0%;
  }
  .personalInfo{
    margin: 5% 0% 3% 0%;
  }
}

@media screen and (max-width: 720px) {
  .pay-price>button {
    margin-left: 55%;
    padding: 4%;
    border-radius: 5px;
  }

  .back-btn>a {
    margin-left: 1% !important;
  }

  .sub-total {
    padding: 5% 14%;
  }

  .promo-code {
    padding: 4% 16%;
  }

  .inputfield {
    padding-top: 4%;
  }

  .imgdata {
    padding-right: 34%;
  }

  .intership-program {
    margin-left: 4%;
  }

  .order {
    margin: 4% 5% 5%;
    padding: 4%;
  }

  .order-tag {
    margin-left: 5%;
  }

  .payment-top {
    width: 20%;
    margin-top: 4%;
  }

  .topdiv {
    margin-top: 4%;
  }

  .paymentPage {
    /* margin-left: 12%; */
  }

  .type {
    margin-top: 2%;
    margin-left: 4%;
  }

  .order-summary {
    /* width: 90%; */
    margin-top: 5%;
  }

  .payment-bottom {
    display: flex;
    flex-direction: column;
  }

  .payment-getway {
    width: 100%;
    height: 100%;
    /* margin-top: -2%; */
  }
}


/* width */
::-webkit-scrollbar {
  width: 2.5px;

  /* height: 5px; */
}

/* Track */
::-webkit-scrollbar-track {
  background: #ffffff00;
  opacity: 0.1;
  /* height: 5px; */
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: rgb(13, 28, 70);
  /* height: 5px; */
  border-radius: 15px;
  /* width:; */
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.reveal-text-delay1 {
  position: relative;
  transform: translateX(-90px);
  opacity: 0;
  transition: all 1s ease;
}

.reveal-text-delay1.active {
  transform: translateX(0);
  opacity: 1;
}

.reveal-text-delay2 {
  position: relative;
  transform: translateX(-90px);
  opacity: 0;
  transition: all 1s ease;


}

.reveal-text-delay2.active {
  transform: translateX(0);
  opacity: 1;

}

.reveal-text-delay3 {
  position: relative;
  transform: translateX(-90px);
  opacity: 0;
  transition: all 1s ease;

}

.reveal-text-delay3.active {
  transform: translateX(0);
  opacity: 1;

}

.reveal-text-delay4 {
  position: relative;
  transform: translateX(-90px);
  opacity: 0;
  transition: all 1s ease;

}

.reveal-text-delay4.active {
  transform: translateX(0);
  opacity: 1;

}


/* Setting background to no-repeat */
#it433,
#it433-2,
#i3kp {
  background-repeat: no-repeat !important;
}




* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style: none;
}

html,
body {
  margin: 0px;
  padding: 0px;
  /* height: 100%;
width: 100%; */
  background-color: #fff;
}

.catalog-nav-container {
  width: 130px;
}

.catalog-nav {
  margin: 0;
  height: 10vh;
  background-color: rgb(13, 28, 70);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .8% 3% .8% 4%;
}

.catalog-navbar-links {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
}

.catalog-joindiv {
  border: 2.4px solid rgb(253, 211, 0);
  border-radius: 22px;
  background-color: rgb(253, 211, 0);
  color: rgb(13, 28, 70);
  font-size: 12px;
  font-family: 'Poppins';
  font-weight: 600;
  padding: 10px 15px 10px 15px;
}


/* .catalog-navbar-links>a {
font-family: 'Poppins';
} */

.catalog-navcommon {
  font-family: 'Poppins';
  font-weight: 600;
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  display: inline-block;
  padding-top: 10px;
  padding-right: 15px;
  padding-bottom: 10px;
  padding-left: 15px;
  margin-top: 0px;
  letter-spacing: .8px;
  margin-right: 35px;
  margin-bottom: 0px;
  margin-left: 0px;
  letter-spacing: 0.8px;
  font-size: 13.8px;
  line-height: 120%;
  text-decoration: none;
  color: #ffff;
}


/* .catalog-dropdown-content {
display: none;
} */

.catalog-nav-container-one {
  height: 100%;
  width: 100%
}

.catalog-nav-container-two {
  display: none;
}

.catalog-dropdown-content {
  border-bottom-right-radius: 30px;
  border-bottom-left-radius: 30px;
  top: 8vh;
  display: none;
  width: 100%;
  box-shadow: 2px 3px 10px grey;
  background-color: rgba(255, 255, 255, 0.78);
  padding: 6%;
  flex-direction: column;
}

.catalog-nav-items {
  width: 100%;
  padding: 3% 0;
  text-align: center;
  background-color: #0d1c46;
  border-radius: 32px;
  margin-bottom: 10px;
  color: white;
  font-size: 15px;
  line-height: 120%;
  font-family: 'Poppins';
  text-decoration: none;
  font-weight: 600;
}

#what-we-offer {
  position: relative;
  display: inline-block;
}

#myDropdown {
  display: none;
}

#what-we-offer:hover #myDropdown {
  display: flex;
}

.catalog-dropContainer {
  padding-top: 14px;
  position: absolute;
  width: 100%;
  z-index: 1;
}

.catalog-burgerIcon {
  display: none;
}

.catalog-backDrop {
  background-color: rgb(70 70 70/78%);
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 3000;
}

.catalog-navbar-open {
  position: absolute;
  z-index: 89999999;
  background-color: #ffff;
  padding: 0;
  top: 0;
  height: 100%;
  width: 70%;
  transition: left 1s ease;
}

.container-catalog-main {
  padding: 2% 5%;
  background-color: rgba(0, 0, 0, .10196078431372549);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.catlog-menubar {
  float: none;
  padding: 2%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: auto;
}

.catalog-whatweofferContainer {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.catalog-seprator {
  width: 100%;
  height: 2px;
  background-color: #cfcfcf;
  margin-top: 8px;
}

.catlog-menubar-link-main {
  font-family: "Poppins";
  font-weight: 600;
  display: inline-block;
  padding: 10px 48px;
  margin: 0 35px 0 0;
  letter-spacing: .8px;
  font-size: 15px !important;
  line-height: 120%;
  padding-left: 6px;
  padding-right: 6px;
  color: rgb(13, 28, 70);
  text-decoration: none;
}

.catalog-gridContainer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  grid-row-gap: 3%;
  row-gap: 3%;
  margin-left: -2%;
  ;
  margin-top: 16px;
}

.catalog-navlowerButton-nav>span {
  color: rgb(255, 255, 255);
  margin-left: 8px;
  font-size: 14px;
}

.catalog-navlowerButton-nav {
  font-family: "Poppins";
  display: block;
  text-decoration: none;
  width: 100%;
  margin: 16px 0 12px;
  padding: 3.8%;
  font-size: 14px;
  line-height: 120%;
  background-color: #0d1c46;
  color: #fff;
  text-align: center;
  border-radius: 8px;
}

.catalog-extras {
  margin-top: 16%;
}

.catalog-extras a {
  font-family: "Poppins";
  font-weight: 600;
  -webkit-text-decoration-line: none;
  text-decoration-line: none;
  text-decoration-thickness: initial;
  -webkit-text-decoration-style: solid;
  -webkit-text-decoration-style: initial;
  text-decoration-style: solid;
  -webkit-text-decoration-color: inherited;
  text-decoration-color: inherited;
  -webkit-text-decoration-color: initial;
  text-decoration-color: initial;
  display: block;
  padding-right: 15px;
  padding-bottom: 10px;
  padding-left: 15px;
  margin: 0 35px 0 0;
  letter-spacing: .8px;
  font-size: 12px;
  line-height: 120%;
  color: #0d1c46;
}

.catalog-navLower-nav {
  width: 92%;
  padding: 1% 5%;
  position: absolute;
  bottom: 8%;
}

.catalog-logos-main {
  width: 84%;
}

.items-image-main {
  width: 100%;
  height: 80%;
}

.catalog-closedIcon {
  width: 7%;
  height: 6%;
}

.catlog-navmenu-main {
  padding: 2% 5%;
  align-items: flex-start;
}

@media screen and (max-width:1024px) {
  .catalog-navcommon {
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    margin-top: 0px;
    margin-right: 14px;
    margin-bottom: 0px;
    margin-left: 0px;
    font-size: 13px;
  }
}

@media screen and (max-width:820px) {
  .catalog-navcommon {
    padding-right: 0px;
    padding-left: 0px;
    margin-top: 0px;
    font-size: 12px;
  }
}

@media screen and (max-width: 720px) {
  .catalog-navbar-links {
    display: none;
  }

  .catalog-nav-container-two {
    display: block;
  }

  .catalog-nav-container-one {
    display: none;
  }

  .catalog-nav {
    background-color: transparent;
    /* position: absolute; */
    flex-direction: row-reverse;
    height: 10vh;
    justify-content: space-between;
    width: 100%;
    align-content: center;
    padding: 4% 3% .8% 4%;
  }

  .catalog-burgerIcon {
    display: block;
  }

  .catalog-nav-container {
    margin-left: 4%;
  }
}


.htmlNoPages {
  /* width: 100%;
height: 100%; */
  margin: 0px;
  position: relative;
  height: 100vh;
}

.gwd-img-1oqv {
  position: absolute;
  width: 267px;
  height: 267px;
  transform-origin: 50% 50% 0px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.gwd-rect-1jy7 {
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  transform-style: preserve-3d;
  transform-origin: 50% 50% 0px;
  height: 288.152px;
  width: 178.091px;
  border-image-source: none;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-color: transparent;
  background-image: none;
  background-color: rgb(255, 255, 255);
  transform: translate3d(31px, -134px, 0px) rotateZ(45deg);
  margin: auto;
}

@keyframes gwd-gen-19nugwdanimation_gwd-keyframes {
  0% {
    transform: translate3d(-152px, -145px, 0px) rotateZ(45deg);
    animation-timing-function: ease;
  }

  100% {
    transform: translate3d(133px, 139px, 0px) rotateZ(45deg);
    animation-timing-function: linear;
  }
}

.htmlNoPages .gwd-gen-19nugwdanimation {
  animation: 1.3s linear 0s infinite normal forwards running gwd-gen-19nugwdanimation_gwd-keyframes;
}

@media screen and (max-width:480px) {
  .pay-price>button {
    margin-left: 0%;
  }

  .buttonGroup {
    text-align: center;
  }

  .promo-code {
    padding: 4% 0%;
  }

  .buttonGroup input {
    width: 70%;
  }

  .promo-content {
    padding: 0% 3%;
  }

  .pay-price>button{
    margin: 12% 0% 0% 0%;
  }
}

.catalog-nav {
  display: none !important;
}
.payment-form-container .combo-input {
  display: inline-block;
  font-family: 'poppins';
  font-weight: 500;
  text-align: left;
  font-size: 16px;
  line-height: 28px;
  padding: 8px 16px;
  width: 40%;
  min-height: 44px;
  border: unset;
  border-radius: 4px;
  outline-color: rgb(84 105 212/0.5);
  background-color: #fff;
  margin-bottom: 2%;
}

#combo-input-middle {
  margin-left: 4%;
}

.payment-form-container {
  border: none;
  padding: 3%;
  background-color: #0e1f4d;
  text-align: center;
  width: 80%;
  margin: 2% auto;
  border-radius: 8px;
  box-shadow: 0px 0px 17px 2px #fdd40375;
}

.offerApplied {
  font-size: 12px;
  color: #12b600;
}

.offerInvalid {
  color: red;
  font-size: 12px;
}

.radioGroup1 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1% 2%;
  width: 70%;
}

.payment-proceed-btn {
  margin-right: 25px;
  margin-top: 3%;
  padding: 6px;
  width: 30%;
  background-color: #fdd403;
  border: none;
  color: #0e1f4d;
  font-size: 16px;
  font-family: 'Poppins';
  font-weight: 600;
  letter-spacing: 0.4px;
  text-align: center;
  border-radius: 2px;
}

.middleSection {
  display: flex;
  width: 100%;
}

.middleSection .leftSection,
.middleSection .rightSection {
  width: 50%;
}

.combo-main-header {
  text-align: center;
  margin-bottom: 3%;
  font-size: 24px;
  font-weight: 500;
  color: #fff;
}

.combo-header {
  text-align: center;
  margin-bottom: 3%;
  color: #fff;
  font-family: 'Poppins';
  font-size: 18px;
  font-weight: 200;
  margin-bottom: 16px;
}

.leftSection .radioGroup,
.rightSection .radioGroup {
  width: 44%;
  margin: auto;
  text-align: left;
  color: white;
}

.combo-header {
  font-size: 18px;
  font-weight: 500;
}

.radioButton label {
  font-size: 15px;
  font-weight: 400;
}

.radioButton input {
  margin: 3%;
}

#combo-input-last {
  width: 84%;
}

.payment-form-container .combo-input input::-webkit-input-placeholder {
  font-size: 10px;
  line-height: 3;
}

.err-msg {
  background-color: red;
  width: 60%;
  margin: auto;
  font-size: 13px;
  font-weight: 600;
  color: white;
  border-radius: 15px;
}

@media (max-width: 1020px) {

  .leftSection .radioGroup,
  .rightSection .radioGroup {
    width: 70%;
  }
}

@media (max-width: 720px) {
  #combo-input-last {
    width: 90%;
  }

  .container #paymentPage-combo {
    margin: 0 auto !important;
  }

  #combo-input-middle {
    margin-left: auto;
  }

  .payment-form-container {
    margin-top: 5%;
    margin-bottom: 5%;
    padding: 6% 3%;
    width: 100%;
  }

  .combo-main-header {
    font-size: 22px;
    margin-bottom: 10%;
  }

  .payment-form-container form:nth-child(1) {
    margin-top: 10%;
  }

  .payment-form-container .combo-input {
    display: block;
    padding: 5px 16px;
    width: 90%;
    margin: auto;
    margin-bottom: 4%;
  }

  .middleSection {
    flex-wrap: wrap;
    margin-top: 10%;
    margin-left: 6%;
  }

  .middleSection .leftSection,
  .middleSection .rightSection {
    width: 100%;
    margin-bottom: 10%;
  }

  .combo-header {
    text-align: left;
  }

  .leftSection .radioGroup,
  .rightSection .radioGroup {
    width: 66%;
    margin: auto 6%;
    text-align: left;
  }

  .payment-proceed-btn {
    margin-right: 25px;
    width: 60%;
    margin-top: 3%;
    padding: 5px;
  }
}