.header-top3 .banner-flag,
.header-top3 .info-head,
.header-top3 .search-menu-area{display:none}
.account-menu-area{margin:3px 0px 0px 0px !important}
.header-top3,.header-fixh2{height:50px;}
.page-content{min-height: calc(100vh - 107px);}
.header-top3 .luxumenu-group .luxumenu-group-are{top:50px;}
.scroll-lr-list{
    scroll-behavior: smooth;
    overflow-x: auto;
    overflow-y: hidden;
}
.btn-next{float:right;margin-left:15px;}
.btn-back{float:right;margin-left:15px;background:#333;}



.tryonnew-left{float:left;width:100px;background:#000;height:calc(100vh - 50px);}
.tryonnew-left ul{margin:0px;padding:0px;}
.tryonnew-left ul li{list-style: none;padding:0px;margin:0px;}
.tryonnew-left ul li a{height:100px;display:block;text-align: center;padding:10px 0px;}
.tryonnew-left ul li a img{filter:brightness(0) invert(1);width:80px;opacity: .5;transition: .3s;}
.tryonnew-left ul li.active a img,.tryonnew-left ul li:hover a img{opacity: 1;}
.tryonnew-mid{float:left;width:calc(100% - 380px);padding:5px;padding-bottom:0px;}
.ai-library-radio li{width: calc(calc(100% / 6) - 8px);}
.footer-bottom{display:none;}
h3{margin-top:0px;margin-bottom:10px;padding-left:10px;padding-right:10px;}
.colour-list li label span{width:45px;height:45px;}
.header-top3 .container{width:100%;padding-left:100px;padding-right:30px;}
.tryonnew-right{width:280px;float:right;text-align: center;padding:0px 20px;}
#id_t_prompt{background:#f2f2f2;border:1px solid #ddd;padding:15px;font-size:18px;max-height:500px;}
#id_tryon_template_container .tryon-template{
    width: 110px;
    height: 150px;
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
    position:relative;
}
.tryon-template .remove-arealeft{
    position: absolute;
    left: 0;
    bottom: 0;
    height: 26px;
    width: 27px;
    background: #27422b;
    z-index: 1;
    color: #fff;
}
#id_tryon_template_container .tryon-template img{width:100%;height:100%;position:absolute;left:0;top:0;object-fit: cover;}

#upload_area2{width:180px;float:left;padding:0px;}
#id_tryon_template_container{position:absolute;bottom:0;right:10px;}
#upload_area2 #id_photo_img{width:100%;height:215px;object-fit: cover;}
.bottom-menu-right{position:absolutes;left:0;bottom:0;width:100%;padding:10px;}
#id_tryon_tags_container li{width:100%;margin-right:0px;}
.tab-content>.tab-pane{overflow-y: auto;overflow-x: hidden;}
.tryonnew-right{height: calc(100vh - 50px);padding-bottom: 130px;position: relative;}
.hairtype_container,.hairlength_container,.hairstyle_container{height:calc(calc(100vh / 3) - 80px);}
.key-lists li{float:left;margin:5px;width:calc(calc(100% / 5) - 20px);margin:0px 10px;height:calc(100% - 10px);}
.key-lists li label{width:100%;height:100%;position:relative;}
.key-lists li label.checked{border: 5px solid #27422b;}
.key-lists{height:calc(calc(100vh / 3) - 100px);}
.scroll-lr-list{scrollbar-width: thin;}
.area-center .remove-arealeft{background:#27422b;}
ul.key-lists{
	display: flex;
	padding: 0px;
	float: left;
	width: calc(100% + 10px);
}
ul.key-lists li{
	flex:none;
}
/* .key-lists{margin-left:-10px;margin-right:-10px;}
.key-lists li{width:150px;height:200px;margin:0px 10px 20px;}
.key-lists li label{width:100%;padding-bottom:120%;position:relative;}

.key-lists li label .detail{position:absolute;bottom:0;left:0;width:100%;background:rgba(0,0,0,.5);text-align: center;color:#fff;font-weight:600;font-size:18px;} */
.key-lists li img{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	object-fit: cover;
	border-radius: 10px;
	border: 1px solid #ddd;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}

#id_promp_tags_container{margin-top: -20px;display: table;width: 100%;}
#id_promp_tags_container li{height: 60px;vertical-align: middle;width: 100%;display: table-cell;}
#upload_area2{transition: .3s;transform: rotate(0deg);}
#upload_area2.mb-show{transform: rotate(-10deg);}
#id_tryon_template_container{transform: rotate(10deg);}
.mini-thumb{width:40px;height:40px;object-fit: cover;}
#id_tryon_tags_container{max-height:inherit}
#id_promp_tags_container{position:relative;}
#id_promp_tags_container .content-promp{position: absolute;
border: 2px solid #ddd;
padding: 10px;width:100%;
text-align: justify;
bottom: 50px;
background: #fff;
font-size: 14px;display:none;
font-weight: 500;}
#id_promp_tags_container.show{display:table !important;}
#id_promp_tags_container.show .content-promp{display:block;bottom:110%;left:0;}
#id_promp_tags_container button{border:2px solid #d00;color: #d00;font-weight:bold;font-size:14px;}
.area-center ul#id_promp_tags_container .remove-arealeft{border-radius: 0;padding-top: 5px;border-bottom-right-radius: 10px;border-top-right-radius: 10px;top: 0;right: 0;height: 100%;z-index: 1;padding-top:20px;}
.area-center ul li .remove-arealeft{padding-top:20px !important;}
.tryonnew-left ul li.active a{background:#fff;}
.tryonnew-left ul li.active a img{filter: brightness(1) invert(0);}
#id_t_prompt {
	max-height: 800px;
	height: calc(100vh - 300px);
}
.control-xs-tryon-right{display:none;}
#id_result_container{
	max-height:inherit;
}
.area-center ul li .remove-arealeft{border-radius: 0;
padding-top: 5px;
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
top: 0;
right: 0;
height: 100%;}
.header-top3 .container{margin:0px;width:100%;max-width: inherit;padding-left:30px;}
.info-head{display:block !important;float:left;margin-right:20px;}
.info-head-right{display:none;}
#id_templates_container{height: calc(100vh - 160px);}
.colour-list{height: calc(100vh - 160px);overflow: auto;}
.key-lists2{margin:0px;padding:0px;float:left;width:100%;}
.colour-list li,.key-lists2 li{list-style:none;margin:0px;float:left;width:calc(100% / 5);padding:10px;}
.colour-list li{width:calc(100% / 7);}
.colour-list li label,.key-lists2 li label{cursor: pointer;
    border: 1px solid #ddd;margin:0px;padding:0px;float:left;width:100%;padding-bottom:100%;position:relative;}
.colour-list li label img,.key-lists2 li label img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit: cover;}
.colour-list li label div.detail,.key-lists2 li label div.detail{
	position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    background: rgba(0, 0, 0, .5);
    padding: 5px;
    color: #fff;
    font-weight: 500;
}
.info-head img{height:40px !important;}
/* .colour-list li label{background-image:url(chai.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;} */
	.colour-list li label i{
		position: absolute;
		width: 100%;
		right: 0;
		text-align: left;
		font-weight: bold;
		font-size: 18px;
		left: 00px;
		padding: 5px 10px;
		top: 10px;
		text-shadow: 0px 0px 5px #fff !important;
	}
	.colour-list li label span{
		position: absolute;
		left: 0;
		width: 100%;
		top: 0;
		height: 100%;
		border: none;
		z-index: -1;
	}
	.colour-list li label div.circle-color{
		position: absolute;
		height: 40px;
		width: 40px;
		left: 20px;
		border-radius: 100%;
		bottom: 20px;
		border: 1px solid #ddd;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
	}
	.colour-list li label{border:5px solid #f2f2f2;}
	.colour-list li label.checked{border:5px solid #d00;}
.colour-list li label span{position:absolute;}
@media (max-width:768px){
	.tryonnew-mid{padding-top:77px;}
	.colour-list li{width:calc(100% / 2);}
	.colour-list li i{
    right: -5px;
    text-align: left;
    bottom: 50% !important;}
	.key-lists2 li{width:calc(100% / 3);}
	#upload_area2{margin-left:50px;}
	#id_tryon_template_container{display:block;right:50px;}
	.tryonnew-left{width:100%;position:fixed;top:0;left:0;height:66px;z-index: 2;}
	.tryonnew-left ul {
		margin: 0px;
		padding: 0px;
		float: right;
		padding: 0px 66px 0px 10px;
		width: 100%;
	}
	.tryonnew-left ul li{
		width:calc(100%/4);float:left;
	}
	.tryonnew-right{position: fixed;
		width: calc(100% - 0px);padding-top:20px;
		background: #f2f2f2;
		z-index: 2;right:0;transition: .3s;
		height: calc(100vh - 132px);padding-bottom:20px;
		top: 66px;left:-200%;overflow: auto;
	}
	.tryonnew-right.show{top: 66px;bottom:inherit;z-index: 3;left:0px;}
	.tryonnew-mid{width:calc(100% - 0px)}
	.tryonnew-left ul li a{height:66px;padding:0px 0px 0px;}
	.tryonnew-left ul li a img{height:60px;width:60px;}
	.ai-library-radio li{width:calc(calc(100% / 3) - 8px) !important;}
	.ai-library-radio {
		/* height: calc(100vh - 437px); */
	}
	#id_templates_container{padding-bottom:0px;}
	.key-lists li{width:calc(calc(100% / 2) - 20px);}
	.area-center{display:block;}
	#highlighted-justified-lib,#highlighted-justified-product,#highlighted-justified-promp{padding-top:0px;}
	.control-xs-tryon-right{
		position: absolute;display:block;
		left:initial;
		right: 0;
		bottom: 0;
		width: 66px;
		height: 66px;text-align: center;
		color: #fff;padding-top:14px;
	}
	.control-xs-tryon-right span{font-size:37px;}
	.tryonnew-left.show ul li.active a{background:#000;color:#fff;}
	.tryonnew-left.show ul li.active a img{filter: brightness(0) invert(1);opacity:.5;}
	.tryonnew-left.show .control-xs-tryon-right{background:#fff}
	.tryonnew-left.show span{color:#000;}
	#highlighted-justified-lib{}
}
.key-lists2 label img{border:4px solid transparent;border-radius:10px;}
.key-lists2 label.checked img{border:4px solid #27422b;}
.colour-list li label.checked span{border:4px solid #27422b;}