/*
ul[data-attribute_name="mol_pod"] li{
	width:90px !important;
	height:90px !important;
}
ul[data-attribute_name="pas_pod"] li{	
	width:90px !important;
	height:90px !important;
}*/

ul.pc3d_framing li{	
	width:90px !important;
	height:90px !important;
}



.framing_info{
	margin-bottom:10px;
	margin-top:4px;
		
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	
	

}
@media screen and (max-width: 680px){
	.framing_info{
		grid-template-columns: repeat(3, 1fr);
	}
	
	.framing_info.total{
		grid-template-columns: repeat(1, 1fr);
	}
	
}

.framing_info.total{
	display:none;
	grid-template-columns: repeat(2, 1fr);
}

.framing_info img{	
	
	width:auto;
	height:100%;       
    position: relative;
    box-sizing: border-box;
    object-fit:contain;
    margin-left:auto;
    margin-right:auto;
    padding-top:5px;
    padding-bottom:5px;
    
}
.framing_info img:hover{
	opacity:0.8;
}

.fra-delete{
    width: 25px;
    position: absolute;
    margin-top: -10px;
    margin-left: 75px;
    padding: 0px;
    display: block;
    cursor: pointer;
}

/*.fra-delete::before{
    
    font-family:FontAwesome;
    content:"\f057";
    
    
    -webkit-font-smoothing:antialiased;
    
    position:relative;
   
    top:-15px;
    left:83px;
    
    color:#999;
    background:#fff;
    border-radius:50%;
    height:1em;
    width:1em;
    line-height:1;
    font-size: 1.25em;
}*/

/*.fra-delete:hover::before{
	color:#a00;
}*/

.fra-delete .icons-lib-s:hover{
	fill:#a00;
}

.div_framing_info {
	display: inline-block;	
	border: 1px solid #ccc;
	border-radius:1px;
	font-size:14px;
	text-align:center;
	box-shadow: 0 0.03rem 0.06rem rgba(0,0,0,0.1), 0 0.1rem 0.3rem rgba(0,0,0,0.1)
}

.div_framing_info.total {
	border: 2px solid #ccc;
	background-color: var(--pc3d-background-2);
}

.div_framing_info .span_title{
	display:inherit;
	text-align:center;
	font-size:15px;
	font-weight: 600;
	border-bottom: 1px solid #ccc;
	margin-bottom: 5px;
	/*text-transform:uppercase;*/
	background: #f7f7f7;
	width: 100%;
}

.div_framing_info #span_tot{
	/*background-color:red;*/
}

#tot_info{
	margin-right:4px;
}

#tot_info_ima{
	margin-left:4px;
	height: 147px;
	background-color: #f2f2f2;
	
}

/*SWIPER SLIDER*/

/*lunchbox*/
.lunchbox-framing {
   position: relative;    
   box-sizing: border-box;
   display: none;
}
@media (min-width: 37.5em) {
   .lunchbox-framing  {
      margin-left: auto;
      margin-right: auto;
      width: 92%;
      /* make room for arrows */
      padding-left: 2em;
      padding-right: 2em;
   }
}
@media (min-width: 43.75em) {
   .lunchbox-framing  {
      width: 96%;
   }
}

.swiper-wrapper-framing {
   /* now pagination is below slides */
   /*margin-bottom: 3em;*/
   margin-bottom: 1.5em;
   margin-top: 1.5em;
   /* just enough width so slides handing off screen are partially visible */
   width: 73.8%;
  
}
@media (min-width: 37.5em) {
   .swiper-wrapper-framing {
      width: 100%;
   }
}

.swiper-button-framing {
	margin-top:-45px !important;
}
.swiper-pagination-framing{
	bottom:-4px !important;
}
/*lunchbox*/

/*
.swiper-lazy-preloader:after {
	background-image: url(../images/loader1.svg) !important;
}*/

/*.swiper-button-prev, .swiper-button-next{
	opacity: 0.7 !important;
	background-size: 20px 44px !important;
}
.swiper-button-prev{
	left:0px !important;
}
.swiper-button-next{
	right:0px !important;
}
.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled {
    opacity: 0.3 !important;    
}*/

.swiper-container-framing{
    cursor: pointer !important;    
    padding:3px !important;
    box-sizing: border-box;
    /*min-height: 390px;*/
}
.swiper-container-framing h5 {
    font-size: 1rem;
    font-weight: 400;
    /*margin-bottom: 3em;*/
    text-align:center;
    /*cursor: pointer; */ 
}
.swiper-pagination-bullet-active {
    opacity: 1;
    background: #000 !important;
}

.framing-slide{
    border: 1px solid var(--pc3d-border-color);
    /*box-shadow: 0px 0px 5px #DDDDDD;*/
    box-sizing: border-box;
}
.framing-slide:hover{
	opacity:0.8;
	 
}
.frame-selected, .mat-selected, .mat1-selected, .mat2-selected, .glass-selected, .size-selected, .paper-selected, .gallery-selected{
	background-color: var(--active-slide);
}
.framing-slide img{
	
    border-radius: 0px;
    padding: 3px;
    /* width: 120px !important; */
    /* height: 120px !important; */
    margin: auto;
    object-fit: contain;
    box-sizing: border-box;
    max-width: 100%;
    display: block;
    -webkit-filter: drop-shadow(1px 1px 0 #ddddddaa) 
                    drop-shadow(-1px -1px 0 #ddddddaa);
    filter:drop-shadow(1px 1px 0 #ddddddaa) 
           drop-shadow(-1px -1px 0 #ddddddaa);
}

.framing-slide-title{

	width: 100%; 
	height: 20px; 
	cursor: pointer; 
	cursor: hand; 
	border-top: 1px solid #9e9e9e30;	
	overflow: hidden; 
	vertical-align: top;
	text-align:center;

}
.framing-slide-title p{
	font-size: 11pt; 
	line-height: 14pt;	
}	

.framing-slide-title i{
	float: right;
	margin-right:5px; 
	font-size: 10pt;	
	/*color:#DDDDDD;*/
}	

/* POPUP DIALOG*/
/*#framing-popup {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1001;
}*/

.framing-popup {    
    z-index: 1001;    
    position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 50%;
}


 
.framing-content-popup {
    margin:0px auto;
   /* margin-top:120px;*/
    position:relative;
    padding:10px;
    /*width:700px;*/
    min-height:500px;
    /*border-radius:4px;*/
    background-color:#FFFFFF;
    box-shadow: 0 2px 5px #666666;
}
 
.framing-content-popup h2 {
    color:#48484B;
    border-bottom: 1px solid #48484B;
    margin-top: 0;
    padding-bottom: 4px;
    
}
 
.framing-popup-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    display:none;
    background-color: rgba(0,0,0,0.65);/*#777777;*/
    cursor: pointer;
    /*opacity: 0.7;*/
}
 
.framing-close {
    position: absolute;
    right: 15px;
    font-size: 22px;    
}

.framing-close a{
    color: #48484B;        
}

.framing-main-div{
    margin-left: 25px;
    margin-right: 25px;    
}

.framing-main-div img{
	filter: drop-shadow(1px 1px 0 #ddddddaa) drop-shadow(-1px -1px 0 #ddddddaa);
    
}





.framing-label {
    display: inline-block;
    width: 100%;
    font-size: 10pt;
    font-family: arial, sans-serif;
    text-transform: uppercase;
    margin:0;
    color: black;
    font-weight: 600;
}

.framing-data {
    display: inline-block;
    width: 100%;
    font-size: 11pt;
    font-family: helvetica, arial, sans-serif;
    margin-bottom:3px;
    margin-left: 20px;
}

/*@media screen and (max-width: 1096px) {
	.framing-popup {
		width: 85%;
	}	
	.framing-content-popup h2 {
	   font-size: 20px;
	}
	
	.framing-content-popup{
	 min-height:300px;
	} 
    
}*/

.pc3d_tabcontent_mat {
  display: none;
}

.custom-input-container{
	/*display: inline-flex;*/
	display: grid;
	grid-template-columns: repeat(2,[col-start] 1fr);
	text-align:center;
	margin-top: 10px;
	margin-bottom: 10px;	
	/*margin-left: 20px;*/
    
}
.custom-size-container{
	padding: 4px 4px;
}

.custom-size-container label{
	font-weight: 700;
	float:left;
}

.custom-size-icon{
	position: absolute;    
    margin-top: 16px;
    margin-left: 10px;
}

.custom-size-unit{
   /* position: absolute;
    margin-top: -38px;
    margin-left: 187px;
    font-weight: 700;*/
    position: relative;
    margin-top: -38px;
    margin-right: 10px;
    font-weight: 700;
    float: right;
}

.custom-input-size{
	width: 100%;
    padding-left: 35px !important;
    height: 50px;
    background-color: white !important;
    border: 1px solid #ccc !important;
     -moz-appearance: textfield !important;    
}

.custom-input-size::-webkit-inner-spin-button, 
.custom-input-size::-webkit-outer-spin-button { 
  -webkit-appearance: none !important;  
  margin: 0; 
}


.custom-inputmat-container{	
	display: block;	
	text-align:center;
	margin-top: 10px;
	margin-bottom: 10px;	
}

.custom-mat-container{
	padding: 4px 4px;
	margin:auto;
	width: 50%;
}

@media screen and (max-width: 1096px) {
	.framing-popup {
		width: 85%;
	}	
	.framing-content-popup h2 {
	   font-size: 20px;
	}
	
	.framing-content-popup{
	 min-height:300px;
	} 
    .custom-input-container{		
		grid-template-columns: repeat(1,[col-start] 1fr);		
	}
	
	.custom-mat-container{
		width: 100%;
	}
}

.pc3d-atts-container {
	text-align:center;	
	margin-bottom: 5px;	
}

.pc3d-atts{
	display:flex;
	justify-content: center;
	cursor:pointer;
	padding-top: 6px;
	margin-bottom: 5px;
}

.pc3d-swatch-att{
	width:80px;
	margin: 5px;
	
}

.pc3d-swatch-att.att-selected{
	background-color: var(--active-slide);
}

.pc3d-select-att{
	width: 100%;
}

.noborder{
	border-bottom: none !important;
}

/* COLOR FILTER*/
.framing_color_container{
	text-align:center;	
	margin-bottom: 5px;	
}

.framing-swatch-color-ul{
	display: inline-flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
    margin-top:8px;
}
.framing-swatch-color-li{
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFFFFF;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3);
    padding: 2px;
    margin: 4px 8px 4px 0;
    width: 40px;
    height: 40px;
    border-radius:20px;
}
.framing-swatch-color-span{
	width: 100%;
    height: 100%;
    border-radius:20px;	
}

.framing-swatch-color-span:hover{
	opacity:0.8;
}

.framing-swatch-color-span.selected{
	  box-shadow: 0 0 0 3px var(--active-button);
}

/* CAT FILTER*/
.framing_cat_container{
	text-align:center;	
	margin-bottom: 5px;	
}

.framing-swatch-cat-ul{
	display: inline-flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
    /*margin:2px 0px 2px 0px;*/
    margin:0px;
    
}

.framing-swatch-cat-li{
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFFFFF;
   /* box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3);*/
    padding: 2px;
    margin: 4px 2px 4px 0;
    width: auto;
    height: 40px;
    border-radius: 4px;
    line-height: 33px;
}

/*
.framing-swatch-cat-span{
	width: 100%;
    height: 100%;
    border-radius:4px;	
}

.framing-swatch-cat-span:hover{
	opacity:0.8;
}

.framing-swatch-cat-span.selected{
	  box-shadow: 0 0 0 4px var(--active-button);
}*/

 .framing-swatch-cat-span {
  background-color: inherit;
  
  border: none !important;
  outline: none !important;
  cursor: pointer !important;
  padding: 4px 3px !important;
  transition: 0.3s !important;
  
  font-weight: 700;
  color: var(--pc3d-filter-txt-color);
  text-transform: uppercase;
 
  border: 2px solid var(--active-button) !important;  
  border-radius: var(--button-border-radius);
  
  /*margin-right: 4px !important;
  margin-bottom: 5px !important;
  min-width:79px;*/
  
  line-height:25px !important;  
  font-size: 11pt !important;
}


 .framing-swatch-cat-span:hover {
 	opacity:0.8;
 
  background-color: var(--hover-button);
  border: 1px solid var(--pc3d-border-color);  
  color:white;
}


 .framing-swatch-cat-span.selected {
  background-color: var(--active-button);
  border: 1px solid var(--pc3d-border-color);
  border-bottom: none;
  color:white;
}


.swiper-lazy-preloader-framing{
	display:none;
}

.framing_message{
	margin: 0;
	font-size: 14px;	
	color: red;
	text-align:center;
}

@media screen and (max-width: 1600px){
	/*#pc3d_editor_framing .pc3d_tabcontent{
		min-height:350px;		
	}	
	.swiper-container-framing{
		min-height: 300px;    	
	}
	.framing-slide img{
		width: 80px !important;
   		height: 80px !important;
	}*/
}