/******************************* 
    3 - HOME CSS STARTS 
********************************/

/*---------------------- 3.1 Mian Slider Starts ---------------------------- */

/*-- Slider --*/
.single-slider-1 .slide-info {
    color: #ffffff;
    position: absolute;
    right: 10%;
    top: 50%;
    width: 250px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}
.single-slider-1 .slide-info p {color: #fff; margin: 25px auto 47px;}
.animated  {
    -webkit-animation-duration : 1s  ;
    animation-duration : 1s  ;

    -webkit-animation-delay : 100ms  ;
    animation-delay : 100ms  ;
}
.animate-out {
    -webkit-animation-delay : 0ms  ;
    animation-delay : 0ms  ;
}
.owl-dots-1 .owl-dots {
    bottom: 25px;
    position: absolute;
    right: 30px;
    text-align: center;
}
.owl-dots-1 .owl-dot {display: inline-block;}
.owl-dots-1 .owl-dot span {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #000000;
    border-radius: 0;
    font-size: 0;
    height: 6px;
    margin: 0;
    width: 20px;
    margin: 0 6px;
    display: inline-block;
}
.owl-dots-1 .owl-dot.active span {background-color: #000;}
.owl-nav-1 .owl-prev,
.owl-nav-1 .owl-next {  
    background-color: rgba(0, 0, 0, 0.4);
    font-size: 30px;
    height: 50px;
    line-height: 50px;
    position: absolute;
    text-align: center;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 50px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%); 
    -webkit-transform: translateY(-50%); 
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
}
.owl-nav-1 .owl-prev:hover,
.owl-nav-1 .owl-next:hover {background-color: #000;}
.owl-nav-1 .owl-prev i,
.owl-nav-1 .owl-next i {
    color: #ffffff;
    font-size: 30px;
}
.owl-nav-1 .owl-prev {left: 0; }
.owl-nav-1 .owl-next {right: 0; }
.owl-nav-1:hover  .owl-prev {left: 20px; opacity: 1;  visibility: visible;}
.owl-nav-1:hover .owl-next {right: 20px; opacity: 1; visibility: visible;}

/*-- ./Slider --*/

/*-- Feature --*/
.section-one .features-item-1 {position: relative; margin-bottom: 30px; }
.section-one .features-item-1 .img > img { width: 100%;}
.section-one .features-item-1 .title-1 {position: absolute; padding: 0 20px; right: 0; text-align: right; bottom: 13px}
.section-one .features-item-2 {
    background-color: #333333;
    height: 220px;
    position: relative;
    width: 100%;
    margin-top: 27px;
}
.section-one .features-item-2 .block-promo {
    display: inline-block;
    left: 0;
    position: absolute;
    text-align: center;
    top: 50%;   
    width: 100%;
    transform: translate(0px, -50%);
    -webkit-transform: translate(0px, -50%);
}
.section-one .features-item-2 p {font-size: 13px; color: #cccccc;}
@media (max-width: 1199px) {
    .section-one .row > div {margin-top: 30px;}
}
@media (max-width: 767px) {
    .single-slider-1 .slide-info {width: 80%;}
}
@media (max-width: 480px) {
    .single-slider-1 .main-title {font-size: 20px;}    
    .single-slider-1 .slide-info p {margin: 15px auto 17px;}
}
@media (max-width: 380px) {
    .single-slider-1 .slide-info p {display: none;}
}
/*-- ./Feature --*/

/*---------------------- 3.1 Mian Slider Ends ---------------------------- */

/*--------------------- 3.1 Promotion Starts ------------------------- */
.section-two .section-title {text-align: center; margin: 0 0 30px;}
.section-two .flex-item {overflow: hidden;}
.section-two .item-2 .content-block p{top: 50%;transform: translateY(-50%);position: absolute;width:100%;text-align: center;opacity:0; transition: all 250ms ease 0s;color:#fff;}
.section-two .item-2 .content-block:before {
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    bottom: 50%;
    content: "";
    left: 50%;
    opacity: 0;
    position: absolute;
    right: 50%;
    top: 50%;
    transition: all 250ms ease 0s;
    visibility: hidden;
}
.section-two .item-2:hover .content-block:before {
    bottom: 15px;
    left: 15px;
    opacity: 1;
    right: 15px;
    top: 15px;
    visibility: visible;
}
.section-two .item-2:hover .content-block p{opacity:1}
.section-two .row > div:hover .img {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}
.section-two .content-block > iframe {
    border: medium none;
    width: 100%;
    height: 345px;
}
@media (max-width: 991px) {
    .section-two .content-block > iframe {height: 270px;}
}
@media (max-width: 767px) {
    .section-two .row > div {margin-bottom: 30px;}
}
/*--------------------- 3.2 Promotion Ends------------------------- */

/*--------------------- 3.3 Our Products Starts------------------------- */
.section-three .theme-tabs-1 {text-align: center; width: 100%; display: inline-block;}
.section-three .theme-tabs-1 > li {
    display: inline-block;
    margin: 0 12px;
    position: relative;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
}
.section-three .theme-tabs-1 > li + li:before {  
    font-family: FontAwesome;
    content: "\f111";
    position: absolute;
    top: 6px;
    left: -15px;
    font-size: 8px;
    width: 8px;
    height: 8px;
    color: #999999;
}
.section-three .theme-tabs-1 > li a {color: #999;}
.section-three .theme-tabs-1 > li a:hover, .section-three .theme-tabs-1 > li.active a {color: #000;}
.section-three .tab-content {margin-top: 50px;}

.owl-nav-2 .owl-nav {
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: center;
    top: -25px;
    width: 110px;
}
.owl-nav-2 .owl-nav::before {
    border-bottom: 1px dashed #d5d5d5;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    top: 50%;
    width: 100%;
    z-index: -1;
}
.owl-nav-2 .owl-nav > div {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #cccccc;
    color: #999999;
    display: inline-block;
    font-size: 24px;
    height: 34px;
    line-height: 31px;
    margin: 0;
    padding: 0;
    position: absolute;
    text-indent: 0;
    top: 50%;    
    width: 34px;
    transform: translateY(-50%);
    transition: all 0.3s ease 0s;
    -webkit-transform: translateY(-50%);
    -webkit-transition: all 0.3s ease 0s;
}
.owl-nav-2 .owl-nav > div:focus, .owl-nav-2 .owl-nav > div:hover {background-color: #000; color: #fff;}
.owl-nav-2 .owl-nav .owl-prev {left: 0;}
.owl-nav-2 .owl-nav .owl-next {right: 0;}


/*---------------------- Product CSS Starts ---------------------------- */
.product-item {margin: 30px auto auto; display: table;}
.product-item .product-image {position: relative;}
.product-item:hover .product-image .img::before{ opacity: 1;}
.product-item .product-image .img::before {
    /*background-color: rgba(0, 0, 0, 0.5);*/
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    transition:  all 0.4s ease-in-out 0s;
    -webkit-transition:  all 0.4s ease-in-out 0s;
}
.product-item .product-image .product-hover{
    left: 0;
    opacity: 0;
    perspective: 500px;
    position: absolute!important;
    top: 0;
    transform: rotateY(-90deg);-moz-transform: rotateY(-90deg);-webkit-transform: rotateY(-90deg);-o-transform: rotateY(-90deg);
    transform-style: preserve-3d;-webkit-transform-style: preserve-3d;-moz-transform-style: preserve-3d;-o-transform-style: preserve-3d;
    transition: all 0.6s ease-in-out 0s;
    visibility: hidden;
    width: 100%;
}
.product-item:hover .product-image .product-hover{
    opacity: 1;
    transform: rotateY(0deg);-webkit-transform: rotateY(0deg);-moz-transform: rotateY(0deg);-o-transform: rotateY(0deg);
    transition: all 0.4s ease-in-out 0s;
    visibility: visible;
}
.product-item .product-image > ul {
    background-color: #ffffff;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 3px 5px 5px;
    position: absolute;
    vertical-align: middle;
    z-index: 2;
}
.product-item .color-swatch-item > li {
    display: inline-block;
    height: 15px;
    line-height: 0;
    vertical-align: middle;
    width: 15px;
}
.product-item .color-swatch-item img {
    border-radius: 50%;
    height: 15px;
    width: 15px;
}
.product-item .color-swatch-item a {
    display: inline-block;
    line-height: 0;
}
.product-item .quick-view a {
    background-color: #000000;
    bottom: 0;
    color: #ffffff;
    font-size: 24px;
    height: 40px;
    line-height: 40px;
    opacity: 0;
    position: absolute;
    right: -25px;
    text-align: center;
    visibility: hidden;
    width: 40px;
    z-index: 2;
}
.product-item:hover .quick-view a {visibility: visible; opacity: 1; right: 0;}
.product-item .quick-view a:focus, .product-item .quick-view a:hover {background-color: #fff; color: #000;}
.product-item .product-content {
    padding: 15px 10px;
    text-align: center;
}
.product-item .product-title a:hover, .product-item .product-title a:focus {color: #999;}
.product-item .price > b {
    color: #000000;
    font-size: 18px;
    margin-right: 5px;
}
.product-item .product-links > a {
    border: 1px solid #999999;
    color: #999999;
    display: inline-block;
    font-size: 17px;
    height: 40px;
    line-height: 40px;
    margin: 2px;
    vertical-align: middle;
    width: 40px;
}
.product-item .product-links > a:focus, .product-item .product-links > a:hover {
    color: #fff !important;
    background-color: #333;
    border-color: #333;
}
.product-item .product-content .rating {margin: 10px;}
.product-item .product-links {
    display: inline-block;
    margin-top: 15px;
    text-align: center;
    width: 100%;
}
.product-item .product-links > a.add-to-cart {
    color: #000000;
    font-size: 13px;
    font-weight: 600;
    padding: 0 20px;
    text-transform: uppercase;
    width: auto;
}

.product-item:hover .product-image .grid-image .product-hover {
    opacity: 1;
    transform: rotateY(0deg);-webkit-transform: rotateY(0deg);-moz-transform: rotateY(0deg);-o-transform: rotateY(0deg);
    transition: all 0.4s ease-in-out 0s;
    visibility: visible;
}
.product-item .product-image .grid-image .product-hover {
    left: 0;
    opacity: 0;
    perspective: 500px;
    position: absolute!important;
    top: 0;
    transform: rotateY(-90deg);-moz-transform: rotateY(-90deg);-webkit-transform: rotateY(-90deg);-o-transform: rotateY(-90deg);
    transform-style: preserve-3d;-webkit-transform-style: preserve-3d;-moz-transform-style: preserve-3d;-o-transform-style: preserve-3d;
    transition: all 0.6s ease-in-out 0s;
    visibility: hidden;
    width: 100%;
}
/*---------------------- Product CSS Ends ---------------------------- */


/*--------------------- 3.3 Our Products Ends ------------------------- */

/*-------------------------- 3.4 Home Blog Starts------------------- */
.home-post .post-wrap {margin-top: 30px; margin-bottom: 20px; color: #fff; position: relative;}
.home-post .post-wrap a {color: #fff;}
.home-post .post-wrap a:hover, .home-post .post-wrap a:focus {color: #000;}
.home-post .post-content {position: absolute; bottom: 0; left: 0; right: 0; padding: 20px; background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.5) 100%) repeat scroll 0 ;}
.home-post .post-meta {margin-bottom: 0; font-size: 12px;}
.home-post .post-meta li + li {padding-left: 10px;}
.home-post .post-meta span {margin-left: 10px;}
@media (max-width: 767px) {
    .home-post .post-wrap {display: table;}
}
/*---------------------- 3.4 Home Blog Ends------------------------- */

/*-------------------------- 3.5 Newsletter Starts------------------- */
.newsletter .mail-info {
    margin: 30px auto 20px;
    position: relative;
    width: 49%;
}
.newsletter .mail-info .form-control {height: 62px;}
.newsletter .mail-info .btn {
    font-weight: bold;
    position: absolute;
    right: 10px;
    top: 12px;
}
@media (max-width: 991px) {
    .newsletter .mail-info {width: 95%;} 
}
/*---------------------- 3.5 Newsletter Ends------------------------- */

 
 

/*---------------- 5.2 - Product Preview Popup Starts ------------------------ */
.product-modal .modal-content {
    border-radius: 0;
    display: inline-block;
    padding: 30px 10px;
    width: 100%;
}
.product-modal .close {
    background: #333333 none repeat scroll 0 0;
    color: #ffffff;
    display: inline-block;
    float: none;
    font-size: 24px;
    font-weight: normal;
    height: 40px;
    line-height: 40px;
    opacity: 1;
    position: absolute;
    right: 30px;
    text-align: center;
    text-shadow: unset;
    width: 40px;
    z-index: 1;
}
.product-modal .close:hover {
    background: #ececec none repeat scroll 0 0;
    color: #999999;
}

/*--- Product Slider Style 1 Starts ---*/
.owl-carousel .item:hover .caption-link, .product-fullwidth .item:hover .caption-link{
    opacity: 1;
    visibility: visible;
}
.sync1 {margin-bottom: 16px;}
.caption-link {
    background-color: #ffffff;
    text-align: center;
    border-radius: 3px;
    bottom: 0;
    display: inline-block;
    font-size: 16px;
    height: 30px;
    left: 0;
    line-height: 35px;
    margin: auto;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    width: 30px;
}
.sync2 .synced .item:before, .sync2 .item:hover:before {
    background-color: rgba(255, 255, 255, 0);
}
.sync2 .item:before {  
    background-color: rgba(255, 255, 255, 0.5);
    bottom: 0;
    content: "";
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0;
    transition: all 0.4s ease-in-out 0s;
    -website-transition: all 0.4s ease-in-out 0s;
}


.sync2 .item,.sync1 .item {  
    cursor: pointer;   
    text-align: center;   
    position: relative;
    transition: all 0.4s ease-in-out 0s;
    -website-transition: all 0.4s ease-in-out 0s;
}
.sync2 .owl-nav i {
    background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0;
    color: #ffffff;
    display: inline-block;
    font-size: 18px;
    height: 30px;
    line-height: 30px;
    position: absolute;
    text-align: center;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 30px;   
}
.sync2 .owl-nav i:hover {background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;}
.sync2 .owl-nav .owl-next i {right: 0;}
.sync2 .owl-nav .owl-prev i {left: 0;}

/*--- Product Slider Style 1 Ends ---*/

/*--- Product Content Starts ---*/
.product-detail {display: inline-block; width: 100%; vertical-align: middle; position: relative;}
.product-detail .section-title {margin: 0 0 10px;}
.product-detail .rating {margin-bottom: 20px;}
.product-detail .price > b {color: #000000; font-size: 24px;}
.product-detail .price > del {margin-left: 5px; font-size: 18px;}
.product-detail .price {margin-bottom: 20px;}
.product-detail .prod-lr-btn{ position: absolute; right: 0; }
.product-detail .prod-lr-btn a {
    display: inline-block;
    line-height: normal;
    position: relative;
    text-align: center;
    vertical-align: middle;
}
.product-detail .prod-lr-btn i {
    font-size: 24px;
    color: #000;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.product-detail .prod-lr-btn a::before {
    background-color: rgba(255, 255, 255, 0.5);
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0;
}
.product-detail .prod-lr-btn a:hover:before, .product-detail .prod-lr-btn a:hover i {opacity: 1;}

.product-detail .product-review {
    display: inline-block;
    margin-left: 10px;
}
.product-detail .product-review li , .product-detail .stock-detail li { line-height: 1; }
.product-detail .product-review li + li,.product-detail .stock-detail li + li { border-left: 1px solid #999; padding-left: 10px; }
.product-detail .stock-detail li + li{   margin-left: 17px; padding-left: 30px; }
.product-detail .stock-detail i {font-size: 18px; vertical-align: sub; margin-right: 5px;}
.product-detail .product-review a {padding-left: 5px;}
.product-detail .product-description p{ color: #666; }
.product-detail .color-optn a {
    border: 1px solid rgba(0, 0, 0, 0);
    display: inline-block;
    line-height: normal;
    padding: 2px;
    vertical-align: middle;
}
.product-detail .color-optn li {display: inline-block;}
.product-detail .color-optn a:focus, .product-detail .color-optn a:hover {border-color: #000;}
.product-detail .size-optn a {
    background-color: #efefef;
    color: #333333;
    display: inline-block;
    font-weight: 600;
    height: 25px;
    min-width: 25px;
    padding: 2px 6px;
    text-align: center;
}
.product-detail .size-optn a:focus, .product-detail .size-optn a:hover {background-color: #333; color: #fff;}
.product-detail .product-options label {
    color: #000000;
    display: inline-block;
    font-weight: 500;
    width: 100%;
    margin-bottom: 17px;
}
.product-detail .product-options .option {text-transform: uppercase;}
.product-detail .product-options .bootstrap-select .btn .filter-option {
    color: #999999;
    font-style: italic;
}
.product-detail .product-options .bootstrap-select .btn{
    height: 40px;
    line-height: 40px;
    padding: 5px 20px;
}

.product-detail .prod-btns {
    display: inline-block;
    margin-bottom: 40px;    
    width: 100%;
}
.product-detail .prod-btns > div {margin-top: 20px;}
.product-detail .add-to-cart .cart-btn{min-width: 200px; font-size: 18px;}
.product-detail .add-to-cart .cart-btn i {
    line-height: 0;
    margin-right: 7px;
    vertical-align: middle;
}
.product-detail .prod-btns .form-control.qty {
    color: #000000;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    width: 170px;
    line-height: normal;
}
.product-detail .prod-btns .quantity .btn {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    bottom: 0;
    padding: 0;
    position: absolute;
    top: 0;
    font-size: 22px;
}
.product-detail .prod-btns .quantity .minus {
    left: 10px;
}
.product-detail .prod-btns .quantity .plus{
    right: 10px;
}
.product-detail .prod-btns .quantity {
    position: relative;
    margin-right: 25px;
}
.product-detail .prod-btns > div{ display: inline-block; vertical-align: middle; }
.product-detail .quantity input[type=number]::-webkit-outer-spin-button,
.product-detail .quantity input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.product-detail .quantity input[type=number] {
    -moz-appearance:textfield;
}
.product-detail .prod-social ul{
    display: inline-block;
    vertical-align: middle;
}
.product-detail .prod-social li a {
    color: #cccccc;
    font-size: 16px;
}
.product-detail .prod-social li a:hover { color: #000; }

@media (min-width:1200px) {
    .product-modal{width: 1090px;}  
}
@media (max-width: 767px) {
    .prod-slider-wrap {margin-bottom: 50px;}
    .product-detail .product-review {display: block; margin: 10px 0 0 -5px;}
    .product-detail .stock-detail li + li {margin-left: 0; padding-left: 15px;}
}
/*---------------- 5.2 - Product Preview Popup Ends ------------------------ */
 



 
@media (min-width:1200px) {
    /*-- Product Preview Popup --*/    
    .product-modal{
        width: 1090px;
    }  
    /*-- / Product Preview Popup --*/   
}
 

.mail-info ::placeholder {
  color: #000;
  opacity: 1; /* important for Firefox */
}