I am trying to center vertically some anchors but have not been able to mange it, the anchors are inside a div which is centered horizontally and taking up all the height of the body, what I want is have these anchors centered within that div

HTML Code:
<body>
<div id="teatro_intimo_botones">
	<a class="contacto" href="#"></a>
	<a class="quienes_somos" href="#"></a>
	<a class="obras" href="#"></a>
	<a class="proximos_eventos" href="#"></a>
</div>
</body>
Code CSS:
body {
    background-color: #080000;
    margin: 0;
    padding: 0;
}
#teatro_intimo_botones {
    margin-left: auto;
    margin-right: auto;
    width: 362px;
}
#teatro_intimo_botones a {
    display: block;
    height: 131px;
    width: 181px;
    float: left;
}
.contacto {
    background-image: url("contacto.png");
}
.quienes_somos {
    background-image: url("quienes_somos.png");
}
.obras {
    background-image: url("obras.png");
}
.proximos_eventos {
    background-image: url("proximos_eventos.png");
}

I tried using a percentage, but then it will not show properly on all screens, is there a way to center those vertically?