@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap');
:root {
  --app-bg-color: #720D5D;
  --app-color: #720D5D;
  --text-color: rgba(71, 71, 71, 1);
  --red-color: #E72001;
  --orange-color: rgba(255, 198, 70, 1);
  --gray-color: #BCBCBC;
  --gray1-color: #7B7B7B;
  --gray2-color: rgba(199, 193, 206, 1);
  --white-color: #FFFFFF;
  --green-color: rgba(8, 213, 0, 1);
  --green1-color: rgba(36, 133, 32, 1);
  --f7-navbar-bg-color: #FFF;
  --f7-navbar-height: 60px;
}
a:hover,a:focus,a:active{text-decoration: none}
body {
  color: var(--text-color);
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  max-width: 1920px;
  margin: 0 auto;
}

.f-300{
  font-weight: 300 !important;
}
.f-400{
  font-weight: 400 !important;
}
.f-500{
  font-weight: 500 !important;
}
.f-600{
  font-weight: 600 !important;
}
.f-700{
  font-weight: 700 ;
}
.f-800{
  font-weight: 800 !important;
}
.f-900{
  font-weight: 900 !important;
}
.navbar:after{
  display: none;
}
.container{padding: 0 15px;box-sizing: border-box}
.page{
  background-color: #FFF;
  padding-top: 0;
}
.color-app{
  color: var(--app-color);
}
.color-red{
  color: var(--red-color);
}
.color-orange{
  color: var(--orange-color)
}
.color-gray{
  color: var(--gray-color) !important;
}
.color-gray1{
  color: var(--gray1-color) !important;
}
.color-gray2{
  color: var(--gray2-color) !important;
}
.color-text{
  color: var(--text-color) !important;
}
.color-white{
  color: var(--white-color) !important;
}
.color-green{
  color: var(--green-color) !important;
}

input[type='number'],
input[type='password'],
input[type='text'],
select
{
  background: #FFFFFF;
  /* Border */
  border: 1px solid var(--border-input-color);
  box-sizing: border-box;
  border-radius: 6px;
  font-style: normal;
  font-weight: 300;
  line-height: 21px;
  font-size: 14px;
  height: 48px;
  width: 100%;
  padding: 0 20px;
  color: var(--text-color);
}
textarea{
  border: 1px solid var(--border-input-color);
  box-sizing: border-box;
  border-radius: 5px;
  font-style: normal;
  font-weight: 600;
  line-height: 21px;
  font-size: 14px;
  width: 100%;
  padding: 10px 20px;
  color: var(--text-color);
}
input.search-input{
  height: 50px;
  font-size: 16px;
  /*background: url('./images/search.svg') bottom 13px right 10px no-repeat;*/
}

.btn
{
  box-sizing: border-box;
  height: 50px;
  line-height: 50px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  text-align: center;
  display: inline-block;
  box-shadow: none;
  border: 0;
  color: var(--text-color);
}
.btn-active{
  background: linear-gradient(180deg, #FEEFA5 0%, #E6C36C 100%);
  color: var(--red-color) !important;
  border: 0;
  font-weight: bold;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: var(--gray-color);
  font-weight: 300;
}
::-moz-placeholder { /* Firefox 19+ */
  color: var(--gray-color);
  font-weight: 300;
}
:-ms-input-placeholder { /* IE 10+ */
  color: var(--gray-color);
  font-weight: 300;
}
:-moz-placeholder { /* Firefox 18- */
  color: var(--gray-color);
  font-weight: 300;
}
.btn-violet{
  height: 56px;
  background: #720D5D;
  color: #fff;
  font-size: 17px;
  line-height: 56px;
  font-weight: 700;
  width: 100%;
}
.bg-g{background-color: #F4F6F8;}
.color-blue1{color: #0076FF}
.egift{
  border-radius: 10px;
  -webkit-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.20);
  -moz-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.20);
  box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.20);
  margin-left: 20px;
  margin-right: 20px;
}
.text-left{text-align: left}
.p820{padding: 12px 8px}
.bT2{border-top: 2px dashed #E5EAEF}
.khuyet1{
 transform: rotate(-68deg);
    -webkit-box-shadow: inset -9px -9px 14px -16px rgba(0,0,0,0.75);
    -moz-box-shadow: inset -9px -9px 14px -16px rgba(0,0,0,0.75);
    box-shadow: inset -3px -6px 14px -14px rgba(0,0,0,0.75);
    width: 15px;
    height: 15px;
    position: absolute;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
    border-top-right-radius: 50%;
    top: -6px;
    left: -16px;
    background: #F4F6F8;
}
.k{
 border-radius: 50%;
    position: absolute;
    width: 15px;
    height: 15px;
    background: #F4F6F8;
    top: -6px;
    left: -23px;
}
.khuyet2{
 transform: rotate(-238deg);
    -webkit-box-shadow: inset -9px -9px 14px -16px rgba(0,0,0,0.75);
    -moz-box-shadow: inset -9px -9px 14px -16px rgba(0,0,0,0.75);
    box-shadow: inset -3px -6px 14px -14px rgba(0,0,0,0.75);
    width: 15px;
    height: 15px;
    position: absolute;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
    border-top-right-radius: 50%;
    top: -6px;
    right: -16px;
    background: #F4F6F8;
}
.k2{
 border-radius: 50%;
    position: absolute;
    width: 15px;
    height: 15px;
    background: #F4F6F8;
    top: -6px;
    right: -23px;
}
.mB12{margin-bottom: 12px}
.bg-white{background-color: #fff}
.color-violet2{color: #632066}
.f32{font-size: 32px}
.mB80{margin-bottom: 80px}
.pRL5{padding-right: 5px;padding-left: 5px}
.w37p{width: 37%}

/* css mới */
.pRL20{padding-right: 20px;padding-left: 20px}