#main_container{
		margin-top:150px;
}
#order_progress{
	display: flex;
	justify-content: space-around;
}
.active-element{
	color:#20B99A;
}
.active-round{
	border:1px solid #20B99A;
}
.inactive-round{
	border:1px solid #000000;
}
.custom-input-group{
	position:relative;
	margin-top:15px;
}
.custom-label:focus,
.custom-label:active{
	font-size:13px;
}
#card-element,
.my-select,
.custom-input{
	width:100%;
	padding:10px;
	border:1px solid #555555;
	color:#555555;
	border-radius:3px;
}
.custom-input:focus,
.custom-input:active{
	outline: none !important;
}	
button:focus,
button:active,
input:focus,
select:focus{
	outline: none !important;
}
.pointer{
	cursor:pointer;
}
.black-hr{
	border:1px solid black;
}
.payment-details,
.order-confirmation{
	display: none;
}
/* PROGRESS BAR */
#progressbarContainer {
    display: grid;
    padding:0 30px;
}

#emptyProgressbar {
    height: 2px;
    width: 100%;
    margin: 22.5px 0;
    background: #CACACA;
}

#completedProgress {
    width: 0;
    background: #f85b1c;
    transition: 0.5s;
}

#progressbarContainer ul {
    width: 100%;
    display: flex;
    list-style: none;
    justify-content: space-between;
    margin-top: -37px;
    padding:0;
    line-height:25px;
}

#progressbarContainer ul li {
    width: 30px;
    height: 30px;
    font-size: 14px;
    color: rgb(100, 100, 100);
    text-align: center;
    border: 1px solid #CACACA;
    border-radius: 100%;
    background: white;

}
.current-step{
	border:2px solid #20B99A !important;
	color:#20B99A !important;
	font-weight: bold;
}
.completed-step{
	border:1px solid #20B99A !important;
	color:#20B99A !important;
	font-weight:normal;
}
.steps span{
	margin-left: -10px;
}
.back-link,
.back-link:hover{
	text-decoration: none;
	color:#707070;
}
.switcher{
  width:30px;
  height:10px;
  background: rgb(200,200,200) ;
  position:relative;
  border-radius:10px;
}

.switcher input{
  position:absolute;
  width:100%;
  height:100%;
  cursor:pointer;
  opacity:0;
  z-index:999;
}

.switcher .toogle{
  position:absolute;
  z-index:998;
  width:20px;
  height:20px;
  background: grey;
  top:-4px;
  -webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
	transition: all 0.2s ease;
  text-align:center;
  border-radius:100%;
  display:table-cell;
}
.switcher .toogle:before{
  content:"";
  color: #fff;
  text-shadow: 1px 1px #000;
  font-family:tahoma;
  font-size: 11px;
  vertical-align:middle;
}
.switcher input:checked ~ .toogle{
  margin-left:15px;
  background: #20B99A;
}
#billing_to_another_address{
	display: none;
}
#invoice_country{
	border:1px solid #20B99A;
}
#invoice_country_label{
	color:#20B99A;
	top:-10px;
	font-size:12px;
}
.steps span{
	margin-left: -10px;
}
.remove-item{
	height:35px;
	border-radius:5px;
	font-size:14px;
	padding:5px;
	border: 0.5px solid #707070;
	background: #ffffff;
	cursor: pointer;
}
.change-quantity{
	border-radius: 5px;
	color:#707070;
	height:35px;
}
.change-quantity{
	width:35px;
	height:35px;
	cursor: pointer;
}
.plus{
	background: #F0F2F2;
	margin-left:10px;
	border: 0.5px solid #707070;
}
.minus{
	background: #ffffff;
	margin-right:10px;
	border: 0.5px solid #F0F2F2;
}
.delivery-details p,
.billing-details p,
.checkout-details p{
	margin-bottom:0.2rem;
}
#edit-billing-modal .modal-content,
#edit-delivery-modal .modal-content {
	border-radius: 5px !important;
}
.scratched-text{
	text-decoration: line-through;
}
.main-wrapper{
	padding:30px;
}
.StripeElement{
	border:1px solid #555555;
	padding:13px;
	margin-top:15px;
	font-size:15px;
	border-radius: 3px;
}
.StripeElement::placeholder{
	font-size:15px;
}

.custom-label:focus,
.custom-label:active{
	font-size:13px;
}
.custom-input:focus,
.custom-input:active{
	outline: none !important;
}	
.custom-label{
	position: absolute;
	top:10px;
	background: white;
	left:5px;
	padding-right:5px;
	padding-left:5px;
}
.custom-label:focus,
.custom-label:active{
	font-size:13px;
}
#card-element,
.my-select,
.custom-input{
	width:100%;
	padding:10px;
	border:1px solid #555555;
	color:#555555;
	border-radius:3px;
}
.white-button,
.orange-button{
	display: block;
	width:100%;
	margin-top:15px;
	padding:10px;
	text-align:center;
	text-transform: uppercase;
	cursor:pointer;
	border:2px solid transparent;
}
.orange-button{
	color:#ffffff !important;
	background-color:#FBA919;
}
.white-button{
	border:2px solid #FBA919;
	color:#FBA919 !important;
	background-color:#ffffff;
}
.white-button:hover,
.orange-button:hover{
	text-decoration:none;
}
.white-button:hover{
	color:#FBA919 !important;
}


/*Javascript validation*/
.error{
	visibility: hidden;
	font-size: 12px;
}
.valid-input{
	border:1px solid #20B99A;
}
.invalid-input{
	border:1px solid #dc3545;
}
.focused-input{
	border:1px solid #555555;
}
.focused-label{
	top:-10px;
	font-size:11px !important;
	color:#5555555;
	transition:0.3s;
}

