@import url(https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);

body,
html {
  margin: 0;
  font-size: 16px;
  font-family: Montserrat, sans-serif;
}

ol,
ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

button:focus,
input:focus,
textarea:focus {
  outline: 0;
}

a:focus,
a:hover {
  text-decoration: none;
}

img {
  max-width: 100%;
}

.text-right {
  text-align: right;
}

.btn_grey {
  display: inline-block;
  background-color: #e4edff;
  padding: 0.75rem 1rem;
  font-weight: 700;
  border: 0.1rem solid #e4edff;
  color: #ffffff;
  text-align: center;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.btn_grey:focus,
.btn_grey:hover {
  background-color: #020c1e;
  border: 0.1rem solid #020c1e;
  color: #e4edff !important;
}
.payment_box1 img {
  height: 80px;
  border-radius: 5px;
}
.payment_box img {
  width: 60px !important;
  border-radius: 5px;
}
.payment_box div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.payment_box1 div {
  font-size: x-large;
  padding: 10px 0;
}
.btn_sell {
  display: inline-block;
  background-color: #dc3545;
  padding: 0.75rem 1rem;
  font-weight: 700;
  border: 0.1rem solid black;
  color: #ffffff !important;
  text-align: center;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.btn_sell:focus,
.btn_sell:hover {
  background-color: black;
  border: 0.1rem solid black;
  color: #fcfcfc !important;
}

.btn_orange {
  display: inline-block;
  background-color: #ebcc4f;
  padding: 0.75rem 1rem;
  font-weight: 700;
  border: 0.1rem solid #020c1e;
  color: #020c1e;
  text-align: center;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.btn_orange:focus,
.btn_orange:hover {
  background-color: #020c1e;
  border: 0.1rem solid #020c1e;
  color: #ebcc4f !important;
}

.btn_green {
  display: inline-block;
  background-color: #42bf59;
  padding: 0.75rem 1rem;
  font-weight: 700;
  border: 0.1rem solid #42bf59;
  color: #fff;
  text-align: center;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.btn_green:focus,
.btn_green:hover {
  background-color: #fff;
  border: 0.1rem solid #42bf59;
  color: #42bf59 !important;
}

.btn_green a {
  color: #fff !important;
  text-decoration: none;
}

.btn_green a:hover {
  color: #42bf59 !important;
  text-decoration: none;
}

.nav_section {
  background-color: #f1d566;
  padding: 0.5rem 1rem;
}

.nav_section .bg-light {
  background-color: transparent !important;
  padding: 0;
}

.nav_section .navbar-brand {
  width: 10rem;
  margin-right: 5rem;
}

.navbar-light .navbar-nav .nav-link {
  font-size: 1rem;
  font-weight: 500;
  color: #020c1e;
  padding: 0.5rem 1rem;
}

.navbar-light .navbar-nav.ms-auto {
  display: flex;
  align-items: center;
}

.navbar-light .navbar-nav .nav-link.lan img {
  width: 1.5rem;
  margin-top: -0.2rem;
  margin-right: 0.25rem;
}

.navbar-light .navbar-nav .nav-link.cart img {
  width: 1.2rem;
  margin-top: -0.2rem;
  margin-right: 0.25rem;
}

.navbar-light .navbar-nav .nav-link.btn_grey,
.navbar-light .navbar-nav .nav-link.btn_orange {
  text-transform: uppercase;
  padding: 0.7rem 1.5rem;
  font-weight: 700;
}

.navbar-light .navbar-nav .nav-link.btn_orange {
  margin-left: 1rem;
}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
  color: #020c1e;
}

.header {
  background-image: url(../images/header_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  padding: 2.5rem 0;
  position: relative;
  background-attachment: fixed;
  background-position: center;
}

.header h1 {
  color: #fff;
  font-weight: 700;
  font-size: 3.25rem;
}

.header h1 span {
  color: #e2be41;
}

.header h3 {
  color: #fff;
  font-weight: 500;
  font-size: 1.75rem;
  margin-top: 1rem;
}

.header .gold_box {
  display: inline-block;
  width: 100%;
  position: relative;
  margin-top: 1.5rem;
}

.header .gold_box .top {
  background-color: #eed05a;
  padding: 1rem;
  display: inline-block;
  width: 100%;
  position: relative;
}

.header .gold_box .top img {
  width: 10rem;
}

.header .gold_box .top .price {
  background-color: #e4edff;
  color: #020c1d;
  padding: 1.15rem 3rem;
  border-top-left-radius: 3rem;
  border-bottom-left-radius: 3rem;
  display: inline-block;
  font-weight: 500;
  font-size: 1.45rem;
  position: absolute;
  right: 0;
  top: 1.15rem;
}

.header .gold_box .bot {
  background-color: #fff;
  padding: 1.25rem;
  display: inline-block;
  width: 100%;
  position: relative;
  border: 0.15rem solid #f5da72;
  border-top: 0;
}

.header .gold_box .bot .swap_wrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  margin-bottom: 1rem;
}

.header .gold_box .bot input.form-control {
  background-color: #f6f6f6;
  border-radius: 0.25rem;
  border: 0;
  padding: 0.5rem 1rem;
  height: 2.75rem;
  color: #020c1e;
  font-size: 1rem;
  font-weight: 500;
}

.header .gold_box .bot input.form-control::placeholder {
  color: #707070;
  font-size: 1rem;
  font-weight: 500;
}

.header .gold_box .bot .swap_wrap .pricer {
  flex: 0 0 35%;
  position: relative;
}

.header .gold_box .bot .swap_wrap .pricer .wraper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.header .gold_box .bot .swap_wrap .pricer input.form-control {
  text-align: center;
}

.header .gold_box .bot .swap_wrap .pricer .type {
  font-weight: 700;
  color: #020c1e;
  font-size: 1.1rem;
  margin-left: 0.75rem;
}

.header .gold_box .bot .swap_wrap .pricer .type span {
  font-weight: 400;
  font-size: 1rem;
}

.header .gold_box .bot .swap_wrap .pricer .flag {
  float: right;
  margin-right: 1.5rem;
  margin-bottom: 0.25rem;
}

.header .gold_box .bot .swap_wrap .swap_icon {
  flex: 0 0 30%;
  position: relative;
  text-align: center;
}

.header .gold_box .bot .swap_wrap .swap_icon img {
  width: 1.5rem;
  margin-top: -1.25rem;
}

.header .gold_box .bot .form-group {
  margin-bottom: 0.5rem;
}

.header .gold_box .bot p {
  font-weight: 500;
  color: #777;
  font-size: 1rem;
  margin-top: 1rem;
}

.header .gold_box .bot .btn_green {
  width: 100%;
}

.header .gold_box .top2 {
  background-color: #e4edff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem;
}

.header .gold_box .top2 .swap_icon {
  width: 2.25rem;
  display: inline-block;
}

.header .gold_box .top2 img {
  width: 12.5rem;
}

.header .gold_box .bot2 .typer {
  font-weight: 700;
  color: #020c1e;
  font-size: 1.1rem;
}

.header .gold_box .bot2 .btn_grey {
  width: 100%;
}

.header .gold_box .bot2 .help_sec {
  font-weight: 700;
  color: #020c1e;
  font-size: 1rem;
  display: inline-block;
  margin-top: 0.75rem;
}

.header .m_row {
  margin-top: 1.5rem;
  margin-left: -0.25rem;
}

.header .m_row .col-3 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.header .blue_box {
  background-color: #051024;
  border: 0.2rem solid #eed05a;
  margin-top: 1.5rem;
  display: inline-block;
  width: 100%;
  position: relative;
  text-align: center;
  padding: 2rem;
}

.header .blue_box h5 {
  font-weight: 600;
  font-size: 1.5rem;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

.header .blue_box h5 {
  font-weight: 600;
  font-size: 1.5rem;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

.header .blue_box h2 {
  color: #f3d96e;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 2.5rem;
  margin-bottom: 1.5rem;
}

.header .blue_box h3 {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
}

.header .blue_box .light_box {
  background-color: #152139;
  border-radius: 0.15rem;
  padding: 0.5rem 1rem;
}

.header .blue_box .light_box .text {
  text-align: left;
  color: #fff;
  font-weight: 600;
  font-size: 1rem;
  padding: 0.5rem 0;
  border-bottom: 0.1rem solid #fff;
}

.header .blue_box .light_box .text span {
  color: #eed05a;
  float: right;
}

.header .blue_box .light_box .text:last-child {
  border: 0;
}

.header .blue_box .payment_box {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2rem;
}

.header .blue_box .payment_box img {
  width: 2.25rem;
  margin-right: 0.75rem;
  padding: 3px 3px;
}

.header .blue_box .payment_box .text {
  text-align: left;
  color: #707070;
  font-size: 0.9rem;
  font-weight: 500;
}

.header .blue_box .payment_box .text span {
  font-size: 1.1rem;
  color: #fff;
  font-weight: 600;
}

.header .blue_box hr {
  background-color: #707070;
  margin: 2rem 1.5rem;
}

.header .blue_box .help_link {
  color: #fff;
  font-weight: 600;
  font-size: 0.95rem;
}

.service_section {
  background-color: #f7f7f8;
  padding: 5rem 0;
  position: relative;
  width: 100%;
  display: inline-block;
}

.service_section h3 {
  color: #020c1e;
  font-weight: 700;
  font-size: 2.5rem;
  text-transform: uppercase;
}

.service_section h3 span {
  color: #e2be41;
}

.service_section .hr {
  display: block;
  margin: 1rem 0;
}

.service_section .hr img {
  width: 13.5rem;
}

.service_section form {
  position: relative;
  margin-bottom: 2.5rem;
}

.service_section form label {
  font-size: 0.9rem;
  font-weight: 600;
  color: #707070;
  margin-bottom: 0.35rem;
}

.service_section form select.form-control {
  outline: 0 !important;
  box-shadow: none !important;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  height: 2.75rem;
  color: #707070;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0 1rem;
  background: url(../images/caret_down.svg), #fff;
  background-repeat: no-repeat;
  background-size: 0.75rem;
  background-position: 95% 50%;
}

.service_section form input.form-control {
  outline: 0 !important;
  box-shadow: none !important;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  height: 2.75rem;
  color: #707070;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0 1rem;
}

.service_section form .btn_orange {
  border: 0;
  height: 2.75rem;
  padding: 0.5rem 1rem;
  width: 100%;
  margin-top: 0.25rem;
  text-transform: uppercase;
  font-size: 0.9rem;
}

.service_section .table_box {
  display: inline-block;
  width: 100%;
  position: relative;
  padding: 1.5rem 2.5rem;
  background-color: #fff;
  box-shadow: 0 0 1.25rem #00000038;
}

.service_section .table_box table {
  min-width: 800px;
}

.service_section .table_box thead th {
  background-color: #d2e0f9;
  padding: 1rem;
  font-size: 1.1rem;
  color: #000;
  font-weight: 700;
  border: 0;
}

.service_section .table_box tbody td {
  padding: 1rem;
  border: 0;
  vertical-align: middle;
}

.service_section .table_box tbody td .flex_wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.service_section .table_box tbody td .flex_wrap .icon {
  font-size: 1.25rem;
  color: #000;
  margin-right: 0.5rem;
}

.service_section .table_box tbody td .flex_wrap .sword {
  width: 1.2rem;
  display: inline-block;
  margin-right: 0.5rem;
}

.service_section .table_box tbody td .text {
  color: #707070;
  font-weight: 500;
  font-size: 0.9rem;
}

.service_section .table_box tbody td select.form-control {
  outline: 0 !important;
  box-shadow: none !important;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  height: 2.75rem;
  color: #707070;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0 1rem;
  background: url(../images/caret_down.svg), #f4f4f4;
  background-repeat: no-repeat;
  background-size: 0.75rem;
  background-position: 95% 50%;
}

.service_section .table_box .skill_info {
  display: inline-block;
  width: 100%;
  position: relative;
  margin-top: -1rem;
}

.service_section .table_box .skill_info ul li {
  color: #707070;
  font-weight: 700;
  font-size: 0.9rem;
}

.service_section .table_box .skill_info ul li span {
  font-weight: 400;
}

.service_section .table_box .skill_info p {
  margin-bottom: 0.25rem;
  margin-top: 0.5rem;
  color: #707070;
  font-weight: 700;
  font-size: 0.9rem;
}

.service_section .table_box tbody td .text.lg {
  font-size: 1rem;
}

.service_section .table_box .btn_orange {
  text-decoration: none;
  border: 0;
  text-transform: uppercase;
  font-size: 0.9rem;
  padding: 0.75rem 2rem;
  margin-bottom: 2rem;
}

.service_section .table_box .scroller {
  overflow-x: auto;
}

.service_section input.form-control {
  outline: 0 !important;
  box-shadow: none !important;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  height: 2.75rem;
  color: #707070;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0 1rem;
}

.service_section .form-group {
  position: relative;
  margin-top: 1.75rem;
}

.service_section .search {
  padding: 0;
  border: 0;
  background-color: transparent;
  color: #020c1e;
  font-size: 1.1rem;
  position: absolute;
  right: 1rem;
  top: 0.5rem;
}

.service_section .table_box .pagination li a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  width: 3rem;
  height: 3rem;
  border: 0.15rem solid #bf9d1f;
  color: #bf9d1f;
  font-weight: 700;
  font-size: 1.5rem;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.service_section .table_box .pagination li a:hover {
  background-color: #fbf5da;
  border: 0.15rem solid #fbf5da;
}

.service_section .table_box .pagination li:nth-child(2) a {
  background-color: #f7f7f8;
  border: 0.15rem solid #f7f7f8;
  color: #707070;
  font-size: 1rem;
}

.select_section {
  position: relative;
  background-color: #e4edff;
  padding: 3rem 0;
}

.select_section2 {
  background-color: #fff;
}

.select_section h3 {
  color: #020c1e;
  font-weight: 700;
  font-size: 2.5rem;
  text-transform: uppercase;
}

.select_section h3 span {
  color: #e2be41;
}

.select_section .hr {
  display: block;
  margin: 1rem 0;
}

.select_section .hr img {
  width: 13.5rem;
}

.select_section label {
  color: #020c1e;
  font-weight: 500;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
}

.select_section select.form-control {
  outline: 0 !important;
  box-shadow: none !important;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  height: 2.75rem;
  color: #020c1e;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0 1rem;
  background: url(../images/caret_down.svg), #dce6f9;
  background-repeat: no-repeat;
  background-size: 0.75rem;
  background-position: 95% 50%;
  border: 0.1rem solid #020c1e;
}

.select_section input.form-control {
  outline: 0 !important;
  box-shadow: none !important;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  height: 2.75rem;
  color: #707070;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0 1rem;
}

.select_section .form-group {
  position: relative;
  margin-top: 2rem;
}

.select_section .search {
  padding: 0;
  border: 0;
  background-color: transparent;
  color: #020c1e;
  font-size: 1.1rem;
  position: absolute;
  right: 1rem;
  top: 0.5rem;
}

.select_section .white_box {
  padding: 1.25rem;
  background-color: #fff;
  display: inline-block;
  width: 100%;
  position: relative;
  margin-top: 2.5rem;
  box-shadow: 0 0 1rem #00000021;
}

.select_section .white_box .img_box {
  background-color: #f7f7f8;
  padding: 1rem;
  text-align: center;
  display: inline-block;
  width: 100%;
}

.select_section .white_box .bot {
  padding: 0.75rem 0.5rem;
  padding-bottom: 0;
  position: relative;
}

.select_section .white_box .price {
  font-size: 1.1rem;
  font-weight: 700;
  color: #42bf59;
  margin-bottom: 0.35rem;
}

.select_section .white_box .item_name {
  color: #020c1e;
  font-size: 1rem;
  margin-bottom: 1.2rem;
}

.select_section .white_box .flexer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.select_section .white_box .flexer .btn_green {
  flex: 0 0 70%;
}

.select_section .white_box .flexer .btn_grey {
  background-color: #e4edff !important;
  margin-left: 0.75rem;
}

.select_section .white_box select.form-control {
  background-color: transparent;
  border: 0;
  display: inline-block;
  width: 3rem;
  position: absolute;
  right: 0.5rem;
  top: 0.25rem;
}

.select_section .btn_orange.load {
  text-decoration: none;
  border: 0;
  text-transform: uppercase;
  font-size: 0.9rem;
  padding: 0.75rem 3rem;
  margin-top: 3rem;
}
.custom_div_c {
  background-image: url(../images/banner.png);
  display: flex;
  justify-content: center;
  align-items: center;
  /* gap: 100px; */
  border-radius: 10px;
  padding: 22px 0;
  color: white;
}
.partner_section {
  background-image: url(../images/partner_bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  padding: 2rem 0;
  position: relative;
}

.partner_section .img_flex {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 10rem;
}

footer {
  background: #fff;
  position: relative;
  padding-top: 2rem;
}

footer .logo {
  display: inline-block;
  width: 10rem;
}

footer h4 {
  color: #020c1e;
  font-weight: 600;
  font-size: 1.1rem;
  margin-top: 0.75rem;
}

footer ul li a {
  text-decoration: none;
  display: inline-block;
  width: 100%;
  color: #707070 !important;
  font-weight: 500;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}

footer ul.list-inline {
  margin-top: 0.75rem;
}

footer ul.list-inline li a {
  color: #000 !important;
  font-size: 1.5rem;
  margin-right: 0.5rem;
}

footer .bot {
  text-align: center;
  border-top: 0.1rem solid #707070;
  padding: 1rem;
  margin-top: 2rem;
}

footer .bot p {
  margin-bottom: 0;
  font-size: 0.9rem;
  color: #707070;
}

.rate_section {
  background-image: url(../images/partner_bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding: 1rem 0;
}

.rate_section .img_box {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  height: 100%;
}

.view_section {
  position: relative;
  padding-bottom: 5rem;
  background-color: #fff;
}

.view_section .slick-list {
  padding-top: 9rem;
}

.view_section .slick-slide {
  padding: 0 1rem;
}

.view_section .view_box {
  display: inline-block;
  width: 100%;
  position: relative;
  background-color: #ebcc51;
  border-top-left-radius: 10rem;
  border-top-right-radius: 10rem;
  text-align: center;
  padding: 1.5rem;
  padding-top: 0;
}

.view_section .view_box .img_box {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  min-height: 15rem;
  margin-top: -8.8rem;
}

.view_section .view_box h4 {
  color: #020c1e;
  font-weight: 700;
  font-size: 1.75rem;
  margin: 1.5rem 0;
}

.view_section .view_box .btn_blue {
  text-decoration: none;
  display: inline-block;
  background-color: #2a487e;
  padding: 0.75rem 1rem;
  font-weight: 700;
  border: 0;
  color: #f2d668;
  text-align: center;
  width: 90%;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
  margin-bottom: 1rem;
}

.slick-prev {
  font-size: 0;
  border: 0;
  background-color: transparent;
  background-image: url(../images/arrow.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 3.5rem;
  height: 3.5rem;
  position: absolute;
  left: -5rem;
  top: 60%;
}

.slick-next {
  font-size: 0;
  border: 0;
  background-color: transparent;
  background-image: url(../images/arrow.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  transform: rotate(180deg);
  width: 3.5rem;
  height: 3.5rem;
  position: absolute;
  right: -5rem;
  top: 60%;
}

.service_section .slick-slide {
  padding: 0 1rem;
}

.service_section .review_box {
  display: inline-block;
  width: 100%;
  position: relative;
  padding: 1.75rem 1.5rem;
  background-color: #fff;
  box-shadow: 0 0 1rem #00000021;
  margin-top: 2rem;
}

.service_section .review_box p {
  color: grey;
  font-size: 1.2rem;
  font-style: italic;
}

.service_section .review_box .review_flex {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.service_section .review_box .review_flex img {
  width: 5rem;
  margin-right: 1rem;
}

.service_section .review_box .review_flex .text {
  color: #020c1e;
  font-weight: 600;
  font-size: 0.95rem;
}

.service_section .review_box .review_flex .text span {
  color: #e2be41;
}

.service_section .review_box .quote {
  width: 6rem;
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
}

.service_section .slick-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2rem;
}

.service_section .slick-dots button {
  border: 0;
  background-color: #bfbfbf;
  font-size: 0;
  width: 0.5rem;
  height: 0.75rem;
  margin: 0 0.25rem;
  border-radius: 50%;
}

.service_section .slick-dots .slick-active button {
  background-color: #e8c54c;
}

.select_section .choose_box {
  text-align: center;
  position: relative;
  margin-top: 1rem;
}

.select_section .choose_box .img_box {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  min-height: 6rem;
  margin-bottom: 1.5rem;
}

.select_section .choose_box h4 {
  color: #020c1e;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 1.5rem;
  margin-bottom: 1.15rem;
  line-height: 1.5;
}

.select_section .choose_box p {
  color: #737d8f;
  font-size: 1.25rem;
  line-height: 1.6;
  font-weight: 500;
  padding: 0 1rem;
}

.bg_white {
  background-color: #fff;
}

.service_section .blog_box {
  width: 100%;
  position: relative;
  margin-top: 1.5rem;
}

.service_section .blog_box img {
  width: 100%;
}

.service_section .blog_box .text_box {
  background-color: #fff;
  padding: 2rem;
  box-shadow: 0 0 1rem #00000021;
  display: inline-block;
  width: 100%;
  position: relative;
}

.service_section .blog_box .text_box h5 {
  color: #e8c54c;
  font-weight: 700;
  font-size: 1.15rem;
}

.service_section .blog_box .text_box h4 {
  color: #020c1e;
  font-weight: 700;
  font-size: 1.25rem;
  text-transform: uppercase;
  margin: 1.1rem 0;
}

.service_section .blog_box .text_box p {
  color: #737d8f;
  font-size: 1.15rem;
  line-height: 1.6;
  font-weight: 400;
}

.service_section .btn_blue {
  text-decoration: none;
  display: inline-block;
  background-color: #162643;
  padding: 0.75rem 3rem;
  font-weight: 700;
  border: 0;
  text-transform: uppercase;
  color: #f1d566;
  text-align: center;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
  margin-top: 3rem;
}

.header .yellow_box {
  /* background-color: #f1d566; */
  background-image: url(../images/yellow2.png);
  text-align: center;
  padding: 3rem;
  display: inline-block;
  width: 90%;
  margin-top: 2.5rem;

  animation: FadeZoom 3s ease-out;
}

.header .yellow_box img {
  margin-bottom: 2rem;
}

.header .yellow_box .price {
  color: #00061b;
  font-weight: 700;
  font-size: 2.5rem;
}

.header .yellow_box p {
  color: #0b101f;
  font-weight: 500;
  font-size: 1.1rem;
  margin-bottom: 1.25rem;
}

.header .yellow_box .btn_blue {
  text-decoration: none;
  display: inline-block;
  background-color: #162643;
  padding: 0.75rem 3rem;
  font-weight: 700;
  border: 0;
  text-transform: uppercase;
  color: #c1a540;
  text-align: center;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.header .bluebox {
  /* background-color: #0a172d; */
  background-image: url(../images/blue1.png);
  /* border: 0.15rem solid #e4c136; */
  text-align: center;
  padding: 3rem;
  display: inline-block;
  width: 90%;
  margin-top: 2.5rem;
  animation: FadeZoom 3s ease-out;
}

.header .bluebox img {
  margin-bottom: 1.5rem;
}

.header .bluebox .price {
  color: #fff;
  font-weight: 700;
  font-size: 2.5rem;
}

.header .bluebox p {
  color: #fff;
  font-weight: 500;
  font-size: 1.1rem;
  margin-bottom: 1.25rem;
}

.header .bluebox .btn_blue {
  text-decoration: none;
  display: inline-block;
  background-color: #e9c948;
  padding: 0.75rem 3rem;
  font-weight: 700;
  border: 0;
  text-transform: uppercase;
  color: #0a172d;
  text-align: center;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.radio {
  display: block;
  position: relative;
  padding-left: 1.75rem;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 400;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.radio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.radio .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 1.25rem;
  width: 1.25rem;
  background-color: #fff;
  border-radius: 50%;
  border: 0.1rem solid #475875;
}

.radio:hover input ~ .checkmark {
  background-color: #fff;
}

.radio input:checked ~ .checkmark {
  background-color: #fff;
  border: 0.1rem solid #e2be41;
}

.radio .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.radio input:checked ~ .checkmark:after {
  display: block;
}

.radio .checkmark:after {
  top: 0.15rem;
  left: 0.15rem;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  background: #e2be41;
}

.check {
  display: block;
  position: relative;
  padding-left: 1.75rem;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 400;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.check input {
  position: relative;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.check .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 1.25rem;
  width: 1.25rem;
  background-color: #fff;
  border: 0.1rem solid #e2be41;
}

.check:hover input ~ .checkmark {
  background-color: #fff;
  border: 0.1rem solid #e2be41;
}

.check input:checked ~ .checkmark {
  background-color: #fff;
  border: 0.1rem solid #e2be41;
}

.check .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.check input:checked ~ .checkmark:after {
  display: block;
}

.check .checkmark:after {
  left: 0.3rem;
  top: 0;
  width: 0.45rem;
  height: 0.9rem;
  border: solid #e2be41;
  border-width: 0 0.15rem 0.15rem 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

.payment-methods {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;
  margin: -4px;
}

.payment-method {
  position: relative;
  margin: 2px;
  width: calc(25% - 8px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: 0.15s ease all;
  flex-direction: column;
}

.payment-method label {
  cursor: pointer;
}

.payment-method::before {
  cursor: pointer;
  position: absolute;
  right: -15px;
  top: -15px;
  background: #fff;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  content: "";
  z-index: 998;
  opacity: 0;
}

.payment-method.active::after {
  position: absolute;
  right: 0px;
  top: 0;
  color: #fff;
  text-align: center;
  background: #42bf59;
  width: 21px;
  height: 21px;
  cursor: pointer;
  content: "✓";
  z-index: 999;
}

.payment-method input {
  position: fixed;
  opacity: 0;
  pointer-events: none;
}

#selected_payment {
  color: #e2be41;
}

.form-control:focus {
  border-color: #42bf59;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #42bf59;
}

.btn_green_buy {
  display: inline-block;
  background-color: #42bf59;
  padding: 0.75rem 1rem;
  font-weight: 700;
  border: 0.1rem solid #42bf59;
  color: #fff;
  text-align: center;
  height: 80px !important;
  transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -moz-transition: all ease 0.4s;
  -ms-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
}

.btn_green_buy:focus,
.btn_green_buy:hover {
  border: 0.1rem solid #42bf59;
}

.btn_green_buy a {
  color: #fff !important;
  text-decoration: none;
}

.btn_green_buy a:hover {
  text-decoration: none;
}

.sell-input::after {
  position: absolute;
  right: 50px;
  top: 45px;
  content: attr(data-placeholder);
  pointer-events: none;
  opacity: 0.8;
  font-size: 1rem;
}

/* Animaiton */

@keyframes FadeZoom {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/* tags */
.tag {
  display: inline-block;
  color: #fff;
  background-color: #888;
  border-radius: 5px;
  margin: 2px;
  padding: 2px 5px;
  font-size: 12px;
  text-decoration: none;
}

.tag:hover {
  color: #dddddd;
  background-color: #888;
  text-decoration: none;
}

.archive_box {
  display: inline-block;
  width: 100%;
  position: relative;
  margin-top: 2.5rem;
  box-shadow: 0 0 1rem #00000021;
}

.thumbnai {
  height: 13.5rem;
  object-fit: cover;
  background-position: top;
  object-position: top;
}

.post-thumbnail {
  width: 100%;
}

.btn-check:checked + .btn-outline-primary {
  outline: 3px solid #42bf59;
  transform: scale(1.02);
  transition: all 100ms ease-in-out;
}

.bg_yellow.active {
  background-color: #f1d566 !important;
}

.bg_yellow {
  background-color: #af9e57 !important;
  color: #012664 !important;
  border-radius: 0px;
  border-top-right-radius: 0.25rem;
  border-top-left-radius: 0.25rem;
}

.game-body {
  background-color: #354f6b;
  border: 4px solid #f1d566;
  margin: 0;
}

.features-item {
  background-color: rgba(221, 189, 73, 0.5);
  padding: 1rem 1.3rem;
  border-radius: 0.4rem;
}
.sell-tab {
  background: #595858e0;
  margin: 0 10px;
  padding: 10px 10px;
  width: 160px;
  display: flex;
  justify-content: center;
  border-radius: 5px;
  cursor: pointer;
}
a.sell-tab-btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px 0;
  color: white;
  text-decoration: none;
  font-size: larger;
  font-weight: 500;
}
.sell-tab:hover {
  background: #a2a2a2;
}
.item-container-box {
  background-color: #434855eb;
  padding: 15px 0px;
  border-radius: 5px;
}
/* Extra small devices (phones, 900px and down) */
@media only screen and (max-width: 900px) {
  .header {
    background-image: url(../images/header_bg_mobile.jpg);
  }
}
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .game-area {
    grid-template-columns: repeat(1, 1fr) !important;
  }
  .fdiv-button {
    flex-direction: column;
    gap: 12px !important;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .game-area {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .game-area {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .game-area {
    grid-template-columns: repeat(4, 1fr) !important;
  }
  .selected-item-container .fdiv {
    width: 550px !important;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .game-area {
    grid-template-columns: repeat(5, 1fr) !important;
  }
}

.game-buy-card {
  cursor: pointer;
  border-radius: 0.5rem;
  /* aspect-ratio: 0.75; */
  overflow: hidden;
  transition-property: transform;

  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  animation-duration: 0.3s;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

.game-buy-cardh:hover .game-buy-card {
  outline: 2px solid hsla(222deg 7% 30% / 1);
  outline-offset: 0.125rem;
  z-index: 1;
  --tw-scale-x: 1.03;
  --tw-scale-y: 1.03;
  transform: translate(0, 0) rotate(0) skew(0) skewY(0) scaleX(1.03)
    scaleY(1.03);
}
