@charset "UTF-8";
/* CSS Document */

.grp-rrss-compartir{
position: relative;
/*position: absolute;*/
/*left: 20px;*/
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: column;  
width: calc(100% - 10px);  
height: auto;
z-index: 3;
border-top: 0.5px solid var(--base-a-3-100);  
margin-bottom: 10px;  
padding: 10px 5px 0px 5px;    
}

.btn-grp-rrss{
display: none;
}
.grp-rrss-compartir ul{
position: relative;  
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: row;
width: 100%;  
height: 100%;  
list-style-type: none;  
margin: 0px;
padding: 0px;  
}
.grp-rrss-compartir ul li{
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;  
}
.grp-rrss-compartir ul li button{
border: none; 
}
.grp-rrss-compartir ul li button a{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
z-index: 2; 
}

.grp-rrss-compartir .nav-ficha--grp-subtit {
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: center;
flex-direction: column;
margin-bottom: 4px;  
}
.grp-rrss-compartir .nav-ficha--grp-subtit h5 {
font-family: var(--fuente-subtit);
text-rendering: optimizeLegibility;  
font-size: calc(var(--font-size-xxs) + 2px) !important;
line-height: var(--line-height-xxs) !important;
font-weight: 500;
font-variation-settings: "wght" 800;  
color: var(--base-a-0-70) !important;  
}

/*TRANSICIONES*/
.grp-rrss-compartir ul li button{
background-color: var(--trans);
}
.grp-rrss-compartir ul li button:hover{
background-color: var(--base-a-0-10);
}

/*.----MEDIA QUERIES*/
@media screen and (max-width:1280px){  
/*TRANSICIONES*/
.grp-rrss-compartir ul li button{
background-color: var(--trans);
}
.grp-rrss-compartir ul li button:hover{
background-color: var(--trans);
}  
}

/*@media screen and (orientation:portrait){*/
@media screen and (max-width:851px){  
.grp-rrss-compartir {
position: absolute;  
left: auto;
right: 0px;
top: 0px;
bottom: inherit;  
width: auto;
height: 52px;
flex-direction: row-reverse;
z-index: 300; 
border-top: none;  
padding: 0px 5px 0px 5px  
}
.btn-grp-rrss{
display: block;
}  
.grp-rrss-compartir .nav-ficha--grp-subtit {
position: relative;
width: auto;
height: 100%;  
z-index: 2;  
margin-left: 0px;  
margin-bottom: 0px;
}  
.grp-rrss-compartir .nav-ficha--grp-subtit h5 {
display: none;  
margin-top: 12px;  
margin-bottom: -4px;
}  
.grp-rrss-compartir .nav-ficha--grp-subtit::before {
content:'';
position: absolute;
top: 50%;
left: -4px;  
-moz-transform: translateX(0%) translateY(-50%);
-webkit-transform: translateX(0%) translateY(-50%);
transform: translateX(0%) translateY(-50%);
width: 0.5px;
height: calc(100% - 10px);
background-color: var(--base-a-3-100);   
}  
  
.grp-rrss-compartir ul {
width: auto;
height: auto; 
background-color: var(--bn-90);  
border-radius: var(--border-r-sm);
border: 0.5px solid var(--base-a-3-100);
box-shadow: 
  0 0 0 1px rgba(53, 72, 91, .07), 
  0 2px 2px rgba(0, 0, 0, .01), 
  0 4px 4px rgba(0, 0, 0, .02), 
  0 10px 8px rgba(0, 0, 0, .03), 
  0 15px 15px rgba(0, 0, 0, .03), 
  0 30px 30px rgba(0, 0, 0, .04), 
  0 70px 65px rgba(0, 0, 0, .05);
padding: 2px 0px 2px 0px;  
}  
.grp-rrss-compartir ul li {
width: 35px !important;
height: 35px !important;
flex: 0 0 35px;
margin: 0px 2px 0px 2px;  
}  
 
/*TRANSICIONES*/  
.grp-rrss-compartir ul {
right: -20px;   
opacity: 0;
pointer-events: none;  
} 
.grp-rrss-compartir ul.ul-rrss-act {
right: 14px;
opacity: 1;
pointer-events: auto;  
} 
.grp-rrss-compartir .btn .icn-pie-noact{   
background-position: 20% 0%; 
}  
}

