@charset "UTF-8";

/* --- Common override section --- */

table
{
	padding: 0;
}

.row p, h5
{
	width: 100% !important;
}

.expandable_view
{
	gap: 50px;
}
/* --- Oddily body section --- */

.oddily_wrapper
{
	align-self: stretch;
	max-width: 100em;
	
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: start;
	align-content: center;
	gap: 4em;
}

.oddily_tile
{
	width: 22em;
	height: 15em;
	padding: 0px;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	
	/*
	background: linear-gradient(180deg,rgba(222, 10, 42, 0.7) 0%, rgba(222, 10, 42, 0) 100%);
	*/
}

.oddily_tile:hover
{
	background: rgba(45, 46, 124, 0.7);
}

.oddily_tile:hover img
{
	-webkit-mask-image: linear-gradient(180deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
	mask-image: linear-gradient(180deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
	
	opacity: 0.7;
	filter: grayscale(0%);
}

.oddily_tile:hover h3
{
	background-color: #2D2E7C;
}

.oddily_tile:hover p
{
	opacity: 1;
}

.oddily_tile img
{
	position: absolute;
	z-index: -1;
	width: 22em;
	height: 15em;
	
	filter: grayscale(50%);

	-webkit-mask-image: linear-gradient(180deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
	mask-image: linear-gradient(180deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
}

.oddil_bot
{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.oddily_tile h3
{
	text-align: left;
	padding: 0.5em;
	color: white;
	background-color: #de0a2a;
}

.oddily_tile h4
{
	text-align: left;
	padding: 10px;
}

.oddily_tile p
{
	padding: 10px;
	align-self: flex-end;
	opacity: 0;
	color: white;
}

.oddily_volno
{
	color: #21b008;
}

.oddily_obsazeno
{
	color: #de0a2a;
}

/* --- Single Oddil --- */

#oddil_content_wrap
{
	display: flex;
	flex-direction: column;
	gap: 1em;
	
	width: 500px;
}

#oddil_content_wrap h4
{
	padding-top: 1em;
}

.info_wrapper
{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.info_line
{
	display: flex;
	flex-direction: row;
	padding-bottom: 3px;
	border-style: hidden hidden solid hidden;
	border-width: medium;
	border-color: #de0a2a;
}

.contact_wrapper
{
	display: flex;
	flex-direction: column;
}

.contact_wrapper h6
{
	font-size: 20px;
	letter-spacing: 2px;
}

.contact
{
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.contact_line
{
	display: flex;
	flex-direction: row;
	padding-bottom: 3px;
	border-style: hidden hidden solid hidden;
	border-width: medium;
	border-color: #2d2e7c;
}

.news_image
{
	width: 100%;
	height: auto;
}

/* Mobile */
@media (max-aspect-ratio: 1/1)
{
	.oddily_wrapper
	{
		width: 48em;
	}
}