Это с вышеуказанными изменениями:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
div.box-range > div, div.box-input { width: 70%; border: 1px solid #a9a9a9; border-radius: 12px/9px; padding: 10px 25px; margin: 0 20px 5px 0; }
span.ulian { color: hsl(240,100%,70%); }
span.grig { color: hsl(240,100%,30%); }
input { display: inline-block; text-align: center; }
</style>
</head>
<body>
<div class="box-input">
<input id="YearEntry" type="number" min="326" max="4099" step="1" value="2019" />
<input id="button1" type="button" value="Расcчитать" />
</div>
<div class="box-range" range="[0,325]">
<div>Первый Никейский собор — собор Церкви, созванный императором Константином I; состоялся в июне 325 года в городе Никее (ныне Изник, Турция);
продолжался больше двух месяцев и стал первым Вселенским собором в истории христианства.<br>
Введите год с 326 по 4099
</div>
</div>
<div class="box-range" range="[326,1582]">
<div>
Пасха<br>
<span class="ulian">
<span id="Orthodox_Easter_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
<div>
Радуница<br>
<span class="ulian">
<span id="Orthodox_Radunitsa_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
<div>
Вербное воскресенье<br>
<span class="ulian">
<span id="palm_Sunday_Orthodox_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
<div>
Масленица<br>
<span class="ulian">
<span id="Maslenitsa_Orthodox_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
</div>
<div class="box-range" range="[1583,4099]">
<div>
Католическая пасха<br>
<span class="grig">
<span id="Catholic_Easter_gr"></span><br>
по григорианскому календарю (новый стиль)<br>
</span>
<span class="ulian">
<span id="Catholic_Easter_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
<div>
Православная пасха<br>
<span class="grig">
<span id="Orthodox_Easter_gr"></span><br>
по григорианскому календарю (новый стиль)<br>
</span>
<span class="ulian">
<span id="Orthodox_Easter_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
<div>
Радуница<br>
<span class="grig">
<span id="Orthodox_Radunitsa_gr"></span><br>
по григорианскому календарю (новый стиль)<br>
</span>
<span class="ulian">
<span id="Orthodox_Radunitsa_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
<div>
Вербное воскресенье<br>
<span class="grig">
<span id="palm_Sunday_Orthodox_gr"></span><br>
по григорианскому календарю (новый стиль)<br>
</span>
<span class="ulian">
<span id="palm_Sunday_Orthodox_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
<div>
Масленица<br>
<span class="grig">
<span id="Maslenitsa_Orthodox_gr"></span><br>
по григорианскому календарю (новый стиль)<br>
</span>
<span class="ulian">
<span id="Maslenitsa_Orthodox_ul"></span><br>
по юлианскому календарю (старый стиль)
</span>
</div>
</div>
<div class="box-range" range="[4100,0]">
<div>Введите год с 326 по 4099</div>
</div>
<script>
var Y = document.getElementById("YearEntry");
Y.value = new Date().getFullYear();
Y.addEventListener("keyup", function() {
this.value = this.value.replace(/\D/, '');
showBox();
});
Y.addEventListener("change", showBox);
document.getElementById("button1").onclick = button1_click;
showBox();
button1_click();
function catholicDate(year) {
// https://ru.wikipedia.org/wiki/Алгоритм_Гаусса_вычисления_даты_Пасхи
// Пример на 1777 год (год рождения Карла Гаусса): год = 1777
var a = year % 19,
b = year % 4,
c = year % 7,
k = Math.floor(year / 100),
p = Math.floor((13 + 8 * k) / 25),
q = Math.floor(k / 4),
m = (15 - p + k - q) % 30,
n = (4 + k - q) % 7,
d = (19 * a + m) % 30,
e = (2 * b + 4 * c + 6 * d + n) % 7;
if (d === 29 && e === 6) return new Date(year, 3, 19);
if (d === 28 && e === 6 && ((11 * m + 11) % 30 < 19)) return new Date(year, 3, 18);
if (d + e > 9) return new Date(year, 3, d + e - 9);
else return new Date(year, 2, 22 + d + e);
}
function orthodoxDate(year) {
// https://ru.wikipedia.org/wiki/Алгоритм_Гаусса_вычисления_даты_Пасхи
var a = year % 19,
b = year % 4,
c = year % 7,
d = (19 * a + 15) % 30,
e = (2 * b + 4 * c + 6 * d + 6) % 7,
f = d + e;
// (по старому стилю) Если f ≤ 9, то Пасха будет праздноваться 22 + f марта; если f > 9, то Пасха будет праздноваться f — 9 апреля.
return f <= 9 ? new Date(year, 2, 22 + f) : new Date(year, 3, f - 9);
}
// Все даты отображаем в едином формате
function formatDate(date) {
return date.toLocaleDateString("ru", { weekday: "long", day: "numeric", month: "long", year: "numeric" }).replace(/^.?|,/g, function(v, i) {
return !i ? v.toUpperCase() : '<br>'
});
}
function showBox() {
var y = +Y.value || 0,
box = document.getElementsByClassName("box-range"),
i, range, a;
for(i=0; i<box.length; ++i) {
range = JSON.parse(box[i].getAttribute('range'));
a = [];
if(range[0]) a.push(y >= range[0]);
if(range[1]) a.push(y <= range[1]);
box[i].hidden = !eval(a.join('&&'))
}
}
function button1_click() {
var year = Y.value,
razn = 0; //какое-то значение по умолчанию если меньше 300 и больше 4099
if (year >= 300 && year <= 499) razn = 1;
else if (year >= 500 && year <= 599) razn = 2;
else if (year >= 600 && year <= 699) razn = 3;
else if (year >= 700 && year <= 899) razn = 4;
else if (year >= 900 && year <= 999) razn = 5;
else if (year >= 1000 && year <= 1099) razn = 6;
else if (year >= 1100 && year <= 1299) razn = 7;
else if (year >= 1300 && year <= 1399) razn = 8;
else if (year >= 1400 && year <= 1499) razn = 9;
else if (year >= 1500 && year <= 1699) razn = 10;
else if (year >= 1700 && year <= 1799) razn = 11;
else if (year >= 1800 && year <= 1899) razn = 12;
else if (year >= 1900 && year <= 2099) razn = 13;
else if (year >= 2100 && year <= 2199) razn = 14;
else if (year >= 2200 && year <= 2299) razn = 15;
else if (year >= 2300 && year <= 2399) razn = 16;
else if (year >= 2500 && year <= 2599) razn = 17;
else if (year >= 2600 && year <= 2699) razn = 18;
else if (year >= 2700 && year <= 2899) razn = 19;
else if (year >= 2900 && year <= 2999) razn = 20;
else if (year >= 3000 && year <= 3099) razn = 21;
else if (year >= 3100 && year <= 3299) razn = 22;
else if (year >= 3300 && year <= 3399) razn = 23;
else if (year >= 3400 && year <= 3499) razn = 24;
else if (year >= 3500 && year <= 3699) razn = 25;
else if (year >= 3700 && year <= 3799) razn = 26;
else if (year >= 3800 && year <= 3899) razn = 27;
else if (year >= 3900 && year <= 4099) razn = 28;
document.getElementById("Catholic_Easter_gr").innerHTML = formatDate(catholicDate(year));
var date0_1 = catholicDate(year);
document.getElementById("Catholic_Easter_gr").innerHTML = formatDate(date0_1);
var date0 = new Date(date0_1.getFullYear(), date0_1.getMonth(), date0_1.getDate() - razn);
document.getElementById("Catholic_Easter_ul").innerHTML = formatDate(date0);
var date1 = orthodoxDate(year);
document.getElementById("Orthodox_Easter_ul").innerHTML = formatDate(date1);
var date1_1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate() + razn);
document.getElementById("Orthodox_Easter_gr").innerHTML = formatDate(date1_1);
var date2 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate() + 9);
document.getElementById("Orthodox_Radunitsa_ul").innerHTML = formatDate(date2);
var date2_1 = new Date(date1_1.getFullYear(), date1_1.getMonth(), date1_1.getDate() + 9);
document.getElementById("Orthodox_Radunitsa_gr").innerHTML = formatDate(date2_1);
var date3 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate() - 7);
document.getElementById("palm_Sunday_Orthodox_ul").innerHTML = formatDate(date3);
var date3_1 = new Date(date1_1.getFullYear(), date1_1.getMonth(), date1_1.getDate() - 7);
document.getElementById("palm_Sunday_Orthodox_gr").innerHTML = formatDate(date3_1);
var date4 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate() - 49);
document.getElementById("Maslenitsa_Orthodox_ul").innerHTML = formatDate(date4);
var date4_1 = new Date(date1_1.getFullYear(), date1_1.getMonth(), date1_1.getDate() - 49);
document.getElementById("Maslenitsa_Orthodox_gr").innerHTML = formatDate(date4_1);
}
</script>
</body>
</html>