/* #region Root */
:root
{

}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-Thin.ttf") format('truetype');
	font-weight: 100;
	font-style: normal;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-ThinItalic.ttf") format('truetype');
	font-weight: 100;
	font-style: italic;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-Light.ttf") format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-LightItalic.ttf") format('truetype');
	font-weight: 300;
	font-style: italic;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-Regular.ttf") format('truetype');
	font-weight: 400;
	font-style: normal;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-Italic.ttf") format('truetype');
	font-weight: 400;
	font-style: italic;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-Medium.ttf") format('truetype');
	font-weight: 500;
	font-style: normal;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-MediumItalic.ttf") format('truetype');
	font-weight: 500;
	font-style: italic;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-Bold.ttf") format('truetype');
	font-weight: 700;
	font-style: normal;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-BoldItalic.ttf") format('truetype');
	font-weight: 700;
	font-style: italic;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-Black.ttf") format('truetype');
	font-weight: 900;
	font-style: normal;
}

@font-face 
{
	font-family: "Roboto";
	src: url("../webfonts/Roboto-BlackItalic.ttf") format('truetype');
	font-weight: 900;
	font-style: italic;
}
/* #endregion */


/* #region MainLayout */
*
{
	font-family: 'Roboto', sans-serif;
}

html 
{
	height: 100%;
}

body
{
	background-color: var(--c-page-background);
	padding-right: 0px !important;
	overflow-y: auto !important;
}

h1
{
	font-size: 2.5rem
}

.nav-item:hover a
{
	color: #b5becb !important;
}
/* #endregion */


/* #region Layout */
#banner h1
{
	text-shadow: rgb(0, 0, 0) 1px 0 8px,
	rgb(0, 0, 0) 1px 0 25px;
	font-size: 3rem
}

#banner img
{
	max-height: 500px;
	object-fit: cover;
	width: 100%;
	object-position: center;
}

#banner h1
{
	position: absolute;
	top: 50%;
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
	color: white;
}

h1
{
	letter-spacing: 0.1rem;
	margin-bottom: 2.5rem;
}

.card
{
	width: 100%;
	margin-bottom: 25px;
}

.card-body
{
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;

}

.card-body > .card-title
{
	font-size: 16px;
	margin-bottom: 0px;
}

#onas
{
	background-color: #e3e3e3;

}

#oferta
{
	background-color: #b5becb;
}

#galeria
{
	background-color: #e3e3e3;
}

#kontakt
{
	background-color: #b5becb;
}

.container-fluid > .row > .col
{
	font-size: 16px;
	padding: 6rem 10rem;
	margin-top: auto;
	margin-bottom: auto;
}


.gallery-link
{
	transition-duration: 200ms;
}

.gallery-link:hover
{
	scale: 1.05;
	cursor: pointer;
	transition-duration: 200ms;
}

@media only screen and (max-width: 1000px)
{
	.container-fluid > .row > .col
	{
		padding: 6rem 5rem;
	}
}

@media only screen and (max-width: 576px)
{
	.container-fluid > .row > .col
	{
		padding: 6rem 1rem;
	}
}
/* #endregion */