// Single Product Style

.product-details-img{
	&.product-details-tab{
		display: flex;
    	flex-direction: column;

		    	@media #{$tablet-device}{
		    		margin-bottom:50px;
		    	}
		    	@media #{$large-mobile}{
		    		margin-bottom:50px;
		    	}

    	.zoompro-wrap{
	    	&.zoompro-2 {
			    display: inline-block;
			    position: relative;
			    width: 100%;
			    float: left;
			    overflow: hidden;
			    .zoompro-border{
			    	&.zoompro-span{
			    		& img{
			    			width:100%;
			    		}
			    	}
			    } 
			}
    	}
	}
}

.product-dec-slider-2{
		display: inline-block;
	    float: left;
		    @media #{$large-mobile}{
		    margin:30px 0px 0px 0px;
		    }
	.swiper-slide {    
		margin: auto;
	    text-align: center;
	    -webkit-transition: all 300ms linear;
	    -moz-transition: all 300ms linear;
	    -ms-transition: all 300ms linear;
	    -o-transition: all 300ms linear;
	    transition: all 300ms linear;
	    outline:0px none;
		img {
	        width: 90px;
		    height: 90px;
		    margin: auto;
		    -webkit-transition: all 300ms linear;
		    -moz-transition: all 300ms linear;
		    -ms-transition: all 300ms linear;
		    -o-transition: all 300ms linear;
		    transition: all 300ms linear;
		    border: 1px solid#fff;
		    @media #{$extra-small-mobile}{
		        width: 60px;
			    height: 60px;
		    }
		    @media #{$extra-mini-mobile}{
		        width: 40px;
			    height: 40px;
		    }
		}
		&.swiper-slide{
			& .active{
				& img{
					 border:1px solid $theme-color;
				    -webkit-transition: all 300ms linear;
				    -moz-transition: all 300ms linear;
				    -ms-transition: all 300ms linear;
				    -o-transition: all 300ms linear;
				    transition: all 300ms linear;
				}
			}
		}
		&:hover{
			& img{
				border:1px solid $theme-color;
			}
		}
	}
}

.product-details-content{
		h2 {
	    color: #47494a;
	    font-size: 24px;
	    text-transform: capitalize;
	    line-height: 1;
	    font-weight: 400;
	    margin: 0 0 25px 0;
	}
	p{
	        font-size: 14px;
		    color: #1d1d1d;
		    font-weight: 700;
		    margin: 0 0 12px;
	    span{
	    	font-weight: 400;
	    }
	}
	.pro-details-rating-wrap {
	    display: flex;
		    .rating-product {
		    	& i{
		    		color:#fdd835;
		    		overflow: hidden;
				    width: 16px;
				    font-size:18px;
		    	}
		    	    margin-right: 20px;
			}

			.read-review {
					a {
				    text-decoration: none;
				    color: #1d1d1d;
				    position: relative;
				    margin-left: 8px;
				    line-height: 21px;
				    padding: 0;
				    font-size: 14px;
				    margin-bottom: 10px;
				    display: inline-block;
				    color:#253237;
				    &:before{
				    display: inline-block;
 					font-family: "Ionicons"; 
				    font-size: 16px;
				    font-weight: 400;
				    line-height: 1;
				    margin-right: 6px;
				    content:"\f3b2";
				    }
				    &:hover{
				    color:$theme-color;
				    }
				}
			}
	}
	.pricing-meta {
	    font-size: 24px;
	    color: #1d1d1d;
	    font-weight: 600;
	    line-height: 30px;
	    margin-bottom: 25px;
	    margin-top: 10px;
	}
	.pro-details-list{
		padding: 0 0 30px 0;
	    margin: 0 0 15px 0;
	    border-bottom: 1px solid #ebebeb;
	    display: inline-block;
	    width: 100%;
	    color: #888;
	    p{
	    font-weight:400;
	    color: #888;
	    line-height:24px;
	    margin:0;
	    }
		   li{
		    display: block;
		    width: 100%;
		    line-height: 24px;
	    }
	}
	.pro-details-quality {
	    display: inline-flex;
	    margin: 30px 0;
	    width: 100%;
	    .cart-plus-minus {
		    border: 1px solid #e8e8e8;
		    display: inline-block;
		    height: 48px;
		    overflow: hidden;
		    padding: 0;
		    position: relative;
		    width: 80px;
		    .qtybutton {
			    color: #8f8f8f;
			    cursor: pointer;
			    float: inherit;
			    font-size: 14px;
			    font-weight: 500;
			    line-height: 20px;
			    margin: 0;
			    position: absolute;
			    text-align: center;
			    -webkit-transition: all 0.3s ease 0s;
			    -o-transition: all 0.3s ease 0s;
			    transition: all 0.3s ease 0s;
			    width: 24px;
			}
			input{
				&.cart-plus-minus-box {
				    background: transparent none repeat scroll 0 0;
				    border: medium none;
				    color: #8f8f8f;
				    float: left;
				    font-size: 14px;
				    height: 48px;
				    margin: 0;
				    padding: 0;
				    text-align: center;
				    width: 80px;
				    outline: none;
				    @media #{$extra-mini-mobile}{
				    	width: 65px;
				    }
				}
			}
			.inc{
				&.qtybutton {
				    height: 48px;
				    padding-top: 14px;
				    right: 0;
				    top: 0;
				}
			}
			.dec{
				&.qtybutton {
				        height: 48px;
					    left: 0;
					    padding-top: 14px;
					    top: 0;
				}
			}
		}
		.pro-details-cart {
			& a {
			         position: relative;
				    padding: 0 55px;
				    line-height: 48px;
				    height: 48px;
				    font-size: 16px;
				    font-weight: 700;
				    border: none;
				    border-radius: 5px;
				    box-shadow: none;
				    text-transform: uppercase;
				    display: inline-block;
				    margin-left: 15px;
				    background: $theme-color;
				    color:#fff;
				    &:hover{
					    background-color:#1d1d1d;
				    }
				     @media #{$large-mobile}{
				     	padding:0 30px;
				     }
			}
		}
	}
	.pro-details-wish-com {
	    display: flex;
    	a {
		    line-height: 30px;
		    padding: 0;
		    border: none;
		    color: #555;
		    font-size: 14px;
		    margin-right: 15px;
		     i {
			    margin-right: 10px;
			}
			&:hover{
			color:$theme-color;
			}
		}
    }
    .pro-details-social-info {
	    display: flex;
	    border-bottom: 1px solid#ebebeb;
	    margin-top: 10px;
	    padding-bottom: 12px;
	    span {
		    display: inline-block;
		    float: left;
		    margin-right: 10px;
		    line-height: 30px;
		    font-weight: 700;
		    color: #47494a;
		    font-size: 14px;
		}
		.social-info {
		    a {
			    display: inline-block;
			    line-height: 30px;
			    height: 30px;
			    text-align: center;
			    color: #b4b4b4;
			    margin-right: 0;
			    white-space: normal;
			    text-indent: 0;
			    overflow: hidden;
			    padding: 0;
			    font-size: 18px;
			    width: 30px;
			    &:hover{
			    color:$theme-color;
			    }
			}
		}
	}
	.pro-details-policy {
	    margin: 25px 0 0;
	    li {
		    margin-bottom: 20px;
		    display:block;
		    &:last-child{
		    margin:0;
		    }
		    & span{
		    font-size: 14px;
		    color: #888;
		    overflow: hidden;
		    font-weight: 400!important;
		    }
		}
		img {
		    margin-right: 15px;
		}
	}
}
 
 .description-review-topbar{
 	&.nav{
 	    border-bottom: none;
	    position: relative;
	    display: block;
	    margin-bottom: 0;
	    margin: auto;
	    text-align: center;
	 	& a{
	 	background: transparent;
	    border: 0;
	    text-transform: capitalize;
	    line-height: 24px;
	    color: #888;
	    padding: 0 0 15px 0;
	    margin: 0 30px;
	    font-size: 20px;
	    font-weight: 600;
	    position: relative;
	    -webkit-transition: all 300ms linear;
	    -moz-transition: all 300ms linear;
	    -ms-transition: all 300ms linear;
	    -o-transition: all 300ms linear;
	    transition: all 300ms linear;
	    display: inline-block;
	    &:hover{
	    color:#1d1d1d;
		    &:after{
			 		background-color:$theme-color;
		    }
	    }

	 		&.active{
	 			color: #1d1d1d;
			 		&:after{
			 		background-color:$theme-color;
			 		}
	 		}
	 		&:after {
		    content: "";
		    height: 2px;
		    position: absolute;
		    left: 0;
		    right: 0;
		    bottom: -1px;
		    background: transparent;
		    -webkit-transition: all 300ms linear;
		    -moz-transition: all 300ms linear;
		    -ms-transition: all 300ms linear;
		    -o-transition: all 300ms linear;
		    transition: all 300ms linear;
		}
		 @media #{$large-mobile}{
		 margin:0 15px;
		 }
		 @media #{$small-mobile}{
		 margin:0 15px;
		 }
		 @media #{$extra-small-mobile}{
		 	margin: 0 5px;
    		font-size: 14px;
		 }
		 @media #{$extra-mini-mobile}{
    		font-size: 13px;
		 }
	 	}
 	}
 }


 	.description-review-bottom{
 		overflow: hidden;
	    font-size: 15px;
	    background: #fff;
	    line-height: 24px;
	    text-align: left;
	    padding: 40px 30px 30px 30px;
	    border: 1px solid #ebebeb;
		 @media #{$extra-mini-mobile}{
	    	padding: 40px 20px 30px 20px;
		 }
	 	.product-description-wrapper {
			 	p {
			    margin: 0 0 8px;
			    font-size: 15px;
			    line-height: 28px;
			    color: #69696c;
			    width: 84%;
			    @media #{$large-mobile}{
			    	width:100%;
			    }
			}
	 	}
	 	 .product-anotherinfo-wrapper{
	 	 	li {
			    color: #69696c;
			    font-size: 14px;
			    list-style: outside none none;
			    margin: 0 0 13px;
			    display:block;
			    span {
				    color: #1d1d1d;
				    display: inline-block;
				    font-weight: 500;
				    margin: 0 26px 0 0;
				    min-width: 85px;
				}
			}
	 	 }
	 	 .single-review {
		    display: -webkit-box;
		    display: -ms-flexbox;
		    display: flex;
		    margin: 0 0 50px;
		    .review-img {
			    -webkit-box-flex: 0;
			    -ms-flex: 0 0 90px;
			    flex: 0 0 90px;
			    margin: 0 15px 0 0;
			    @media #{$large-mobile}{
			    	margin: 0px 0px 20px 0px;
			    }
			}
			.review-top-wrap {
			    display: -webkit-box;
			    display: -ms-flexbox;
			    display: flex;
			    -webkit-box-pack: justify;
			    -ms-flex-pack: justify;
			    justify-content: space-between;
			    margin: 0 0 10px;
			    -webkit-box-align: center;
			    -ms-flex-align: center;
			    align-items: center;
			    .review-left {
				    display: -webkit-box;
				    display: -ms-flexbox;
				    display: flex;
				    .review-name {
					    margin-right: 25px;
						 @media #{$extra-mini-mobile}{
					    		margin-right: 10px;
						 }
					    & h4 {
						    font-size: 16px;
						    margin: 0;
						    line-height: 1;
						    font-weight: 500;
						}
					}
					.rating-product {
					    line-height: 1;
					    margin-bottom:6px;
					    & i {
						    overflow: hidden;
						    font-size: 18px;
						    color: #fdd835;
						}
					}
					& a {
					    color: #253237;
					    &:hover{
					    color:$theme-color;
					    }
					}
				}
			}
			.review-bottom {
				p {
				    margin: 0;
				    width: 93%;
				}
			}
			&.child-review {
			    margin-left: 70px;
			    margin-bottom: 0;
		    	@media #{$large-mobile}{
		    		 margin-left:0;
		    	}
			}
			@media #{$large-mobile}{
			display:block;
			}
		}
		.ratting-form-wrapper {
		    padding-left: 50px;
			  & h3 {
			    margin: 0;
			    font-size: 16px;
			    font-weight: 500;
			    line-height: 1;
			}
			.star-box {
			    display: -webkit-box;
			    display: -ms-flexbox;
			    display: flex;
			    margin: 6px 0 20px;
			    span {
				    margin: 0 15px 0 0;
				    font-size:15px;
				    color:#1d1d1d;
				}
				& i {
				    overflow: hidden;
				    font-size: 18px;
				    color: #fdd835;
				}
			}
			.rating-form-style {
			    margin-bottom: 10px;
			    & input {
				    height: 45px;
				    -webkit-box-shadow: none;
				    box-shadow: none;
				    padding-left: 10px;
				    font-size: 14px;
				    color: #1d1d1d;
				    width: 100%;
				    margin-bottom: 15px;
				    outline: none;
				    padding: 2px 10px 2px 20px;
				    background: transparent;
				    border: 1px solid #e6e6e6;
				    color: #333;
				    padding: 2px 10px 2px 20px;
				}
				textarea {
				    background: transparent;
				    border: 1px solid #e6e6e6;
				    color: #333;
				    height: 180px;
				    padding: 20px 10px 2px 20px;
				    margin-bottom: 20px;
				    width: 100%;
				    outline: none;
				}
			}
				.form-submit input {
			    padding: 0 55px!important;
			    line-height: 48px;
			    height: 48px;
			    font-size: 16px;
			    font-weight: 700;
			    border: none;
			    border-radius: 5px;
			    box-shadow: none;
			    text-transform: uppercase;
			    background: $theme-color!important;
			    display: block;
			    color: #fff!important;
			    width: 200px;
			    -webkit-transition: all 300ms linear;
			    -moz-transition: all 300ms linear;
			    -ms-transition: all 300ms linear;
			    -o-transition: all 300ms linear;
			    transition: all 300ms linear;
			    border: 1px solid #e6e6e6;
			    &:hover{
			    	background: #1d1d1d!important;
			    }
			}
			@media #{$tablet-device}{
		    		margin-top:50px;
		    		padding:0;
		    	}
		    	@media #{$large-mobile}{
		    		margin-top:50px;
		    		padding:0;
		    	}
		}
 	}

 	.single-product-slider-item{
 		& img{
 			border:1px solid#ebebeb;    
 			transition: all 300ms linear;
 			margin:auto;
 			width:100%;
 		}
 		&:hover{
 			img{
	 			border-color:$theme-color;
	 		}
 		}
 	}
