html{
    scroll-behavior:smooth;
    padding:0;
    margin:0;
}

body{
    background:#fff;
    padding:0 !important;
    margin:0;
    width:100%;
    height:100%;
    /* min-height:100vh; */
    display:flex;
    flex-direction:column;
    position:relative;
    color:#000;
    font-family: 'Montserrat', sans-serif;
}
main{flex:1;}
ul{padding:0;margin:0;}
li{list-style-type:none;}
a{display:inline-block;text-decoration:none;transition:all 0.2s;-webkit-transition:all 0.2s;-ms-transition:all 0.2s;-moz-transition:all 0.2s;}
a:hover, a:focus{text-decoration:none;transition:all 0.2s;-webkit-transition:all 0.2s;-ms-transition:all 0.2s;-moz-transition:all 0.2s;}
/* span{display:inline-block;} */
em, i{font-style:normal;display:inline-block;}
img{width:100% }
h1{font-size:34px;line-height:44px;margin:0;font-weight:700 }
h2{font-size:30px;line-height:40px;margin:0;font-weight:700 }
h3{font-size:26px;line-height:30px;margin:0;}
h4{font-size:21px;line-height:26px;margin:0;}
p{font-size:15px;line-height:24px;margin:0;padding:0;font-weight:500 }


.login-section {}

.login-section .col-md-4 {
    padding: 0;
}

.login-section .main-row {
    margin: 0;
}

.login-section .logo {
    padding: 30px;
    background-image: url('../images/side-banner.png');
    height: 100%;
    background-size: cover;
    background-position: bottom;
    /* height: 100vh; */
}
.login-section .logo img{
  width:155px;
}
.login-section .logo-sign-up {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
}

.login-section .logo-sign-up h1 {
    margin: 45px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 42px;
    line-height: 32px;
/* identical to box height, or 76% */
    text-align: center;
    color: #FFFFFF;
}
.login-section .logo-sign-up h4 {
    color: #FFFFFF;
}
.login-section .logo-sign-up p {
    margin: 5px 0 5px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 28px;
/* or 127% */
    text-align: center;
    color: #FFFFFF;
}

.login-section .logo-sign-up .btn-white-border {
    min-width: 200px;
    box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
    -webkit-box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
    -ms-box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
    -moz-box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
    outline: none;
    background: transparent;
    border-radius: 100px;
    text-align: center;
    color: #fff;
    padding: 10px 20px;
    font-size: 16px;
    line-height: 22px;
    border: 2px solid #fff;
    transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    text-decoration: none;
}

.login-section .logo .logo-box {
    width: 200px;
    margin: 50px auto 90px;
    display: block;
    text-align: center;
    height: 150px;
}
.login-section .logo .logo-box img{
    width: 100%;
}
.login-section .logo-sign-up .btn-Sign {
    width: 400px;
    height: 50px;
    margin: 0 auto;
    border: 2px solid #FFFFFF;
    border-radius: 25px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 45px;
    text-align: center;
    color: #FFFFFF;
}

.register-form .ragister-header {
    padding: 50px 50px 30px;
    text-align: left;
}

.signup-form {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.register-form {
    /* height: 100vh; */
}

.register-form .ragister-header h2 {
    font-style: normal;
    font-weight: 600;
    font-size: 42px;
    line-height: 32px;
/* or 76% */
    text-align: center;
    color: #080809;
    margin-bottom: 50px;
}

.register-form .ragister-header .form-group {}

.register-form .ragister-header .form-group h6 {
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 32px;
/* or 100% */
    color: #080809;
    margin-bottom: 15px;
}

.register-form .ragister-header .form-group label {
    font-family: Montserrat;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 14px;
/* identical to box height, or 78% */
    color: #333333;
    display: inline-block !important;
    margin-right: 15px;
}

.register-form .register-body {
    padding: 0 50px 30px;
    /* height: calc(100vh - 270px); */
    overflow: auto;
}

.register-form .register-body .register-card {}

.register-form .register-body .register-card h2 {
    font-family: Montserrat;
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 32px;
/* or 100% */
    color: #080809;
    margin-bottom: 30px;
}

.register-form .register-body .register-card .form-group {
    position: relative;
    margin-bottom: 30px;
}

.register-form .register-body .register-card .form-group .form-control {
    background: #FFFFFF;
    border: 1px solid #9EA4B0;
    border-radius: 50px;
    height: 50px !important;
    padding:  6px 18px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 14px;
/* identical to box height, or 78% */
    /* color: #9EA4B0; */
    color: black;
}

.register-form .register-body .register-card .form-group .eye-icon span {
    position: absolute;
    top: 12px;
    right: 20px;
    color: #9EA4B0;
    display: inline-block;
}


.check-box-lable {
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 30px;
/* identical to box height, or 200% */
    color: #000000;
}

.check-box-lable .control__indicator {
    top: 6px;
}
.check-box-lable a {
    font-weight: bold;
    font-style: italic;
    margin: 0 5px;
    color: #000;
}
button.btn-submit {
    background: var(--main_color);
    border-radius: 25px;
    width: 250px;
    height: 50px;
    border: none;
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 19px;
    line-height: 30px;
/* identical to box height */
    text-align: center;
    color: #FFFFFF;
    margin: 0 auto;
    display: block;
}

.register-text {
    padding: 50px 35px;
    height: 100vh;
}

.register-text .logo-box {
    width: 130px;
    margin-bottom: 30px;
}

.register-text .logo-box img {
    width: 100%;
    height: 100%;
}

.register-text p {
    font-family: Montserrat;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 25px;
/* or 143% */
    color: rgba(0, 0, 0, 0.6);
    margin-bottom: 10px;
}

.register-text p a {
    color: #814098;
    font-weight: bold;
}

.register-text h2 {
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 42px;
    line-height: 51px;
    text-transform: capitalize;
    color: var(--main_color);
    margin-bottom: 20px;
}

.register-text h3 {
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 32px;
    line-height: 39px;
/* identical to box height */
    text-transform: capitalize;
    color: #333333;
    margin-bottom: 20px;
}

.register-text ul {
    margin-bottom: 20px;
}

.register-text ul li {
    font-family: Montserrat;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 27px;
/* identical to box height */
    text-transform: capitalize;
    color: #333333;
    position: relative;
    padding-left: 18px;
}

.register-text .landing-text ul li:before {content: '';width: 10px;height: 10px;margin: 0 auto;background: #8d3f97;position: absolute;border-radius: 100%;left: 0;top: 8px;}

.register-text small {
    font-family: Montserrat;
    font-style: italic;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
/* identical to box height */
    /* text-transform: capitalize; */
    color: var(--main_color);
}


header {
    padding: 14px 0;
    background: #fff;
}

header .logo-menu-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

header .logo-menu-card .menu-list {}

header .logo-menu-card .menu-list a.mobile-menu {
    display: none;
}

header .logo-menu-card .menu-list ul {}

header .logo-menu-card .menu-list ul li {
    display: inline-block;
    margin-left: 15px;
}

header .logo-menu-card .menu-list ul li a {
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 15px;
    line-height: 22px;
    color: #000000;
}

header .logo-menu-card .right-header {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

header .logo-menu-card .right-header .select-language {
    margin-left: 15px;
}

header .logo-menu-card .right-header .select-language a.btn {
    background: #5c0e9d;
    min-width: 150px;
    border-color: #5c0e9d;
    border-radius: 5px;
}
.banner-section .banner-text {
    margin-top: 70px;
}
.banner-section {
    min-height: 100vh;
}
.banner-section .banner-text h1 {
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 50px;
    line-height: 64px;
/* or 148% */


/* Black */
    color: #303031;
}

.banner-section .banner-text p {
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 34px;
/* or 142% */
    letter-spacing: 0;

/* Gray */
    color: #66645E;
    margin: 35px 0;
}

.banner-section .banner-text .btn-beer {
    /* background: var(--main_color); */
    background:var(--main_color);
    border-radius: 8px;
    width: 360px;
    text-align: center;
    height: 50px;
    line-height: 50px;
    margin-bottom: 15px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;

/* identical to box height, or 150% */


/* White */
    color: #FFFFFF;
}

.home-pay-btn-beer {
    background: var(--main_color);
    border-radius: 8px;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    color: #FFFFFF !important;
}

.home-btn-beer {
    background: var(--main_color);
    border-radius: 8px;
    padding:15px;
    text-align: center;
    line-height: 50px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    color: #FFFFFF !important;
}
.banner-section {
    padding: 80px 0;
}

.forms-section {
    padding: 70px 0;
    background: linear-gradient(90deg, #6D4098 0%, #8D3F97 100%);
    position: relative;
}
.forms-section:before {
    content: '';
    background-image: url(../images/form-bg.png);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.forms-section .form-card {
    width: 876px;
    margin: 0 auto;
    background: #FFFFFF;
/* shadow */
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    padding: 40px;
}

.forms-section .form-card h2 {
    font-family: Montserrat;
    font-style: normal;
    font-weight: bold;
    font-size: 32px;
    line-height: 52px;
/* identical to box height, or 124% */
    color: #080809;
    text-align: center;
    margin-bottom: 20px;
}

.forms-section .form-card .form-group {
    margin-bottom: 20px;
}

.forms-section .form-card .form-group .form-control {
    background: #FFFFFF;
    border: 1px solid #9EA4B0;
    border-radius: 50px;
    height: 50px !important;
    padding: 6px 18px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 28px;
    /* color: #9EA4B0; */
    color: black;
}

.forms-section .form-card button.btn-submit {
    width: 38%;
    margin: 15px;
    font-size: 18px;
    display: inline-block;
}
.forms-section .form-card button.btn-submit:first-child {background: #ed2b47;}
.login-section .logo-sign-up .blue-btn:last-child {
    background: #5c0e9d;
    border-color: var(--main_color);
    margin: 15px 0;
}
footer {
    background: #333;
    text-align: center;
    padding: 10px;
    position: relative;
    /* left: 0;
    bottom: 0; */
    width: 100%;
    z-index: 999;
}
footer span {
    display: block;
    color: #fff;
    /* padding: 15px 10px; */
    text-align: center;
}

.register-text small a {
    color: #5c0e9d;
}

.forms-section .form-card p {
    font-size: 16px;
    margin: 0px 0 15px;
}
.forms-section .form-card .form-group span.selection {
    display: block;
}

.forms-section .form-card .form-group span.selection .select2-selection__rendered {line-height: 50px;color: black;}

.forms-section .form-card .form-group span.selection span.select2-selection.select2-selection--single {
    display: block;
    height: 50px;
    line-height: 50px;
    border-radius: 100px;
    padding: 0 15px;
}

.forms-section .form-card .form-group span.selection span.select2-selection.select2-selection--single span.select2-selection__arrow {
    top: 13px;
    right: 15px;
}
.forms-section .form-card .form-group .select2-container {
    height: 50px;
}

.select-language button {
    background: transparent;
    color: #000;
    border: solid 1px #ddd;
    padding: 9px 20px;
}
.select-language button:hover {
    color: #000;
    background-color: #fff;
    border-color: #ddd;
}
.select-language button:focus,.select-language button.active:focus{
     color: #000;
    background-color: #fff;
    border-color: #ddd;
    box-shadow: none;
}

.select-language .btn-info:not(:disabled):not(.disabled).active,
.select-language .btn-info:not(:disabled):not(.disabled):active,
.select-language .show>.btn-info.dropdown-toggle{
     color: #000;
    background-color: #fff;
    border-color: #ddd;
    box-shadow: none;

}
.select-language ul {
    padding: 10px;
    width: 100%;
}
.form-card .check-box-lable.ripple a {
    color: #5c0e9d;
}

.profile-card {
    border: solid 2px #5c0e9d;
    padding: 30px;
    margin: 30px 0;
    border-radius: 5px;
    background: #fff;
}

.profile-card .profile-img {
    width: 140px;
    height: 140px;
    background: #f1f1f1;
    margin: 10px auto;
    border-radius: 100px;
    overflow: hidden;
}

.profile-card .profile-text {}

.profile-card .profile-text .form-group {}

.profile-card .profile-text .form-group label {
    display: block;
    color: #333;
    font-size: 14px;
}

.profile-card .profile-text .form-group span {
    display: block;
    padding: 10px 16px;
    background: #f1f1f1;
    border-radius: 5px;
    font-size: 15px;
    color: var(--main_color);
    font-weight: 600;
}

.profile-list {
    padding: 0px;
    border: solid 2px var(--main_color);
}

.profile-list .profile-header {
    padding: 15px;
    background: var(--main_color);
}

.profile-list .profile-header h3 {
    font-size: 17px;
    text-transform: uppercase;
    font-weight: 600;
    color: #fff;
}
.profile-list .profile-body {
    padding: 15px;
}
.profile-box {
    padding: 50px 0;
    background: #f1f1f1;
}


.beer-profile {
    /* border: solid 1px #ddd; */
    /* overflow: hidden; */
    /* border-radius: 5px; */
    margin: 30px 0;
}

.beer-profile .beer-title {
    /* padding: 15px; */
    /* background: #f1f1f1; */
}

.beer-profile .beer-title h2 {
    text-align: center;
    font-size: 48px;
    margin-bottom: 30px;
}

.beer-profile .beer-body {
    /* padding: 30px; */
}

.beer-profile .beer-body .form-group {
    position: relative;
    margin-bottom: 10px;
}

.beer-profile .beer-body .form-group h6 {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 32px;
    color: #080809;
    margin-bottom: 10px;
}

.beer-profile .beer-body .form-group .control {
    font-family: Montserrat;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 14px;
    color: #333333;
    display: inline-block;
    margin-right: 15px;
}

.beer-inner-card {
    border: solid #f1f1f1 1px;
    border-radius: 5px;
    overflow: hidden;
    margin: 0px 0px 30px;
}

.beer-inner-card .beer-inner-title {padding: 15px;border-bottom: solid 1px #f1f1f1;}

.beer-inner-card .beer-inner-title h3 {
    font-size: 26px;
    color: #833f97;
    font-weight: 600;
}

.beer-inner-card .beer-inner-body {
    padding: 15px 15px 0;
}

.beer-inner-card .beer-inner-body .form-group {
    margin-bottom: 30px;
    position: relative;
}

.beer-inner-card .beer-inner-body .form-group .form-control {
    background: #FFFFFF;
    border: 1px solid #9EA4B0;
    border-radius: 50px;
    height: 50px !important;
    padding: 6px 18px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 14px;
    color: black;
}
.check-box-lable a {
    color: #5c0e9d;
}
.profile-selection {
    background: #fbfbfb;
    padding: 15px 15px 0;
    margin: 15px 0 30px;
    border-radius: 5px;
    border: solid 1px #f1f1f1;
}

.beer-profile .beer-body .form-group .control .control__indicator {
    top: -2px;
}
.beer-inner-card .beer-inner-body .form-group .form-control:focus {
    border: solid 2px #833f97;
    box-shadow: none;
}


.beer-profile .beer-body .form-group .control:after {
    top: 0;
}
.select2-container--default .select2-selection--single {
  height: 50px !important;
  border-radius: 50px !important;
}
.select2-selection__placeholder {
  padding: 6px;
  font-family: Montserrat;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 50px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 12px;
    right: 15px;
}
.ripple {
  margin-top:8px;
  font-size: 18px;
}
.control__indicator {
    height: 20px;
    width: 20px;
}
.control--radio .control__indicator:after {
    left: 2px;
    top: 2px;
    height: 14px;
    width: 14px;
}
.password-eye {
    float: right;
    font-size: 17px;
    position: absolute;
    right: 15px;
    top: 45px;
    color: #68768B;
    left: auto;
}
.password-eye-login {
    float: right;
    font-size: 17px;
    position: absolute;
    right: 15px;
    top: 15px;
    color: #68768B;
    left: auto;
}

.beer-listing {}

.beer-listing .beer-listing-card {
    border: solid 1px #f1f1f1;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
}

.beer-listing .beer-listing-card .beer-listing-header {
    background: #f1f1f1;
    padding: 10px;
}

.beer-listing .beer-listing-card .beer-listing-header h3 {
    font-size: 16px;
    color: #5c0e9d;
}

.beer-listing .beer-listing-card .beer-listing-body {
    padding: 15px;
}

.beer-listing .beer-listing-card .beer-listing-body .form-group {}

.beer-listing .beer-listing-card .beer-listing-body .form-group label {
    display: block;
    font-size: 14px;
    margin-bottom: 3px;
}

.beer-listing .beer-listing-card .beer-listing-body .form-group span {
    font-weight: 600;
    color: #000;
    display: block;
    margin: 0;
    font-size: 15px;
}

.Beer-listing{
    width: 100% !important;
}

.Btn-card {}

.Btn-card .btn {
    background: #f1f1f1;
    display: inline-block;
    margin-right: 5px;
}

.Btn-card .btn i {
    margin-right: 5px;
}

.Btn-card .btn-edit {
    background: #00adff;
    color: #fff;
    padding-right: 17px;
}

.Btn-card .btn-delete {
    background: #e23e3d;
    color: #fff;
}

.Btn-card .btn-green {
    background: #42ba96;
    color: #fff;
}
.Btn-card .btn-yellow {
    background: #baba42;
    color: #fff;
}

.beer-listing .beer-listing-card .beer-listing-body .form-group .approve {
    color: #32b932;
}
.beer-listing .beer-listing-card .beer-listing-body .form-group .pending {
    color: #ffa22e;
}
.beer-listing .beer-listing-card .beer-listing-body .qr-img {
    width: 150px;
    margin: 0 auto;
}

.select2-container{
    display: block;
    width: 100% !important;
}
.banner-img {
    width: 400px;
    margin: 0 auto;
    display: block;
}
.beer-inner-card .beer-inner-body .form-group strong {
    display: block;
    font-size: 17px;
    color: #000;
    margin-bottom: 8px;
    font-weight: 600;
}
.forms-section .form-card .form-group textarea.form-control {
    height: 120px !important;
    border-radius: 10px;
}
.text-center {
  text-align: center;
  display: block;
}
.print-label {
  margin-left: 23px;
}
.beer-listing .beer-listing-card .beer-listing-header h3 a {
    color: #8c3f97;
    font-size: 20px;
    margin-left: 5px;
}
.login-height{
    height: 100vh !important;
}
@media (max-width:767px){
    .register-form .register-body .register-card {
        padding: 20px;
        width: 100%;
    }
}