/********************************************************************

Product gallery iconic system 

*********************************************************************/



.single-product-main-image {
    width: 45%!important;
    margin-right: 10%;
    padding-bottom: 0px;
    margin-left: 0px!important;
    float: left!important;
    position: relative;
    overflow: visible;
}

.single-product .avia-post-nav{
    display: none!important;
}


.iconic-woothumbs-images-wrap , .zm-viewer{
    border-radius: 10px;
    overflow: hidden;
}

.iconic-woothumbs-images-wrap{
        cursor: pointer;
}



.iconic-woothumbs-fullscreen{
    text-decoration: none!important;
}

.iconic-woothumbs-pswp {
    z-index: 99999999999999!important;
}

.pswp__bg{
    background: rgb(255, 255, 255)!important;
}

.pswp__img--placeholder--blank{
    background: rgb(235, 235, 235)!important;
}



.pswp__ui--fit .pswp__caption, .pswp__ui--fit .pswp__top-bar, .pswp__button--arrow--left:before, .pswp__button--arrow--right:before {
    background-color: transparent!important;
    opacity: 1!important;
}

#top .pswp__caption, .pswp__top-bar {
    background-color: transparent!important;
}

.pswp__counter {
    color: #000!important;
    opacity: 1!important;
}

.iconic-woothumbs-images-wrap{
        padding-right: 1px;
}

.pswp__button, .pswp__button--arrow--left:before, .pswp__button--arrow--right:before {
    background: url(https://onyxradiance.com/wp-content/uploads/2020/11/default-skin.png) no-repeat!important;
    background-size: 264px 88px!important;
}


.pswp__button--zoom {
    background-position: -88px 0!important;
}

.pswp__button--close {
    background-position: 0 -44px!important;
}

.pswp__button--share {
    background-position: -44px -44px!important;
}

.pswp__button--arrow--left:before {
    background-position: -138px -44px!important;
}

.pswp__button--arrow--right:before {
    background-position: -94px -44px!important;
}


.pswp__button--arrow--left, .pswp__button--arrow--right {
    background: 0 0!important;
}

.iconic-woothumbs-all-images-wrap--thumbnails-left .iconic-woothumbs-thumbnails-wrap--sliding {
    padding-right: 15px!important;
}

.iconic-woothumbs-thumbnails__image-wrapper {
    border-radius: 5px;
    margin-bottom: 15px!important;
}

.iconic-woothumbs-thumbnails__image-wrapper:after {
    display: none!important;
}

.iconic-woothumbs-thumbnails__slide--active .iconic-woothumbs-thumbnails__image-wrapper{
    border: 1px solid #c5c5c5;
}

    .iconic-woothumbs-zoom-bullets .slick-dots, .iconic-woothumbs-images .slick-dots {
    display: block!important;
    text-align: left;
    margin-left: 3%!important;
    bottom: 10px;
    left: 0!important;
}
    
    .iconic-woothumbs-all-images-wrap .slick-dots li button, .iconic-woothumbs-zoom-bullets .slick-dots li button{
    width: 8px!important;
    height: 8px!important;
    background: #afafaf96!important;
    border: 0px solid #333!important;
    cursor: pointer!important;
    }
    
    #top .iconic-woothumbs-all-images-wrap .slick-dots .slick-active button, #top .iconic-woothumbs-zoom-bullets .slick-dots .slick-active button {
        background-color: #cc6633!important;
        opacity: 1!important;
}
    
    .iconic-woothumbs-all-images-wrap .slick-dots li, .iconic-woothumbs-zoom-bullets .slick-dots li {
    margin: 0 1px!important;
            cursor: pointer!important;
}
    
    .iconic-woothumbs-hover-icons .iconic-woothumbs-images-wrap .iconic-woothumbs-icon {
    opacity: 0.8;
}


.single-product .woocommerce-product-details__short-description{
    margin-bottom: 0%;
}


.single-product .single-product-main-image .avia-wc-30-product-gallery-lightbox {
    display: none!important;
}

.zm-viewer {
    z-index: 99!important;
}



/********************************************************************

Responsive Rules - DESKTOP

*********************************************************************/



@media only screen and (min-width: 2000px) and (max-width: 3200px){}


@media only screen and (min-width: 1100px) and (max-width: 2000px){}



@media only screen and (max-width: 2000px){}

            
@media only screen and (max-width: 1700px){}


@media only screen  and (max-width: 1600px){}


@media only screen and (max-width: 1450px) {}


@media only screen and (max-width: 1370px) {}


@media only screen and (max-width: 1200px){}



@media only screen and (max-width: 1300px) and (min-height: 950px){}


@media only screen and (min-width: 1100px) and (max-width: 1450px){}




/********************************************************************

Responsive Rules - TABLETS

*********************************************************************/

/*
All Mobiles & tablets
================================================== */
@media only screen and (max-width: 1150px){}




/*
BIG tablets
================ */

@media only screen and (max-width: 1150px) and (orientation :  portrait){}


@media only screen and (max-width: 1150px) and (orientation : landscape){}




/*
SMALL tablets
================ */

@media only screen and (max-width: 1100px) and (orientation : landscape){}


@media only screen and (max-width: 1100px) and (min-height: 600px) and (orientation : landscape){}


@media only screen and (max-width: 990px){}


@media only screen and (max-width: 990px) and (orientation : portrait){}



@media only screen and (max-width: 780px) and (min-height: 900px)  and (orientation : portrait){}




/********************************************************************

Responsive Rules - MOBILE

*********************************************************************/



@media only screen and (max-width: 767px){


    .single-product-main-image {
        width: 100%!important;
        
    }


}

@media only screen and (max-width: 767px) and (orientation : portrait){}

@media only screen and (max-width: 767px) and (orientation : landscape){}



/*
iphone X
================ */
@media only screen and (device-width : 375px) and (device-height : 812px) and ( -webkit-min-device-pixel-ratio:3 ) and (orientation : portrait){}


/*
MOBILE XL
================ */

@media only screen and (min-width: 375px) and (max-width: 767px) and (orientation : portrait){}


/*
MOBILE M
================ */

@media only screen and (max-width: 375px) and (orientation : portrait){}

@media only screen and (max-width: 667px) and (orientation: landscape){}



/*
MOBILE SM
================================================== */

@media only screen and (max-width: 320px) and (orientation : portrait){}

@media only screen and (max-width: 568px) and (orientation : landscape){}