.account-container{
	& .account-title-label{
		padding: 2.25rem 0;
		font-size: 2.375rem;
		font-weight: 700;
		width:100%;
		color: #000000;
		text-transform: uppercase;
	}
	& .account-title{
		font-size: 20px;
		line-height: 24px;
		font-weight: 600;
		color: #000000;
		font-family: "Monserat",sans-serif;
		text-transform: uppercase;
	}
	& .account-menu{
		cursor: pointer;
		width: 100%;
		padding: 1.25rem 0;
		position: relative;
		font-weight: 600;
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 5px;
		text-transform: uppercase;
		&::before {
		  content: '';
		  position: absolute;
		  bottom: 0;
		  left: 0;
		  width: 100%;
		  height: 1px;
		  background-color: #707070;
		  z-index: 1;
		  font-weight: 600;
		  text-transform: uppercase;
		}
		& .order-nav-left{	
			display: flex;
			justify-content: flex-start;
			flex: 1;
			max-width: 25%;
			& span{
				font-size: 0.875rem;
				font-weight: 600;
				position: relative;
			}
		}
		& .order-nav-center{
			flex: 2;
			max-width: 50%;
			display: flex;
			justify-content: center;
			gap: 10rem;
			& .order-nav-center-right{
				cursor: pointer;
				flex: 1;
				display: flex;
				justify-content: center;
				& span{
					font-size: 0.875rem;
					font-weight: 600;
					position: relative;
				}
			}
		}
		& .order-nav-right{
			display: flex;
			justify-content: flex-end;
			flex: 1;
			max-width: 25%;
			& span{
				font-size: 0.875rem;
				font-weight: 600;
				position: relative;
			}
		}
	}
	& .body_account{
		width: 100%;
		& .account-form-holder{
			width: 100%;
			& form{
				& .account-section{
					padding: 40px 0;
					font-weight: 600;
					width: calc(100% - 40px);
					text-transform: uppercase;
					& .account-title{
						font-size: 20px;
						line-height: 24px;
						font-weight: 600;
						color: #000000;
						font-family: "Monserat",sans-serif;
						text-transform: uppercase;
						margin-bottom: 5px;
						width: 100%;
					}
					& .account-section-subtitle{
						font-weight: 400;
						color: rgba(153,153,153,1);
						font-size: 0.9rem;
						padding: 5px 0;
						width: 100%;
					}
					& .account-my-information{
						margin-bottom: 20px;
						padding: 20px 0;
						width: 100%;
						& .account-information-section{
							padding: 0 20px;
							background-color: rgba(229,229,229,1);
							width: 100%;
							& .account-information-header{
								font-size: 20px;
								line-height: 24px;
								font-weight: 600;
								color: #000000;
								font-family: "Monserat",sans-serif;
								text-transform: uppercase;
								padding: 20px;
								width: calc(100% - 20px);
							}
							& .account-form-group{
								padding-bottom: 45px;
								padding: 0 0 20px 0;
								width: 100%;
								display: grid;
								grid-template-columns: repeat(3, 1fr);
								gap: 20px;
								& .account-input-block{
									display: flex;
									flex-direction: column;
									& label{
										display:none;
									}
									& input{
										padding-left: 20px;
										padding-right: 20px;
										margin-bottom: 5px;
										font-size: 14px;
										border-radius: 25px;
										height:45px;
										border:1px solid #ccc;
										outline: none;
									}
									& select{
										padding-left: 20px;
										padding-right: 20px;
										margin-bottom: 5px;
										font-size: 14px;
										-moz-appearance: none;
										background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="black" d="M7 10l5 5 5-5H7z"/></svg>');
										background-position: right 10px center;
										background-repeat: no-repeat;
										right: 0;
										border-radius: 25px;
										cursor: pointer;
										border: none;
										height: 45px;
										width: 100%;
										text-transform: uppercase;
										outline:none;
									}
								}
								& .account-submit-wrap{
									width: 100%;
									max-width: 145px;
									margin-right: 15px;
									
									grid-column: 3;
									grid-row: 3;
									display: flex;
									justify-content: flex-end;
									align-items: center;
									justify-self: end;
									& input{
										padding: 0;
										padding-left: 0px;
									    font-size: 14px;
									    line-height: 18px;
									    font-weight: bold;
									    color: #ffffff;
									    font-family: "Monserat",sans-serif;
									    text-transform: uppercase;
										padding-left: 0;
										margin-bottom: 5px;
										width:calc(100% - 20px);
										outline: none;
										background-color: rgba(0,0,0,1);
										border-radius: 25px;
										cursor: pointer;
										height:45px;
										text-align: center;
									}
								}
							}
						}
						& .account-password-section{
							margin-top: 30px;
							padding: 0 20px;
							background-color: rgba(229,229,229,1);
							width: 100%;
							& .account-password-header{
								font-size: 20px;
								line-height: 24px;
								font-weight: 600;
								color: #000000;
								font-family: "Monserat",sans-serif;
								text-transform: uppercase;
								padding: 20px;
								width:calc(100% - 20px);
								display: inline-flex;
								align-items: center;								
								i.bi-eye,
								i.bi-eye-slash {
								  display: inline-block;
								  width: 26px;
								  height: 26px;
								  background-repeat: no-repeat;
								  background-position: center;
								  background-size: contain;
								  cursor: pointer;
								  font-weight:700;
								  position: relative;
								  margin-left: 8px;
								  cursor: pointer;
								}
								i.bi-eye {
								  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8M1.173 8a13 13 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5s3.879 1.168 5.168 2.457A13 13 0 0 1 14.828 8q-.086.13-.195.288c-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5s-3.879-1.168-5.168-2.457A13 13 0 0 1 1.172 8z'/%3E%3Cpath d='M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5M4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0'/%3E%3C/svg%3E");
								 }

								i.bi-eye-slash {
								 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7 7 0 0 0-2.79.588l.77.771A6 6 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13 13 0 0 1 14.828 8q-.086.13-.195.288c-.335.48-.83 1.12-1.465 1.755q-.247.248-.517.486z'/%3E%3Cpath d='M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829'/%3E%3Cpath d='M3.35 5.47q-.27.24-.518.487A13 13 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7 7 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12z'/%3E%3C/svg%3E");
								 }	
							}
							& .account-form-group{
								padding-bottom: 45px;
								padding: 0 0 20px 0;
								width: 100%;
								display: grid;
								grid-template-columns: repeat(3, 1fr);
								gap: 20px;
								& .account-input-block{
									display: flex;
									flex-direction: column;
									& label{
										display:none;
									}
									& input{
										padding-left: 20px;
										padding-right: 20px;
										margin-bottom: 5px;
										font-size: 14px;
										border-radius: 25px;
										border:1px solid #ccc;
										outline: none;
										color:#000 !important;
										background-color:#fff !important;
									}
								}
								& .account-submit-wrap{
									width: 100%;
									max-width: 145px;
									margin-right: 15px;
									
									grid-column: 3;
									grid-row: 3;
									display: flex;
									justify-content: flex-end;
									align-items: center;
									justify-self: end;
									& input{
										padding: 0;
										padding-left: 0px;
									    font-size: 14px;
									    line-height: 18px;
									    font-weight: bold;
									    color: #ffffff;
									    font-family: "Monserat",sans-serif;
									    text-transform: uppercase;
										margin-bottom: 5px;
										width:calc(100% - 20px);
										outline: none;
										background-color: rgba(0,0,0,1);
										border-radius: 25px;
										cursor: pointer;
										height:45px;
										text-align: center;
									}
								}
							}
						}
					}
					& .account-section-title{
						font-size: 20px;
						line-height: 24px;
						font-weight: 600;
						color: #000000;
						font-family: "Monserat",sans-serif;
						text-transform: uppercase;
						margin-bottom: 5px;
						width:100%;
					}
					& .account-section-subtitle{
						font-weight: 500;
						color: rgba(153,153,153,1);
						font-size: 0.9rem;
						padding: 5px 0;
						width:100%;
					}
					& .account-address-section{
						margin-top: 30px;
						padding: 0 20px;
						background-color: rgba(229,229,229,1);
						width: 100%;
						& .account-address-header{
							font-size: 20px;
							line-height: 24px;
							font-weight: 600;
							color: #000000;
							font-family: "Monserat",sans-serif;
							text-transform: uppercase;
							padding: 20px !important;
							width:calc(100% - 20px);
						}
						& .account-address-form-group{
							display: grid;
							grid-template-columns: 1fr 1fr;
							gap: 20px;
							& .account-input-block{
								display: flex; 
								flex-direction: column;
								& label{
									display:none;
								}
								& input{
									padding-left: 20px;
									padding-right: 20px;
									margin-bottom: 5px;
									font-size: 14px;
									border-radius: 25px;
									border:1px solid #ccc;
									outline: none;
									color:#000 !important;
									background-color:#fff !important;
									height:45px;
								}
							}
							& .account-input-block:nth-child(1),
							& .account-input-block:nth-child(2) {
								grid-column: span 1;
								justify-content: flex-start;
							}
							& .account-input-block:nth-child(3) {
								grid-column: 1 / -1;
							}
							& .account-input-block:nth-child(4) {
								grid-column: 1 / 2;
								justify-content: flex-start;
							}
							& .account-input-block:nth-child(5) {
								grid-column: 2 / 3;
								justify-content: flex-end;
							}
							& .account-input-block:nth-child(7) {
								grid-column: 1 / 2;
								justify-content: flex-start;
							}
							& .delivery_states_holder {
								grid-column: 2 / 3;
								justify-content: flex-end;
							}
						}	
						& .fourth-row {
							display: grid;
							grid-template-columns: 3fr 1fr;
							gap: 20px;
							align-items: center;
							padding: 30px 0px;
							& .account-billing-checkbox {
								justify-self: start;
								& label{
									cursor: pointer;
									text-transform: uppercase;
									font-weight:600;
									& input{
										margin-right: 15px;
										vertical-align: middle;
										width: 23px;
										height: 23px;
										accent-color: #000;
									}
								}
							}

							& .account-submit-wrap {
								justify-self: end; 
								max-width: 145px;
								margin-right: 15px;
								& input{
									padding: 0;
									font-size: 14px;
									line-height: 18px;
									font-weight: bold;
									color: #ffffff;
									font-family: "Monserat",sans-serif;
									text-transform: uppercase;
									margin-bottom: 5px;
									outline: none;
									background-color: #000;
									border-radius: 25px;
									cursor: pointer;
									height: 45px;
									text-align: center;
									min-width:125px;
								}
							}
						}
					}
					
				}
			}
		}
		
		& .notification-preferences{
			margin-bottom: 5px;
			font-size: 14px;
			padding: 40px 0;
			border-bottom: 1px solid #707070;
			width: 100%;
			& .account-title{	
				font-size: 20px;
				line-height: 24px;
				font-weight: 600;
				color: #000000;
				font-family: "Monserat",sans-serif;
				text-transform: uppercase;
			}
			& .notification-preferences-sub-title{
				font-size: 14px;
				line-height: 17px;
				font-weight: 500;
				color: #A8A8A8;
				font-family: "Monserat",sans-serif;
				text-transform: uppercase;
				margin-top: 5px;
				max-width: 840px;
				padding: 0 0 10px 0;
				width: 100%;
			}
		}	
		& .notification-preferences-inner{
			margin-bottom: 5px;
			font-size: 14px;
			width: 100%;
			& form{
				& .notification-item{
					border-bottom: 1px solid #707070;
					padding: 40px 0;
					display: flex;
					justify-content: flex-end;
					& .notification-info{
						margin-right: 10px;
						width: 100%;
						& .notification-label{
							font-size: 20px;
							line-height: 24px;
							font-weight: 600;
							color: #000000;
							font-family: "Monserat",sans-serif;
							text-transform: uppercase;
						}
						& .notification-text{
							font-size: 14px;
							line-height: 17px;
							font-weight: 500;
							color: #A8A8A8;
							font-family: "Monserat",sans-serif;
							text-transform: uppercase;
							margin-top: 5px;
							max-width: 840px;
						}
					}
					& .notification-toggle{
						width: auto;
						& .toggle{
							position: relative;
							display: inline-block;
							width: 74px;
							height: 36px !important;
							& input{
								display: none;
								width: 23px;
								height: 23px;
								font-size: 1.1rem;
								accent-color:#000;
							}
							& span{

							}
						}
					}
					& .submit-wrap{
						display: flex;
						justify-content: flex-end;
						width: 100%;
						max-width: 145px;
						align-items: center;
						margin-right: 15px;
						& input{
							padding: 0;
							font-size: 14px;
							line-height: 18px;
							font-weight: bold;
							color: #ffffff;
							font-family: "Monserat",sans-serif;
							text-transform: uppercase;
							padding-left: 0;
							margin-bottom: 5px;
							width: calc(100% - 20px);
							outline: none;
							background-color: rgba(0,0,0,1);
							border-radius: 25px;
							cursor: pointer;
							height: 45px;
							text-align: center;
						}
					}
				}
			}
		}
		
	}
}

.order_history_account{
	padding: 30px 0;
	width: 100%;
	text-transform: uppercase;
	& .tab-buttons-wrapper{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		& .button_active{
			margin-right: 1.3125rem;
			margin-left: 2.5625rem;
			background-color: #EBEBEB;
			font-weight: 600;
			width: 12.25rem;
			height: 2.8125rem;
			color: #000;
			border: 1px solid #000;
			border-radius: 1.5625rem;
			text-align: center;
			cursor: pointer;
			display: inline-block;
			background: none;
		}
		& .button_history{
			background-color: #fff;
		    font-weight: 500;
		    width: 12.25rem;
		    height: 2.8125rem;
		    color: #000;
		    border: 1px solid #000;
		    border-radius: 1.5625rem;
		    text-align: center;
		    cursor: pointer;
		    display: inline-block;
		}
	}
	& .orders-region{
		padding-bottom: 50px;
        border-bottom: 1px solid #707070;
		& .order_main{
			width: 100%;
			margin: 0 auto;
			padding: 1.6875rem 0 0 0;
			& .tab-order-list{
				max-width: 1174px;
				margin: 0 auto;
				width: 100%;
				& .tab-order-item{
					overflow: hidden;
				    width: 100%;
				    max-width: 1174px;
				    margin: 0 auto;
					& .tab-order-row{
						padding-bottom: 1.5rem;
						display: grid;
						grid-template-columns: 2.72% 17.98% 25.22% 18.22% 10.48% 10.14% 15.24%;
						align-items: left;
						width: 100%;
						& .tab-radio{
							display: flex;
							justify-content: center;
							align-items: center;
							width: 1.0625rem;
							height: 1.0625rem;
							grid-column: 1;
							align-self: center;
							padding-left: 5px;
							padding-right: 5px;
							& input{
								accent-color:#000;
								cursor:pointer;
							}
						}
						& .tab-image{
							grid-column: 2;
						    display: flex;
						    justify-content: center;
						    align-items: center;
						    text-align: center;
						    height: 100%;
							padding-left: 5px;
							padding-right: 5px;
							& img{
								width: 145px;
								height: 102px;
								border-radius: 4px;
								max-width: 100% !important;
								max-height: 100% !important;
								border: none;
							}
						}
						& .tab-details{
							grid-column: 3;
							padding-left: 5px;
							padding-right: 5px;
							& .r-title{
								margin: 0.5rem 0 0.75rem 0;
								font-size: 0.875rem;
								font-weight: 500;
								text-transform: uppercase;
							}
							& .r-artist{
								margin: 0;
								color: #A8A8A8;
								font-size: 0.875rem;
								font-weight: 500;
								text-transform: uppercase;
							}
							& .r-size{
								margin: 0;
								color: #A8A8A8;
								font-size: 0.875rem;
								font-weight: 500;
								text-transform: uppercase;
							}
						}
						& .tab-info{
							grid-column: 4;
							padding-left: 5px;
							padding-right: 5px;
							& .r-title{
								margin: 0.5rem 0 0.75rem 0;
								font-size: 0.875rem;
								font-weight: 500;
								text-transform: uppercase;
							}
							& .r-num{
								margin-bottom: 0.75rem;
								font-size: 0.875rem;
								font-weight: 700;
							}
							& .r-price{
								font-size: 0.875rem;
								font-weight: 500;
								text-transform: uppercase;
							}
						}
						& .tab-status{
							grid-column: 5;
							padding-left: 5px;
							padding-right: 5px;
							& .r-status-title{
								margin-top: 2.3125rem;
								margin-bottom: 0.75rem;
								& span{
									font-size: 0.875rem;
									font-weight: 500;
									text-transform: uppercase;
								}
							}
							& .r-transit{
								margin: 0;
								color: #A8A8A8;
								& span{
									font-size: 0.875rem;
									font-weight: 500;
									color: #A8A8A8;
									text-transform: uppercase;
								}
							}
						}
						& .tab-shipping{
							grid-column: 6;
							padding-left: 5px;
							padding-right: 5px;
							& .r-from{
								margin-top: 2.3125rem;
								margin-bottom: 0.75rem;
								text-transform: uppercase;
								& span{
									font-size: 0.875rem;
									font-weight: 500;
								}
							}
							& .r-country{
								margin: 0;
								color: #A8A8A8;
								text-transform: uppercase;
								& span{
									font-size: 0.875rem;
									font-weight: 500;
								}
							}
						}
						& .tab-delivery{
							grid-column: 7;
							padding-left: 5px;
							padding-right: 5px;
							& .delivery_title{
								margin-top: 2.3125rem;
								margin-bottom: 0.75rem;
								text-transform: uppercase;
								& span{
									font-size: 0.875rem;
									font-weight: 500;
								}
							}
							& .r-days{
								margin: 0;
								color: #A8A8A8;
								text-transform: uppercase;
								& span{
									font-size: 0.875rem;
									font-weight: 500;
									color: #A8A8A8;
								}
							}
						}
					}
					
					& .tab-order-row-history{
						padding-bottom: 1.5rem;
						display: grid;
						grid-template-columns: 2.72% 17.98% 25.22% 22.71% 17.04% 14.33%;
						align-items: left;
						width: 100%;
						& .tab-radio{
							display: flex;
							justify-content: center;
							align-items: center;
							width: 1.0625rem;
							height: 1.0625rem;
							grid-column: 1;
							align-self: center;
							padding-left: 5px;
							padding-right: 5px;
						}
						& .tab-image{
							grid-column: 2;
							display: flex;
							justify-content: center;
							align-items: center;
							text-align: center;
							height: 100%;
							padding-left: 5px;
							padding-right: 5px;
							& a{
								& img{
									width: 145px;
									height: 102px;
									border-radius: 4px;
									max-width: 100% !important;
									max-height: 100% !important;
									border: none;
								}
							}
						}
						& .tab-details{
							grid-column: 3;
							padding-left: 5px;
							padding-right: 5px;
							font-size: 0.875rem;
							font-weight: 500;
							text-transform: uppercase;
							& .r-title{
								margin: 0.5rem 0 0.75rem 0;							
							}
							& .r-artist{
								margin: 0;
								color: #A8A8A8;
							}
							& .r-size{
								margin: 0;
								color: #A8A8A8;
							}
						}
						& .tab-info{
							grid-column: 4;
							padding-left: 5px;
							padding-right: 5px;
							font-size: 0.875rem;
							font-weight: 500;
							text-transform: uppercase;
							& .r-title{
								margin: 0.5rem 0 0.75rem 0;	
								text-transform: uppercase;
							}
							& .r-address{
								margin: 0;
								color: #A8A8A8;
							}
							& .r-price{
								text-transform: uppercase;
							}
						}
						& .tab-shipped-history{
							padding-left: 5px;
							padding-right: 5px;
							font-size: 0.875rem;
							font-weight: 500;
							text-transform: uppercase;
							& .r-title{
								margin: 0.5rem 0 0.75rem 0;
							}
							& .r-transit{
							}
						}
						& .tab-status-history{
							padding-left: 5px;
							padding-right: 5px;
							font-size: 0.875rem;
							font-weight: 500;
							text-transform: uppercase;
							& .r-title{
								margin: 0.5rem 0 0.75rem 0;							
							}
							& .r-transit{
								margin: 0;
								color: #A8A8A8;
							}
						}
					}					
				}
			}
		}
		& .buttons_bottom{
			width: 100%;			
			& .edit_button{
				margin-right: 1.3125rem;
				margin-left: 2.5625rem;
				background-color: #fff;
				font-weight: 500;
				width: 12.25rem;
				height: 2.8125rem;
				color: #000;
				border: 1px solid #000;
				border-radius: 1.5625rem;
				text-align: center;
				cursor: pointer;
				display: inline-block;
				background: none;
				outline: none;
			}
			& .invoice_button{
				margin-right: 1.3125rem;
				width: 12.25rem;
			    height: 2.8125rem;
			    color: #000;
			    border: 1px solid #000;
			    border-radius: 1.5625rem;
			    text-align: center;
			    cursor: pointer;
			    display: inline-block;
				background: none;
				outline: none;
			}
			& .track_button{
				margin-right: 1.3125rem;
				width: 12.25rem;
				height: 2.8125rem;
				color: #000;
				border: 1px solid #000;
				border-radius: 1.5625rem;
				text-align: center;
				cursor: pointer;
				display: inline-block;
				background: none;
				outline: none;
			}
		}
	}
}

.order-nav-left .link-underline-bold::after,
.order-nav-left .link-underline::after {
    content: '';
    position: absolute;
    left: 0;
    right: -0.625rem;  
    bottom: -1.30rem;
    width: calc(100% + 0.625rem);  
    height: 3px;
    background-color: #000;
    z-index: 3;
}

.order-nav-center-left .link-underline-bold::after,
.order-nav-center-right .link-underline-bold::after,
.order-nav-center-left .link-underline::after,
.order-nav-center-right .link-underline::after {
    content: '';
    position: absolute;
    left: -0.625rem;  
    right: -0.625rem;  
    bottom: -1.30rem;
    width: calc(100% + 1.25rem);
    height: 3px;
    background-color: #000;
    z-index: 3;
}

.order-nav-right .link-underline-bold::after,
.order-nav-right .link-underline::after {
    content: '';
    position: absolute;
    left: -0.625rem;  
    right: 0;
    bottom: -1.30rem;
    width: calc(100% + 0.625rem);  
    height: 3px;
    background-color: #000;
    z-index: 3;
}

.link-underline::after {
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.3s ease;
}

.link-underline:hover::after {
    transform: scaleX(1);
}
@media (max-width: 768px) {
  .account-form-group {
    grid-template-columns: repeat(1, 1fr);
  }
}

.history_num_order{
	border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
    padding: 14.5px 0;
    margin-bottom: 14.5px;
	width: 100%;
	& .r-number{
		margin-left: 2.5625rem;
		font-size: 0.875rem;
		font-weight: 600;
		text-transform: uppercase;
	}
	& .r-date{
		padding-left: 31px;
		font-size: 0.875rem;
		font-weight: 600;
		text-transform: uppercase;
	}
}
.button_order_gray{
	background-color: #EBEBEB !important;
    font-weight: 600 !important;
}
.button_order_white {
  background-color: #fff !important;
  font-weight: 500 !important;
}

.toggle .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: auto;
  background-color: #EBEBEB;
  transition: .4s;
  border-radius: 30px !important;
  opacity: 1 !important;
}
.toggle .slider::before {
  position: absolute;
  content: "";
  height: 22px;
  width: 22px;
  left: 7px;
  top: 50%;
  background-color: #000000;
  transition: .4s;
  border-radius: 50%;
  transform: translateY(-50%);
}
input:checked + .slider::before {
  transform: translate(37px, -50%);
  top: 50%;
  background-color: white;
}
input:checked + .slider {
  background-color: black;
}

.modal:not(.hidden) {
  display: block;
}
.modal {
  display: none;
  position: fixed;
  z-index: 1050;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
}
.modal-content {
  position: absolute;
  width: 675px;
  height: 381px;
  background-color: #fff;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
}
.close-btn {
  position: absolute;
  top: -10px;
  left: -10px;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  font-size: 18px;
  color: #fff;
  background-color: #333;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}
.modal-grid {
  width: 100%;
  display: grid;
  grid-template-rows: repeat(2, 1fr);
}
.modal-row {
  display: flex;
  justify-content: space-between;
}
.first-row-first-col {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  margin-left: 52px;
  margin-right: 41px;
  box-sizing: border-box;
}
.modal-col {
  flex: 1;
}
.first-row-first-col {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  margin-left: 52px;
  margin-right: 41px;
  box-sizing: border-box;
  & #emailNotificationInvoicePopup{
	  
  }
}
.modal-row .modal-col:first-child p {
  font-size: 14px;
  line-height: 1.6;
  color: #333;
  margin: 73px 0 0 0;
  max-width: 100%;
}
.first-row-first-col p {
  flex-shrink: 0;
  font-weight: 600;
}
.modal-button-email {
  align-self: flex-start;
  margin-bottom: 10px;
  flex-shrink: 0;
  display: block;
  margin-top: 10px;
  width: 196px;
  height: 47px;
  color: #000;
  border: 1px solid #000;
  border-radius: 1.5625rem;
  text-align: center;
  cursor: pointer;
  display: inline-block;
  background: none;
  outline: none;
}
.email-notification-popup.hidden {
  display: none;
}
.email-notification-popup, .email-notification-invoice-popup {
  position: fixed;
  top: 20%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 20px;
  background-color: #f8f9fa;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  text-align: center;
  z-index: 1000;
  display: none;
  & #emailNotificationMessage{
	margin:0;
  }
  & #emailNotificationInvoiceMessage{
	margin:0;
  }
}
.modal-row .modal-col:first-child p {
  font-size: 14px;
  line-height: 1.6;
  color: #333;
  margin: 73px 0 0 0;
  max-width: 100%;
}
.email-notification-popup button, .email-notification-invoice-popup button{
  margin-top: 10px;
  padding: 5px 10px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}
.second-row-first-col {
  position: relative;
  width: 384px;
  height: 149px;
  margin-left: 52px;
  margin-bottom: 32px;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  box-sizing: border-box;
  margin-right: 41px;
}
.modal-logo {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 101px;
  height: 37px;
  object-fit: contain;
  margin-bottom: 32px;
  max-width: 100% !important;
  max-height: 100% !important;
  border: none;
}
.modal-row .modal-col:nth-child(2) {
   /*width: 267px;
  height: 206px;
  display: flex;
  align-items: center;
  justify-content: center; */
  box-sizing: border-box;
  overflow: hidden;
  margin-top: 26px;
}
.modal-col p {
  margin: 0;
}
.modal-artist {
  margin-top: 10px !important;
}
.modal-artist, .modal-size, .modal-category {
  color: #ABABAB;
}
.modal-image {
  width: 267px;
  height: 206px;
  object-fit: cover;
  max-width: 100% !important;
  max-height: 100% !important;
  vertical-align: middle;
  border: none;
}
.first-row-first-col-text {
  width: 384px;
  height: 232px;
  margin-left: 52px;
  margin-right: 41px;
  box-sizing: border-box;
  text-align: left;
  display: flex;
  align-items: center;
}

.notification-preferences-sub-title{
	font-size:14px;
	line-height:17px;
	font-weight:500;
	color:#A8A8A8;
	text-transform:uppercase;
	margin-top:
	5px;max-width:840px}
	@media (max-width: 576px){
		.notification-preferences-sub-title{
			font-size:12px
			}
		}
		.toggle{
			position:relative;
			display:inline-block;
			width:74px;
			height:36px !important
		}
		.toggle input{
			display:none
		}
		.toggle .slider{
			position:absolute;
			cursor:pointer;
			top:0;
			left:0;
			right:0;
			bottom:0;
			height:auto;
			background-color:#EBEBEB;
			transition:.4s;
			border-radius:30px !important;
			opacity:1 !important
		}
		.toggle .slider:before{
			position:absolute;
			content:"";
			height:22px;
			width:22px;
			left:7px;
			top:50%;
			background-color:#000000;
			transition:.4s;
			border-radius:50%;
			transform:translateY(-50%)
		}
		input:checked+.slider{
			background-color:black
		}
		input:checked+.slider:before{
			transform:translate(37px, -50%);
			top:50%;
			background-color:white
		}
	}
}
.tab-order-item-mobile .tab-image{
	width: 250px;
	height: 200px;
	overflow: hidden;
	position: relative;
}
#mobileForm:not(.hidden) {
  display: block;
}

#mobileForm{
	display: none;
	position: fixed;
	z-index: 1050;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
}