Mini Kabibi Habibi
.product-details,
.product-details .gallery-item-content {
height: 100%;
}
.product-details .product-image {
z-index: 999;
position: absolute;
top: 50%;
margin-top: -277px;
left: 220px;
rotation-point: 50% 50%;
rotation: 45deg;
-webkit-transform: rotate(45deg) scale(1, 1);
-moz-transform: rotate(45deg) scale(1, 1);
-o-transform: rotate(45deg) scale(1, 1);
-ms-transform: rotate(45deg) scale(1, 1);
}
.product-details .product-image.t1 img {
height: 550px;
}
.product-details .product-image.t3 {
margin-top: -152px;
left: 130px;
}
.product-details .product-image.t4 {
margin-top: -162px;
left: 130px;
}
.product-details .product-image.t2 {
margin-top: -172px;
left: 115px;
}
.product-details .product-image.t3 img{
height: 300px;
}
.product-details .product-image.t2 img{
width: 340px;
}
.product-details .product-image.t4 img{
width: 320px;
}
.product-details .product-image.t5,
.product-details .product-image.t6 {
width: 320px;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
-ms-transform: none;
margin-top: -162px;
left: 140px;
}
.product-details .product-image.t5 img,
.product-details .product-image.t6 img{
width: 320px;
}
.product-details .information-icon {
background: url(../images/information-icon.png) no-repeat 0 0;
width: 45px;
height: 45px;
cursor: pointer;
position: absolute;
top: 30px;
left: 35px;
}
.product-details .gallery.single .dx-gallery-nav-button-prev {
background: url(../images/arrow-left.png) no-repeat 0 0;
width: 30px;
height: 45px;
cursor: pointer;
position: absolute;
top: 50%;
margin-top: -23px;
left: 35px;
z-index: 999;
}
.product-details .gallery.single .dx-gallery-nav-button-next {
background: url(../images/arrow-right.png) no-repeat 0 0;
width: 30px;
height: 45px;
cursor: pointer;
position: absolute;
top: 50%;
margin-top: -23px;
right: 35px;
z-index: 999;
}
.product-details .gallery.single .dx-gallery-nav-button-next:active,
.product-details .gallery.single .dx-gallery-nav-button-prev:active {
margin-top: -21px;
}
.product-details .product-description {
width: 300px;
position: absolute;
right: 100px;
top: 30px;
}
.product-details .product-title {
font-size: 24px;
margin-bottom: 15px;
}
.product-details .product-price {
font-weight: bold;
font-size: 24px;
margin-top: 15px;
}
.product-details .product-property {
margin-bottom: 15px;
}
@media only screen and (orientation : portrait) {
.product-details .product-description {
top: 170px;
right: 50px;
}
.product-details .product-image {
left: 125px;
rotation-point: 50% 50%;
rotation: 45deg;
-webkit-transform: rotate(45deg) scale(0.65, 0.65);
}
.product-details .product-image.t2 {
left: 45px;
rotation-point: 50% 50%;
rotation: 45deg;
-webkit-transform: rotate(45deg) scale(0.65, 0.65);
}
.product-details .product-image.t3 {
left: 80px;
rotation-point: 50% 50%;
rotation: 45deg;
-webkit-transform: rotate(45deg) scale(0.9, 0.9);
}
.product-details .product-image.t4 {
left: 80px;
rotation-point: 50% 50%;
rotation: 45deg;
-webkit-transform: rotate(45deg) scale(0.9, 0.9);
}
.product-details .product-image.t5,
.product-details .product-image.t6 {
left: 80px;
}
}
@media only screen and (max-height : 620px) {
.product-details .product-image.t1 {
-webkit-transform: rotate(45deg) scale(0.9);
-moz-transform: rotate(45deg) scale(0.9);
-o-transform: rotate(45deg) scale(0.9);
-ms-transform: rotate(45deg) scale(0.9);
}
}
@media only screen and (max-height : 575px) {
.product-details .product-description {
top: 5px;
}
.product-details .product-title {
font-size: 16px;
}
.product-details .product-property {
font-size: 13px;
}
}
@media only screen and (max-height : 550px) {
.product-details .product-image.t1 {
-webkit-transform: rotate(45deg) scale(0.7);
-moz-transform: rotate(45deg) scale(0.7);
-o-transform: rotate(45deg) scale(0.7);
-ms-transform: rotate(45deg) scale(0.7);
}
.product-details .product-image.t3 {
}
.product-details .product-image.t2 {
-webkit-transform: rotate(45deg) scale(0.8);
-moz-transform: rotate(45deg) scale(0.8);
-o-transform: rotate(45deg) scale(0.8);
-ms-transform: rotate(45deg) scale(0.8);
}
.product-details .product-image.t4 {
-webkit-transform: rotate(45deg) scale(0.7);
-moz-transform: rotate(45deg) scale(0.7);
-o-transform: rotate(45deg) scale(0.7);
-ms-transform: rotate(45deg) scale(0.7);
}
.product-details .product-image.t5,
.product-details .product-image.t6 {
-webkit-transform: rotate(0) scale(0.7);
-moz-transform: rotate(0) scale(0.7);
-o-transform: rotate(0) scale(0.7);
-ms-transform: rotate(0) scale(0.7);
}
}