:root {     
    --genesis-share-bg-color: #FFF;   
    --genesis-share-bg-variant-color: #F0F0F0; 
    --genesis-share-bg-variant-color-mobile: #EEE;   
    --genesis-share-txt-color: #333;  
    --genesis-share-txt-color-variant: #999;    
    --genesis-share-close-icon: url(/_i/icon-20-c-close.png); 
}    
@media (prefers-color-scheme: dark) {             
:root {     
    --genesis-share-bg-color: #000;   
    --genesis-share-bg-variant-color: #333; 
    --genesis-share-bg-variant-color-mobile: #444;   
    --genesis-share-txt-color: #FFF;  
    --genesis-share-txt-color-variant: #CCC;    
    --genesis-share-close-icon: url(/_i/icon-20-a-close.png); 
}   
}                       
.genesis-window-share .close-button {
    background: var(--genesis-share-close-icon) center center no-repeat;
}         
.genesis-window-share {
    background: var(--genesis-share-bg-color);    
    color: var(--genesis-share-txt-color);
    border-radius: 3px;  
}                 
.genesis-window-share .info {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;  
    padding: 30px 20px;   
}
.genesis-window-share .info img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    object-position: center;
}             
.genesis-window-share .info strong {
    font-size: 20px;
    font-weight: 400;
    line-height: 22px;
    max-height: 92px;  
    max-width: 500px;    
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;   
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical; 
}                 
.genesis-window-share .info strong b {   
    color: var(--genesis-share-txt-color-variant);
    display: block; 
    font-size: 16px;
    font-weight: 400;
    padding-bottom: 5px;
    text-transform: uppercase;
}           
.genesis-window-share .buttons {   
    background: var(--genesis-share-bg-variant-color);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 20px;  
    padding: 20px; 
    border-radius: 0 0 3px 3px;   
}           
.genesis-window-share .buttons input[type="text"] {
    -webkit-touch-callout: all;
    -webkit-user-select: all;
    -khtml-user-select: all;
    -moz-user-select: all;
    -ms-user-select: all;
    -o-user-select: all;
    user-select: all;  
    width: 1px;
    opacity: 0; 
}      

.share-button {    
    background-color: #000;
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    width: 40px;
    height: 40px;
    margin: 0;   
    border-radius: 5px; 
    transition: all 0.2s linear;   
    transform: translateZ(0);  
}       
.share-button i {
    display: none;
}   
.share-button.facebook-button {
    background-color: #4267B2;
}                           
.share-button.messenger-button {
    background-color: #4080FF;
}  
.share-button.twitter-button {
    background-color: #5DD7FC;          
    background-color: #55ACEE;          
    background-color: #1DA1F2;          
    background-color: #000;    
} 
.share-button.googleplus-button {
    background-color: #DD4B39;
}    
.share-button.linkedin-button {
    background-color: #0274B3;
} 
.share-button.tumblr-button {
    background-color: #34465E;
} 
.share-button.pinterest-button {
    background-color: #CB2027;
}                       
.share-button.wykop-button {
    background-color: #F58739;
}                       
.share-button.whatsapp-button {
    background-color: #25D366;
}                       
.share-button.email-button {
    background-color: #E1574A;
}                       
.share-button.sms-button {
    background-color: #12A9B5;
}                       
.share-button.copy-button {
    background-color: #99A;
}                   
.share-button.more-button {
    background: #F9F9F9 url(/_i/icon-20-c-arrow-right.png) center center no-repeat;
    cursor: pointer;
}                       
.share-button.more-button:hover {
    background-color: #FFF;
}   
.genesis-window-share .share-button {   
    display: block;
    float: left; 
    width: 60px;
    height: 60px;
    min-width: 60px;
    margin: 0;   
    border-radius: 5px; 
    transition: all 0.2s linear;   
    transform: translateZ(0);  
}  

.art-content .share-buttons-wrapper {
    position: absolute;  
    padding: 0;  
    margin: 0;  
    bottom: 111px;
    top: 0;    
    left: 0;
    width: 60px;   
    z-index: 35;     
}       
.art-content .share-buttons {
    background: rgba(255, 255, 255,0.8);
    position: sticky;  
    padding: 0 0 10px 0;  
    margin: 0; 
    top: 140px;
    width: 100%;       
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
    border-radius: 3px;
}        
.art-content .share-buttons .share-button-more {  
    background: #F9F9F9 url(/_i/icon-20-c-arrow-bottom.png) center center  no-repeat;
    display: block;
    height: 40px;
    margin: 0;
    width: 60px;        
    cursor: pointer;  
    border-radius: 5px;   
    opacity: 1;
}                   
.art-content .share-buttons .share-button-more:hover {  
    background-color: #E9E9E9;
}     
.art-content .share-buttons .share-button,
.art-content .share-buttons .share-button-more {
    margin: 0 0 10px 0; 
}                             
.art-content .share-buttons .share-button.visible {
    display: block !important;
}               
.art-content .share-buttons .share-button.facebook-button,  
.art-content .share-buttons .share-button.twitter-button {
    height: 60px;
    width: 60px; 
}                     
.art-content .share-buttons .share-button.googleplus-button, 
.art-content .share-buttons .share-button.messenger-button,
.art-content .share-buttons .share-button.linkedin-button,
.art-content .share-buttons .share-button.tumblr-button,
.art-content .share-buttons .share-button.pinterest-button,
.art-content .share-buttons .share-button.whatsapp-button,     
.art-content .share-buttons .share-button.wykop-button,   
.art-content .share-buttons .share-button.email-button,     
.art-content .share-buttons .share-button.copy-button,  
.art-content .share-buttons .share-button.sms-button {  
    display: none;  
    width: 60px; 
}   
 
.genesis-window-share .facebook-button,
.art-content .share-buttons .share-button.facebook-button {
    background-image: url(/_i/icon-30-a-soc-facebook.png);
}      
.genesis-window-share .messenger-button {
    background-image: url(/_i/icon-30-a-soc-messenger.png);
}     
.genesis-window-share .instagram-button {
    background-image: url(/_i/icon-30-a-soc-instagram.png);
}    
.genesis-window-share .pinterest-button {
    background-image: url(/_i/icon-30-a-soc-pinterest.png);
}      
.genesis-window-share .twitter-button,
.art-content .share-buttons .share-button.twitter-button {
    background-image: url(/_i/icon-30-a-soc-x.png);
}     
.genesis-window-share .linkedin-button {
    background-image: url(/_i/icon-30-a-soc-linkedin.png);
}      
.genesis-window-share .tumblr-button {
    background-image: url(/_i/icon-30-a-soc-tumblr.png);
}      
.genesis-window-share .wykop-button {
    background-image: url(/_i/icon-30-a-soc-wykop.png);                  
}      
.genesis-window-share .whatsapp-button {
    background-image: url(/_i/icon-30-a-soc-whatsapp.png);
}     
.genesis-window-share .email-button {
    background-image: url(/_i/icon-30-a-email.png);
}          
.genesis-window-share .sms-button {
    background-image: url(/_i/icon-30-a-message.png);
}     
.genesis-window-share .copy-button {
    background-image: url(/_i/icon-30-a-copy.png);
}     


@media (max-width: 1195px) {
    .art-content .share-buttons-wrapper {
        left: -80px;
    }   
}   
@media (max-width: 990px) {  
    .art-content .share-buttons,
    .art-content .share-buttons-wrapper {
        display: none;
    }    
}    
@media (max-width: 940px) {  
    .genesis-window-share {
        width: 95vw; 
        max-width: 500px;        
    }   
    .genesis-window-share .buttons {
        flex-wrap: wrap;
    }   
    .genesis-window-share .info {
        flex-wrap: nowrap;
    }       
}         
@media (max-width: 800px) {  
    .genesis-window-share {
        max-width: 500px;        
    }   
    .genesis-window-share .buttons {
        flex-wrap: wrap;
    }   
    .genesis-window-share .info {
        flex-wrap: nowrap;
    }       
}         
@media (max-width: 600px) {  
    .genesis-window-share {
        max-width: 420px;        
    }   
}           
@media (max-width: 480px) {  
    .genesis-window-share .info {
        padding: 20px;    
    }                 
    .genesis-window-share .info strong {
        font-size: 16px;
        line-height: 20px;
        max-height: 83px;
        flex-wrap: wrap;
    }               
    .genesis-window-share .info strong b {
        padding-bottom: 4px;
    }  
    .genesis-window-share .info img {  
        width: 77px;
        height: 77px;
    }         
    .genesis-window-share .buttons {
        background: var(--genesis-share-bg-variant-color-mobile);
    }
}      
@media (max-width: 450px) {  
    .genesis-window-share {
        max-width: 340px;         
    }   
}         
@media (max-width: 350px) {  
    .genesis-window-share {
        max-width: 340px;        
    }   
}   
