﻿* {
	font-family: Verdana, Geneva, Tahoma, sans-serif;
}

html {
	height: 98%;
}

body {
	display: flex;
	flex-direction: column;
	height: 100%;
}



h2,
h3 {
	padding: 4px 8px;
	margin: 8px auto 4px auto;
}

h2 {
	color: #2D61A6;
}

h3 {
	color: #BF463B;
}

#header {
	/* 0 flex-grow, 0 flex-shrink, auto flex-basis */
	flex: 0 0 auto;
}

#content {
	/* 1 flex-grow, 0 flex-shrink, auto flex-basis */
	flex: 1 0 auto;
}

#footer {
	/* 0 flex-grow, 0 flex-shrink, auto flex-basis */
	flex: 0 0 auto;
	bottom: 0px;

}

.recommendation {
	font-style: italic;

}

.img-infowin {
	float: left;
	margin-right: 8px;
	margin-bottom: 8px;
}

.divinfo {
	clear: left;
}

figcaption {
	font-size: 1.1em;
	color: #2D61A6;
}

details {
	cursor: pointer;
}

a.big {

	font-size: larger;
}

a {
	color: black;
}

а:hover {
	color: #F2DABD;
}

a:visited {
	color: currentColor;
}

p {
	text-indent: 2em;
}

.aind {
	padding: 4px 8px;
	margin: 16px 8px;
}

.plus {
	position: absolute;
	cursor: pointer
}

.minus {
	position: absolute;
	cursor: pointer
}



@media (max-width: 1000px) {

	/* CSS-стили */
	.imgsmall {
		width: 100vw;
		height: auto;
	}

	.imgbig {
		width: 100vw;
		height: auto;
	}

	.imgpreview {
		width: 100vw;
		height: calc(100vw*1080/1920)
	}

	.plus {
		margin: 4px auto auto 90vw;
		width: 30px;
	}
	.minus {
		position: fixed;
		right: 8px;
		top: 12px;
		width: 30px;
		width: 30px;
	}
	#imgmap {
		width: 100vw;
		height: 100vw;
	}

	body {
		margin: 0px;
		padding: 0px
	}

	figure,
	#content {
		margin: 0px;
		padding: 0px 0px 12px 0px;
	}

	h1 {
		font-size: 1.5em;
		padding: 4px 5px;
		margin: 0px;
	}

	.vidеo {
		width: 100vw;
	}

	#bigimage  {
		width:100vw
	}

}

@media (min-width: 1024px) {
	.imgsmall {
		width: auto;
		height: auto;
	}

	.imgpreview {
		width: 1000px;
		height: calc(1000px*1080/1920)
	}

	.imgbig {
		width: 1000px;
		height: auto;
	}

	.plus {
		margin: 4px auto auto 960px;
		width: 30px;
	}

	.minus {
		position: fixed;
		right: 8px;
		top: 12px;
		width: 30px;
	}

	html,
	body,
	div,
	img,
	#content {
		margin: auto;
		padding: auto;
	}

	figure {
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 18px 0px;
	}

	#bigimage  {
		width:95vw
	}
	
}


h1 {
	font-size: 2.0em;
	padding: 8px 10px;
	margin: 0px;
}

#cookiesdivid {
			width: 98%;
			display: flex;
			color: white;
			padding: 4px;
			margin: 4px;
			position: fixed;
			border-radius: 8px;
			z-index: 5;
			flex-direction: row;
			justify-content: space-around;
			background: linear-gradient(to right, SteelBlue, LightSkyBlue);
		}

		#cookiesbuttonid {
			margin: 10px 10px;
			padding: 10px;
			color:white;
			background-color: blue;
		}