#right_slice .contentti{
    padding: 20px 2.5%;    
}

#right_slice #hakuehto{
    width:100%;
    height:60px;
    line-height: 60px;
    background-color: rgba(247,247,247,1.00);
    border-radius: 35px;
    outline: none;
    border:0;
    padding: 0px 20px;
    font-size: 15px;
    box-sizing: border-box;
    text-align: left;
}

#tuotelistax_wrap{
    display: none;
    flex-direction: column;
    position:fixed;
    top:0px;
    right:0px;
    left:0px;
    width:10%;
    height: 100vh;
    overflow:auto;
    background-color:rgba(37,37,37,0.4);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    padding: 10px 5%;
    gap:10px;
    box-sizing: border-box;
    box-shadow: 0px 0px 2px rgba(22,22,22,0.5);
    z-index: 944;
}

#tuotelistax_wrap div input[type="text"]{
    display: block;
    width:100%;
    height: 50px;
    line-height: 50px;
    min-height: 50px;
    border-radius: 15px;
    text-align: left;
    padding: 0px 4%;
    box-sizing: border-box;
    font-size: 15px;
    border: 0;
    outline: none;
}

#tuotelistax_wrap #sso {
    display: flex;
    width: 100%;
    height: auto;
    flex-direction: row;
    gap:0px 5px;
    margin: 20px auto 5px auto;
    align-items: center;
    justify-content: center;
}

#tuotelistax_wrap #sso select{
	width: auto;
	height:50px;
	line-height: 50px;
	font-size: 13px;
	font-weight: 500;
	padding: 0px 15px;
	border-radius: 25px;
	background-color: rgba(126,176,196,1.00);
	color:white;
	-webkit-appearance:none;
	border:0;
	margin: 0px 2px;
	transition: all 0.5s;
}

#tuotelistax_wrap #ssoo { 
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 0px;
    gap:5px;
}

#tuotelistax_wrap #ssoo h4{
    display: flex;
    min-width: 100%;
    height: auto;
    color:white;
    line-height: 32px;
    font-size: 22px;
    text-align: left;
}

#tuotelistax_wrap #ssoo p{
    display: flex;
    min-width: 100%;
    height: auto;
    color:rgba(215,226,229,1.00);
    line-height: 22px;
    font-size: 14px;
}

#tuotelistax_wrap #sso label{
    display: flex;
    width: 40px;
    height: 40px;
    background-color:red;
    color:white;
    line-height: 40px;
    font-size: 15px;
    align-items: center;
    justify-content: center;
    clip-path: circle();
}

#tuotelistax_wrap #tuotelistax{
    display: flex;
    flex-direction: column;
    width:auto;
    height: auto;
    align-items: center;
    justify-content: center;
    min-width: 200px;
    background-color:rgba(237,237,237,1.00);
    border-radius: 12px;
    padding: 10px;
    box-shadow: 0px 0px 2px rgba(22,22,22,0.5);
    z-index: 44;
}

#x22x{ display:block; }

#x22x:checked ~ #tuotelistax_wrap {
    display: flex;
    width: 100%;
}

#tuotelistax .tuotekortti{
    display: flex;
    flex-direction: row;
    width:100%;
    height: auto;
    min-height:58px;
    gap:0px 7px;
    margin:1px 0px;
    align-items: center;
    background-color: rgba(242,242,242,1.00);
    justify-content: space-between;
    overflow: hidden;
}

#tuotelistax .tuotekortti .status,
#tuotelistax .tuotekortti .q_img,
#tuotelistax .tuotekortti .q_prodimg{
    width:60px;
    height:auto;
    aspect-ratio:1/1;
    background-color: white;
    border-radius: 5px;
}

#tuotelistax .tuotekortti .status img,
#tuotelistax .tuotekortti .q_img img,
#tuotelistax .tuotekortti .q_prodimg img{
    width:100%;
    height: 100%;
    object-fit: contain;
}

#tuotelistax .tuotekortti .cntwrp{
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap:2px;
}

#tuotelistax .tuotekortti .cntwrp .q_title{
    width: 100%;
    padding-left: 15px;
    font-size: 15px;
    font-weight: 600;
    color:rgba(16,61,147,1.00);
    justify-content: flex-start;
    box-sizing: border-box;
}

#tuotelistax .tuotekortti .cntwrp .q_info{
    width: 100%;
    padding-left: 15px;
    font-size: 13px;
    color:rgba(48,48,48,1.00);
    font-weight: 300;
    justify-content: flex-start;
    box-sizing: border-box;
}

#tuotelistax .tuotekortti .q_price{
    width: 140px;
    padding: 0px 12px;
    font-weight: 800;
    font-size: 16px;
    text-align: right;
    box-sizing: border-box;
    justify-content: flex-end;    
}

#tuotelistax .tuotekortti .btnlis{
    width:auto;
    height:40px;
    line-height: 40px;
    font-size:14px;
    text-wrap:nowrap;
    border-radius: 15px;
    background-color: rgba(24,91,191,1.00);
    color:white;
    padding: 0px 15px;
    box-sizing: border-box;
    border:0;
    outline:none;
    -webkit-apperance:none;
}


#tuotekortti_wrap {
    width: 95%;
	box-sizing: border-box;
	padding: 12px;
	margin:15px auto;
	border-radius: 12px;
	background-color:rgba(222,220,220,1.00);
}

#tuotekortti_wrap .tuotekortti{
	position: relative;
	display: flex;
	flex-direction: row;
	width:100%;
	height: auto;
	min-height: 45px;
	background-color: rgba(255,255,255,1.00);
	text-align: left;
	padding: 1px 15px 1px 45px;
	border-radius: 5px;
	box-sizing: border-box;
	margin:2px auto;
	align-items: center;
	justify-content: space-between;
    box-shadow: 1px 2px 1px rgba(165,165,165,0.70);
}

#tuotekortti_edit input[type="submit"],
#tuotekortti_edit button{
    margin:10px 0px;
}

#right_slice #tuotekortti_wrap .disabled:after,
#right_slice #tuotekortti_wrap .available:after,
#right_slice #tuotekortti_wrap .popup:after{
	position: absolute;
	top:0px;
	left:0px;
	bottom:0px;
	content: "";
	margin: auto 0px;
	font-size: 40px;
	font-weight: 900;
	width:25px;
	height:25px;
	background-size: 25px;
    background-repeat: no-repeat;
    background-position: center;
	transform: translate(10px, 0px) scale(1, 1);
}

#right_slice #tuotekortti_wrap .popup:after{ background-image:url("https://cnt.ravintolat.online/imgs2/star-alt.svg"); }
#right_slice #tuotekortti_wrap .available:after{ background-image:url("https://cnt.ravintolat.online/imgs2/eye.svg"); }
#right_slice #tuotekortti_wrap .disabled:after{ background-image:url("https://cnt.ravintolat.online/imgs2/chatreadhidden.svg"); }

#right_slice .tuotekortti .q_title,
#right_slice .tuotekortti .q_price,
#right_slice .tuotekortti .q_alv {
	display: flex;
	width:auto;
	height:auto;
	line-height: 45px;
	font-size:15px;
	font-weight:700;
	margin:0px 0px;
	box-sizing: border-box;
	padding: 0px 3px;
	color:black;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	-webkit-appearance:none;
}

#right_slice select,
#right_slice button,
#right_slice label,
#right_slice input[type="button"],
#right_slice input[type="submit"]{
	width: auto;
	height:40px;
	line-height: 40px;
	font-size: 13px;
	font-weight: 500;
	padding: 0px 15px;
	border-radius: 25px;
	background-color: rgba(126,176,196,1.00);
	color:white;
	-webkit-appearance:none;
	border:0;
	margin: 0px 2px;
	transition: all 0.5s;
}

#right_slice select {
	position: relative;
	background-color: rgba(210,214,215,1.00);
	color:rgba(43,42,42,1.00);
}

#right_slice select:after{
	position: absolute;
	top:0px;
	right:0px;
	transform: rotate(90deg);
	content:">";
}

#right_slice label:hover,
#right_slice select:hover,
#right_slice input[type="submit"]:hover,
#right_slice input[type="button"]:hover,
#right_slice button:hover{
	background-color: rgba(46,132,167,1.00);
	transform:scale(1.05);
}

#right_slice .tuotekortti p { display: inline-block; white-space: nowrap; }

#right_slice .tuotekortti .q_title { width: 50%; } 
#right_slice .tuotekortti .q_price { 
    width: 30%; justify-content: flex-end;
}

#right_slice .tuotekortti .q_alv { 
    width:20%; justify-content: flex-end;
}

#right_slice .tuotekortti .status img{
    margin: auto;
	width: 25px;
	height: 25px;
}

#tuotekortti_edit_wrap{
    position: fixed;
    display: flex;
    top:0px;
    left:0px;
    width:100%;
    height:100vh;
    align-items: center;
    justify-content: center;
    transform: translate(150%, 0px);
    background-color:rgba(35,96,161,0.58);
    -webkit-backdrop-filter:blur(3px);
    backdrop-filter:blur(3px);
    transition: all 0.3s;
    z-index: 3333;
}

#tuotekortti_edit_wrap #tuotekortti_edit{
    width:90%;
    max-width:1050px;
    height: 100vh;
    background-color:rgba(35,55,120,0.975);
	padding: 50px 3%;
    overflow-y:auto;
    box-sizing: border-box;
    z-index: 8855;
}

#x22x{display:none; }
#tuotekortti_edit_wrap #tuotekortti_edit input[name='slide']{ display:none; }

#tuotekortti_edit_wrap #tuotekortti_edit .topto1,
#tuotekortti_edit_wrap #tuotekortti_edit .topto2 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap:0px 10px;
    width: 100%;
}

#tuotekortti_edit_wrap #tuotekortti_edit .topto1 #deleteprodbtn{
    background-color: red;
    background-image: linear-gradient(33deg, rgba(223,22,22,1.00) 22%, rgba(160,8,13,1.00) 95%);
}

#tuotekortti_edit_wrap #tuotekortti_edit .topto2 {
    background-color:rgba(218,218,218,1.00);
    border-radius: 20px;
    margin: 10px 0px 20px 0px
}

#tuotekortti_edit_wrap #tuotekortti_edit .topto2 label {
    width:auto;
    height: 40px;
    line-height: 40px;
    background-color:rgba(218,218,218,1.00);
    color:black;
    font-size: 12px;
    font-weight: 300;
    padding: 0px 20px;
    border-radius: 25px;
}

#tuotekortti_edit_wrap #tuotekortti_edit .slide01,
#tuotekortti_edit_wrap #tuotekortti_edit .slide02,
#tuotekortti_edit_wrap #tuotekortti_edit .slide03,
#tuotekortti_edit_wrap #tuotekortti_edit .slide03{
    display:none;
    flex-direction: column;
    gap: 3px 0px;
}

#tuotekortti_edit_wrap #tuotekortti_edit #r1:checked ~ .topto2 label:nth-of-type(1) { font-weight:800; text-decoration: underline; }
#tuotekortti_edit_wrap #tuotekortti_edit #r2:checked ~ .topto2 label:nth-of-type(4) { font-weight:800; text-decoration: underline; }
#tuotekortti_edit_wrap #tuotekortti_edit #r3:checked ~ .topto2 label:nth-of-type(2) { font-weight:800; text-decoration: underline; }
#tuotekortti_edit_wrap #tuotekortti_edit #r4:checked ~ .topto2 label:nth-of-type(3) { font-weight:800; text-decoration: underline; }


#tuotekortti_edit_wrap #tuotekortti_edit #r1:checked ~ .slide01{ display:flex; }
#tuotekortti_edit_wrap #tuotekortti_edit #r2:checked ~ .slide02{ display:flex; }
#tuotekortti_edit_wrap #tuotekortti_edit #r3:checked ~ .slide03{ display:flex; }

#tuotekortti_edit_wrap #tuotekortti_edit input,
#tuotekortti_edit_wrap #tuotekortti_edit select,
#tuotekortti_edit_wrap #tuotekortti_edit textarea {
	display: block;
	width:100%;
	height:40px;
	line-height: 40px;
	font-size:14px;
	font-weight:400;
	border-radius: 5px;
	border:0;
	background-color: rgba(231,231,231,1.00);
	margin:4px auto;
	box-sizing: border-box;
	padding: 0px 10px;
	-webkit-appearance:none;
}

#tuotekortti_edit_wrap #tuotekortti_edit .ins{
    display: flex;
    width: 100%;
    flex-direction: column;
    margin: 5px auto;
}

#tuotekortti_edit_wrap #tuotekortti_edit .tietoots{
	display: block;
	width: 100%;
	max-width: none;
	height: 17px;
	line-height: 17px;
	text-align: left;
	font-size:13px;
	font-weight: 400;
	padding: 0px 0px;
    color:aliceblue;
	margin: 0px auto 0px 0px;
	box-sizing: border-box;
}

#tuotekortti_edit_wrap #tuotekortti_edit .tietoots .lang_fi,
#tuotekortti_edit_wrap #tuotekortti_edit .tietoots .lang_en{
	width: 100%;
	height: auto;
}

#tuotekortti_edit_wrap #tuotekortti_edit #imgplaceholder{
    display: flex;
    width: 200px;
    height: 200px;
    overflow: hidden;
    object-position: center;
    background-color: white;
}

#tuotekortti_edit_wrap #tuotekortti_edit #imgplaceholder img{
    width:100%;
    height:100%;
    object-fit: contain;
}

#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap {
    display: flex;
    flex-direction: column;
    width:100%;
    height: auto;
    background-color:rgba(235,235,235,0.5);
    padding: 15px;
    box-sizing: border-box;
    border-radius: 15px;
}

#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice{
    display: flex;
    flex-direction: row;
    width:100%;
    height:40px;
    line-height: 40px;
    border-radius: 5px;
    background-color:rgba(226,226,226,1.00);
    padding: 0px 0px;
    margin: 3px 0px;
}

#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ma,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ti,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ke,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .to,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .pe,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .la,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .su{
    margin: 0;
    padding: 0px 20px;
    box-sizing: border-box;
}

#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ma:before,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ti:before,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ke:before,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .to:before,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .pe:before,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .la:before,
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .su:before{
    margin:0px 10px 0px 0px;
}

#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ma:before{ content: "Ma"; }
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ti:before{ content: "Ti"; }
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .ke:before{ content: "Ke"; }
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .to:before{ content: "To"; }
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .pe:before{ content: "Pe"; }
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .la:before{ content: "La"; }
#tuotekortti_edit_wrap #tuotekortti_edit #hinta_rules_wrap .customprice .su:before{ content: "Su"; }


#tuotekortti_edit_wrap #tuotekortti_edit textarea {
	height: 100px;
	line-height: 20px;
	padding: 10px 10px;
	box-sizing: border-box;
}

#tuotekortti_edit_wrap #tuotekortti_edit #mainoskuva{display:none; }

#tuotekortti_edit_wrap #tuotekortti_edit #label_valitse{ 
    width:auto;
    height: 45px;
    line-height: 45px;
    max-width: 150px;
    margin: 10px auto 10px 0px;
    padding: 0px 25px;
    border-radius: 25px;
    background-color: #386BCA;
    color:white;
}

#tuotekortti_edit_wrap #btn_upload_prod_image{ 
    display:none;
    width:auto;
    height: 45px;
    line-height: 45px;
    max-width: 150px;
    margin: 10px auto 10px 0px;
    padding: 0px 25px;
    border-radius: 25px;
    background-color: #75BACB;
    color:white;
    
}