/* Mobile View */
@media screen and (max-width: 79.5rem){

#tools{
display:block;
}

}


/* Desktop View */
@media screen and (min-width: 79.5rem){

#tools{
display:block;
}

}




/* Mobile View */
@media screen and (max-width: 79.5rem){

.tools_icon{
float:left;
display:block;
width:2.5rem;
height:2.5rem;
position:relative;
cursor:pointer;
margin:0 .5rem 0 0;
padding:.5rem;

& p,
& p a{
float:left;
width:2.5rem;
height:2.5rem;
margin:0;
padding:0;
top:0;
left:0;
position:relative;
overflow:hidden;
z-index:2;
}

}

}


/* Desktop View */
@media screen and (min-width: 79.5rem){

.tools_icon{
float:left;
display:block;
width:3.75rem;
height:3.75rem;
position:relative;
margin:.75rem .75rem 0 0;
padding:0;

& p,
& p a{
float:left;
width:3.75rem;
height:3.75rem;
margin:0;
padding:0;
top:0;
left:0;
position:relative;
overflow:hidden;
z-index:2;
}

}

}



.tools_icon p span{
display:block;
width:100%;
margin:0 0 0 10em;
padding:0;
}

.tools_icon .info{
display:flex;
justify-content:flex-end;
align-items:center;
min-width:1.5rem;
height:1.5rem;
background:var(--bgr-accent-400);
border:var(--brd-accent-300) 2px solid;
position:absolute;
top:-.35rem;
right:-.35rem;
border-radius:50%;
z-index:1;

& p{
display:flex;
justify-content:center;
align-items:center;
width:100%;
height:100%;
margin:0;
padding:0;
font-size:var(--fs-xs);
font-weight:bold;
text-align:center;
color:var(--clr-primary-300);
}

}



.tools_icon .info.hide{
display:none;
}