.header-row{
	display:flex;
	flex-wrap: wrap;
	align-items: baseline;
	position: relative;
}

.header-help-btn{
	font-size: 12px;
	margin: 10px auto;
}

@media (max-width:920px) {
	#main-nav {
		top: 0 !important;
		max-height: unset !important;
	}
}

.calendar-main {
	margin: auto;
	padding: 0;
}

.calendar-main :where(h1, h2, h3, #col_2 h3 a) {
	color: var(--link-color);
	font-weight: normal;
}

.calendar-main :where(h1, h2) {
	font-size: 1.5rem;
	text-align: center;
	font-family: var(--title-font);
	line-height: 112%;
	margin-bottom: 1rem;
}

.calendar-main h1{
	font-weight: bold;
	margin-bottom: 1rem;
}

.calendar-main h3 {
	font-size: 1rem;
	font-weight: bold;
	margin: 0.5rem 0;
}

.calendar-main :where(a, a:link, a:visited) {
	color: var(--link-color);
	text-decoration: none;
	}

.calendar-main a:active {
	color: Red;
	text-decoration: none;
}

.calendar-main a:hover {
	color: DarkRed;
	text-decoration: underline;
}

/* CONTROLS */

.calendar-main :where(#ok, .glow) {
	animation: azcalglow 1s ease-out infinite alternate;
}

@keyframes azcalglow {
	0% {
		box-shadow: 0 0 0 #FF0000;
	}

	33% {
		box-shadow: 0 0 0 #FF0000;
	}

	66% {
		box-shadow: 0 0 14px #FF0000;
	}
}

.calendar-main #ok.hidden,
.calendar-main #next_year.hidden {
	display: none;
}

.calendar-main #prev_year.hidden {
	visibility: hidden;
}

.calendar-main #style {
	font-family: var(--primary-font);
}

.calendar-main #style:hover {
	text-decoration: none;
}

.calendar-main .rating {
	display: inline-block;
	width: 40%;
	padding-bottom: 20px;
}

.calendar-main .quarter {
	position: relative;
	text-align: center;
}

.calendar-main :where(.header, .calendar-diff) {
	font-family: var(--primary-font);
	line-height: normal;
	color: var(--primary-color);
	margin: 0px;
	padding: 0px;
	border: 0px;
}

.calendar-diff {
	font-size: 80%;
	margin-bottom: .5rem;
}

.pika-year {
	width: 100%;
	gap: .25rem;
}

.pika-month {
	font-family: var(--primary-font);
	border: 2px solid;
	border-color: var(--border-color);
	border-radius: 5px;
	overflow: hidden;
	color: var(--primary-color);
}

.month :where(div, a) {
	border: 0 !important;
}

.month a,
.month a:link,
.month a:visited,
.month a:active,
.month a:hover {
	text-decoration: none;
}

.calendar-main #print {
	display: none;
}

.pika-weekday {
	background-color: #9992;
}

.month_title {
	color: var(--primary-color);
	font-weight: bold;
}

td.month_title {
	font-size: 18px;
}

.week_days {
	line-height: 19px;
	background-color: var(--primary-color);
	color: white;
	font-weight: bold;
}

.arrow {
	color: var(--primary-color);
	font-weight: bold;
	font-size: 24px;
}

/* events table */


#events {
	margin: 10px 0px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .25rem;
}

.evants {
	flex-grow: 1;
	box-sizing: border-box;
	text-align: left;
	font-family: var(--primary-font);
	line-height: normal;
	padding: 0px 0px 0px 10px;
	border: 2px solid var(--border-color);
	border-radius: 5px;
	vertical-align: top;
}

.evants p {
	display: flex;
	gap: 5px;
	margin: 0 0 0.5rem;
}

.evants p>strong {
	min-width: 2.5em;
}

/********************************************************
Настройка стилей текста
*********************************************************/
#text {
	text-align: justify;
	font-family: var(--primary-font);
	line-height: 120%;
}

h1{
	margin-top:0;
}

#text h1,
h2,
form {
	text-align: center;
}

#col_1 strong {
	color: Red;
}

#text a {
	color: var(--primary-color);
}

#col_2 strong {
	color: var(--accent-color);
	white-space: nowrap;
}

#col_2 p strong+a{
	flex-shrink: 10;
}

button.cupid-orange {
	background-color: #ee972f;
	background-image: linear-gradient(top, #ee972f, #f26b23);
	border: 1px solid #c6734a;
	border-bottom: 1px solid #c6734a;
	border-radius: 6px;
	box-shadow: inset 0 1px 0 0 #c6734a;
	color: #fff;
	font: 400 16px "Helvetica", "Arial", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
	line-height: 1;
	padding: 10px 0 10px 0;
	text-align: center;
	text-shadow: 0 -1px 0 #c6734a;
	width: 195px;
	font-family: arial;
	letter-spacing: 1px;
	text-transform: uppercase;
}

button.cupid-orange:hover {
	background-color: #f26b23;
	background-image: linear-gradient(top, #f26b23, #ee972f);
	box-shadow: inset 0 1px 0 0 #ce973f;
	cursor: pointer;
}

button.cupid-orange:active {
	border: 1px solid #d1840c;
	border-bottom: 1px solid #538c27;
	box-shadow: inset 0 0 8px 4px #ca5711, 0 1px 0 0 #eeeeee;
}


.calendar-main .legend {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	margin: 1rem 0;
	padding: 0;
	font-family: var(--primary-font);
	line-height: 90%;
}

.calendar-main .legend div {
	vertical-align: middle;
	border-radius: 3px;
}

div.legend-solid,
div.legend-fast,
div.legend-wedding,
div.style {
	display: inline-block;
	margin: 0px;
}

.legend-square{
	width: 15px;
	height: 15px;
	border: 1px solid grey;
	margin-right: 5px;
	display: inline-block;
}

.legend-wedding div {
	background-color: White;
	background-image: linear-gradient(135deg, #A17A1A 0%, #A17A1A 30%, #0000 30%, #0000);
	background-repeat: no-repeat;
}

.legend-memorial .legend-square{
	border: 0;
}

textarea {
	width: 100%
}

footer {
	text-align: center;
}

.vignette {
	background: url(../../img/dividers_13.svg) no-repeat center/contain;
	width: 100%;
	height: 1.5rem;
	margin: 1rem auto;
}

#button_help_out {
	margin: 1rem auto;
	text-align: center;
}

@media (min-width: 921px) {
	.calendar-main{
		padding: 0;
	}

	#print {
		display: inline-block;
		cursor: pointer;
		position: absolute;
		right: 0;
		bottom: 17px;
	}

	.embed-block {
		flex-wrap: nowrap;
	}
	
	#events {
		flex-wrap: nowrap;
	}
	.evants{
		flex-basis: 50%;
	}
}