/* ---------------------------------------

/*** 

====================================================================
	 Fonts
====================================================================

***/
 
@import url('https://fonts.googleapis.com/css?family=Jost:200,300,400,500,600,700,800,900|Sora:500,700|Mitr:400,500,700&display=swap');

/*
	font-family: 'Mitr', sans-serif;
	font-family: 'Jost', sans-serif;
	font-family: 'Sora', sans-serif;
*/

/*** 

====================================================================
	 Resources / Css Files
====================================================================

 ***/
 
@import url('fontawesome.min.css');
@import url('flaticon.css');
@import url('elegent-icon.css');
@import url('animate.css');
@import url('swiper.css');
@import url('owl.css');
@import url('jquery.fancybox.min.css');
@import url('bootstrap.css');
@import url('main.css');
@import url('responsive.css');

/*** 

====================================================================
    Custom
====================================================================

 ***/
.bg-img{
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.bg-lighter{
	background-color: #fafafa;
}
 
/*Product Qty*/

.pdt_qty button{
    display: inline-block;
    vertical-align: top;
    color: #000;
    background-color: #fff !important;
    width: 25px;
    height: 25px;
    font: 20px/1 Arial,sans-serif;
    text-align: center;
    border: 0;
    border-radius: 0;
	padding: 0;
	margin: 0;
}
.pdt_qty button:hover{
    color: #fff !important;
    background-color: #f79631 !important;
}
.pdt_qty input {
    color: #fff;
    background: #000 !important;
    display: inline-block;
    vertical-align: top;
    font-size: 20px;
    font-weight: 500;
    line-height: 20px;
    padding: 0 2px;
	min-width: 30px;
    text-align: center;
}
.pdt_qty input{  
    border: 0;
    width: 2%;
}
.pdt_qty input::-webkit-outer-spin-button,
.pdt_qty input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.pdt_qty input[type=number] {
  -moz-appearance: textfield;
}
.pdt_qty input:disabled{
    background-color:white;
}

.delete_pdt {
	float: right;
	padding: 0;
	background: #e33;
	border: 0;
    color: #fff !important;
    font-weight: 600;
    font-size: 15px;
    line-height: 15px;
  }
  
 
/* checkout */
    
#billing .activity-checkout {
    list-style: none
}

#billing .activity-checkout .checkout-icon {
    position: absolute;
    top: -4px;
    left: -24px
}

#billing .activity-checkout .checkout-item {
    position: relative;
    padding-bottom: 24px;
    padding-left: 35px;
    border-left: 2px solid #fff;
}

#billing .activity-checkout .checkout-item:first-child {
    border-color: #fff !important;
}

#billing .activity-checkout .checkout-item:first-child:after {
    background-color: #fff !important;
}

#billing .activity-checkout .checkout-item:last-child {
    border-color: transparent
}

#billing .activity-checkout .checkout-item.crypto-activity {
    margin-left: 50px
}

#billing .activity-checkout .checkout-item .crypto-date {
    position: absolute;
    top: 3px;
    left: -65px
}



#billing .avatar-xs {
    height: 1rem;
    width: 1rem
}

.avatar-sm {
    height: 2rem;
    width: 2rem
}

#billing .avatar {
    height: 3rem;
    width: 3rem
}

#billing .avatar-md {
    height: 4rem;
    width: 4rem
}

#billing .avatar-lg {
    height: 5rem;
    width: 5rem
}

#billing .avatar-xl {
    height: 6rem;
    width: 6rem
}

#billing .avatar-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #3b76e1;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 500;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

#billing .avatar-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-left: 8px
}

#billing .avatar-group .avatar-group-item {
    margin-left: -8px;
    border: 2px solid #fff;
    border-radius: 50%;
    -webkit-transition: all .2s;
    transition: all .2s
}

#billing .avatar-group .avatar-group-item:hover {
    position: relative;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px)
}

#billing .card-radio {
    background-color: #fff;
    border: 2px solid #eff0f2;
    border-radius: .75rem;
    padding: .5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block
}

#billing .card-radio:hover {
    cursor: pointer
}

#billing .card-radio-label {
    display: block
}

#billing .edit-btn {
    width: 35px;
    height: 35px;
    line-height: 40px;
    text-align: center;
    position: absolute;
    right: 25px;
    margin-top: -50px
}

#billing .card-radio-input {
    display: none
}

#billing .card-radio-input:checked+.card-radio {
    border-color: #ffb032 !important
}


#billing .font-size-16 {
    font-size: 16px!important;
}
#billing .text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


#billing .form-control {
    display: block;
    width: 100%;
    padding: 0.47rem 0.75rem;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #545965;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e2e5e8;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.75rem;
    -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}

#billing .edit-btn {
    width: 35px;
    height: 35px;
    line-height: 40px;
    text-align: center;
    position: absolute;
    right: 25px;
    margin-top: -50px;
}
#billing .ribbon {
    position: absolute;
    right: -26px;
    top: 20px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    padding: 1px 22px;
    font-size: 13px;
    font-weight: 500
}

/* Button used to open the chat form - fixed at the bottom of the page */
.open-button {
  background-color: #41b43c;
  color: white;
  padding: 0px;
  border: none;
  cursor: pointer;
  opacity: 0.8;
  position: fixed;
  bottom: 5px;
  right: 5px;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  z-index: 9;
}

/* The popup chat - hidden by default */
.chat-popup {
  display: none;
  position: fixed;
  bottom: 0;
  right: 5px;
  border: 0;
  border-radius: 10px 10px 0px 0px;
  z-index: 99;
}

/* Add styles to the form container */
.form-container {
  max-width: 300px;
  background-color: white;
  border-radius: 10px;
  font-family: 'Poppins', sans-serif;
  font-size: 100%;
}
.form-container .chat-head{
  background: #41b43c;
  padding: 10px;
  color: #fff;
  border-radius: 10px 10px 0px 0px;
}
.form-container .chat-body{
  padding: 10px;
  background: url(https://user-images.githubusercontent.com/15075759/28719144-86dc0f70-73b1-11e7-911d-60d70fcded21.png);
  background-color: #efefef;
}
.form-container h1{
  font-size: 150%;
  margin-top: -2px;
}

/* Full-width textarea */
.form-container textarea {
  width: 100%;
  padding: 15px;
  margin: 5px 0 22px 0;
  border: none;
  background: #ffffff95;
  resize: none;
  min-height: 100px;
}

/* When the textarea gets focus, do something */
.form-container textarea:focus {
  background-color: #fff;
  opacity: 1;
  outline: none;
}

/* Set a style for the submit/send button */
.form-container .btn {
  background-color: #41b43c;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  width: 100%;
  margin-bottom:10px;
  opacity: 0.95;
}

/* Add a red background color to the cancel button */
.form-container .cancel {
  background: transparent;
  color: #f1f1f1;
  border: 0;
	padding: 0;
	float: right;
	font-weight: 300;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}

.wa-messenger-svg-whatsapp {
    fill: white;
    width: 65px;
    height: 65px;
    stroke: none;
}