trabajar con responsive. en local se ve de una forma y en cell de otra

Buenos amigo tengo una indeligencia diagramando con CSS. Que pasa...

tengo dos archivos css uno para el responsive y otro para el normal algo asi.

style-index.css: para el archivo de laptop y r-style-index: para el cell

tengo este código.

button.inisesion{
border-radius: 8px 8px 8px 8px;
position: absolute;
top:3px;
right:40px;
padding: 10px 10px ;
font-family: avan;
font-size: 12px;
color:white;
background-color: red;
border: none;
transition: all 0.3s ease;
cursor:pointer;
}

a.cerrar{
border-radius: 8px 8px 8px 8px;
position: absolute;
top:3px;
font-family: avan;
font-weight: 600;
right:3px;
background-color: rosybrown;
padding:7px 10px;
font-size: 20px;
text-decoration: none;
line-height: 1;
color:#fff;
transition: all 0.3s ease;
align-items:center;

}

es un botón y me funciona perfecto en la configuracion de laptop pero cuando la paso a el responsive el botón cambia los espacio no se ve igual. Esto solo pasa cuando lo subo a github y lo veo mi cell pero si lo veo en la pagina y la achico no pasa nada se ve bien. les pongo unas foto del problema

esto como se ve normal en la computadora.