:root {

	--color-def: #F4F7FF;

	--color001: #D6E1FF;
	--color002: #C9D9FF;

	--color011: #9bbfdc; /* #9bbfdc */
	--color012: #86B3D8;
	--color012-o: #86B3D83F;
	--color013: #75B5EA;

	--color020: #57758E;
	--color022: #4f687c63;
	--color024: #425994;

	--color027: #3f5ea9;

	--color030: #244391;

	--color040: #19466D;
	--color040-o: #19466D7F;
	--color041: #163F5E;
	--color042: #102E47;

	--color050: #0B2133;

}
/*--------------------------------------------------------------------------------*/
body{
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px;
	font-size: 1em;
	width: 100vw; /* Full width */
  height: 100vh; /* Full height */
}
.generalPanel {
	display: block;
	position: absolute;
	width: 100vw; /* Full width */
  height: 100vh; /* Full height */
}

.generalScreen_center {
	position: relative;
	background-image: linear-gradient(to bottom, var(--color042) 20%, var(--color041));
	width: 100%;
	height: 100%;
	overflow-y: hidden;
	overflow-x: hidden;
	left: 0px;
	top: 0px;
}
.generalScreen_center01 {
  position: absolute;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-content: center;
}
/*--------------------------------------------------------------------------------*/
.generalScreen_Decore01 {
	position: absolute;
	height: 100%;
	left: 0px;
	top: 0px;
	bottom: 0px;
	opacity: 0.5;
}
.generalScreen_imgViewDecore01 {
  height: 100%;
	width: auto;
}
/*--------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------*/
.genPrezents {
	display: block;
  width: 100%;
	height: 100%;
  /* height: calc(100% - 128px); */
  /* margin-top: 64px; */
  /* margin-bottom: 64px;*/
}
.genPrezents_navig {
	position: relative;
  height: 100%;
	width: 100%;
}
/* .genPrezents_navigLeft, .genPrezents_navigRight {
	display: inline-block;
  height: 100%;
	width: calc(50% - 3px);
}
.genPrezents_navigLeft01, .genPrezents_navigRight01 {

} */
.genPrezents_navigLeft01 {
	margin-left: 16px;
  position: absolute;
  height: 100%;
  left: 0px;
  display: flex;
  justify-content: center;
  align-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
}
.genPrezents_navigRight01 {
	margin-right: 16px;
  position: absolute;
  height: 100%;
  right: 0px;
  display: flex;
  justify-content: center;
  align-content: flex-end;
  flex-direction: column;
  align-items: flex-end;
}
.genPrezents_navigLeft02, .genPrezents_navigRight02 {

}
.genPrezents_navigLeft03, .genPrezents_navigRight03 {
	background-color: var(--color001);
	border: 2px solid var(--color-def);
  height: 64px;
  border-radius: 12px;
	display: table-cell;
  position: relative;
	cursor: pointer;
	opacity: 0.1;
	text-align: center;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
	text-decoration: none;
	overflow: hidden;
}
.genPrezents_navigLeft03:hover, .genPrezents_navigRight03:hover {
	background-color: #99B7FF70;
	border: 2px solid var(--color-def);
	opacity: 1;
}
.genPrezents_navigLeft03::after, .genPrezents_navigRight03::after {
	content: "";
	background-color: #99B7FF;
	display: block;
	position: absolute;
	padding-top: 350%;
	padding-left: 350%;
	margin-left: -30px!important;
	margin-top: -220%;
	opacity: 0;
	transition: all 0.8s
}
.genPrezents_navigLeft03:active::after, .genPrezents_navigRight03:active::after {
	padding: 0;
	margin: 0;
	opacity: 1;
	transition: 0s
}
.img_navigLR {
	width: 44px;
  height: auto;
  margin-top: 10px;
}
/*--------------------------------------------------------------------------------*/
.genPrezentsClockView {
	position: absolute;
  display: flex;
  width: 100%;
	top: 0px;
  align-content: flex-start;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: nowrap;
}
.genPrezentsClockView01 {
	display: block;
	text-align: left;
	vertical-align: top;
}
.genPrezentsClockView02 {
	display: block;
	position: relative;
	text-align: center;
	width: 100%;
}
.genPrezentsClockView03 {
	display: none;
	margin-top: 8px;
	overflow: hidden;
  height: 40px;
	animation: 4s genPrezentsClockView_anim01 cubic-bezier(0.64, 0.08, 0.47, 0.69);
}
@keyframes genPrezentsClockView_anim01 {
  from { opacity: 0; }
  to { opacity: 1; }
}

.clockViewStyle {
	display: inline-block;
	font-weight: bold;
  font-size: 2em;
	width: 20px;
	text-align: center;
	vertical-align: top;
	color: var(--color-def);
	text-shadow: 4px 4px 8px var(--color050);
	/* transition-duration: .4s; */
}
/*--------------------------------------------------------------------------------*/
.cvs_ul {
	text-align: left;
	list-style: none;
	margin-left: -41px;
	margin-top: 0;
	transition-duration: .5s;
}
.cvs_ul > li {
	line-height: 40px;
	margin: 0;
}
/*--------------------------------------------------------------------------------*/
.genPrezents_str01, .genPrezents_str02,
.genPrezents_str03, .genPrezents_str04,
.genPrezents_str05, .genPrezents_str06,
.genPrezents_str07, .genPrezents_str08 {
  position: absolute;
	width: 100%;
  height: 100%;
  animation: 2s str01_show ease;
}
@keyframes str01_show {
  from { opacity: 0; }
  to { opacity: 1; }
}
.genPrezents_str01_elm01, .genPrezents_str02_elm01,
.genPrezents_str03_elm01, .genPrezents_str04_elm01,
.genPrezents_str05_elm01, .genPrezents_str06_elm01,
.genPrezents_str07_elm01, .genPrezents_str08_elm01 {
	position: relative;
  height: 100%;
  /* margin: 6% 10%; */
  /* padding: 6% 10%; */
  display: flex;
  justify-content: center;
  align-content: center;
	align-items: center;
}
.genPrezents_str01_elm01_parent {
	margin: 6% 0%;
	/* height: calc(100%-6%); */
	display: flex;
	align-content: center;
  justify-content: center;
  flex-direction: column;
	align-items: center;
}
.genPrezents_str02_elm01_parent,
.genPrezents_str03_elm01_parent, .genPrezents_str04_elm01_parent,
.genPrezents_str05_elm01_parent, .genPrezents_str06_elm01_parent,
.genPrezents_str07_elm01_parent, .genPrezents_str08_elm01_parent {
	height: 100%;
	margin: 6% 10%;
	display: flex;
	align-content: center;
  justify-content: center;
  flex-direction: column;
	align-items: center;
}
.genPrezents_system_width {
  /* margin-left: 8%;
  margin-right: 8%; */
}
.genPrezents_str_titleTXT {
	display: block;
  align-self: center;
  margin-bottom: 3%;
	/*width: 1200px;*/
	text-shadow: 6px 6px 16px var(--color050);
}
.genPrezents_str_zagolovokTXT {
  align-self: flex-start;
  margin-bottom: 3%;
	width: calc(100% - 8px);
	/*width: 1200px;*/
	text-shadow: 4px 4px 8px var(--color050);
}
.genPrezents_str_text {
	align-self: center;
	/*width: 1200px;*/
	text-shadow: 3px 3px 6px var(--color050);
}
.genPrezents_str_image {
	align-self: center;
  /* width: 1200px; */
	/* margin-top: 16px; */
  display: flex;
  justify-content: flex-end;
}
.genPrezents_str04_image {
	display: flex;
	justify-content: center;
}
.genPrezents_str01_imgTitle {
	display: block;
	/* display: flex;
  justify-content: center; */
}
.genPrezents_str01_imgViewTitle01 {
	/* max-height: 50%; */
  max-width: 40%;
	filter: drop-shadow(4px 4px 6px var(--color050));
	-webkit-filter: drop-shadow(4px 4px 6px var(--color050));
}
.genPrezents_bacgImg {}
.genPrezents_bacgImg::before {
	content: "";
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	height: 100%;
	right: 0;
	left: 0;
	opacity: 0.3;
}
.genPrezents_img_elm01 {
	position: absolute;
	width: 100%;
	height: 100%;
}
.genPrezents_img_elm01::before {
	content: "";
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	height: 100%;
	right: 0;
	left: 0;
	opacity: 0.3;
	/* box-shadow: inset 0px 0px 0px 8px var(--color040); */
	/* box-shadow: inset 0px 0px 40px 44px var(--color040); */
}
.genPrezents_imgTitul_elm01::before {
	background-image: url("../images/prezents/banner/banner000.jpg");
	opacity: 0.7;
}
.genPrezents_img02_elm01::before {
	background-image: url("../images/prezents/banner/banner001.jpg");
	/* opacity: 0.4; */
}
.genPrezents_img03_elm01::before {
	background-image: url("../images/prezents/banner/banner002.jpg");
	/* opacity: 0.4; */
}
.genPrezents_img04_elm01::before {
	background-image: url("../images/prezents/banner/banner003.jpg");
	/* opacity: 0.4; */
}
.genPrezents_img05_elm01::before {
	background-image: url("../images/prezents/banner/banner004.jpg");
	/* opacity: 0.4; */
}
.genPrezents_img06_elm01::before {
	background-image: url("../images/prezents/banner/banner005.jpg");
	/* opacity: 0.4; */
}
.genPrezents_img07_elm01::before {
	background-image: url("../images/prezents/banner/banner006.jpg");
	/* opacity: 0.4; */
}
.genPrezents_img08_elm01::before {
	background-image: url("../images/prezents/banner/banner001.jpg");
	/* opacity: 0.4; */
}
.genPrezents_imgBannerView {
	height: calc(100% - 2 * 64px);
	width: auto;
}
/*--------------------------------------------------------------------------------*/
.titleFontSize {
  font-size: calc(100vW*0.042);
  font-weight: bold;
	text-align: center;
  color: var(--color-def);
}
.zagolovakFontSize {
  font-size: calc(100vW*0.034);
  font-weight: bold;
  color: var(--color-def);
}
.zagolovakFontSize-bacground {
	border-radius: 8px;
	background-color: var(--color011);
	color: var(--color042);
	text-shadow: 2px 2px 4px var(--color027);
	box-shadow: 8px 5px var(--color022);
}
.textFontSize {
  font-size: calc(100vW*0.022);
  /*font-weight: bold;*/
	text-align: justify;
  color: var(--color-def);
}
/*--------------------------------------------------------------------------------*/
@media screen and (min-width: 100px) and (min-height: 100px) {
	.titleFontSize {
		font-size: x-large;
	}
}
@media screen and (min-width: 1000px) and (min-height: 100px) {
	.titleFontSize {
		font-size: x-large;
	}
}
@media screen and (min-width: 1000px) and (min-height: 500px) {
	.titleFontSize {
		font-size: xx-large;
	}
}
@media screen and (min-width: 1000px) and (min-height: 600px) {
	.titleFontSize {
		font-size: xxx-large;
	}
	.zagolovakFontSize {
		font-size: xx-large;
	}
	.textFontSize {
		font-size: x-large;
	}
}
@media screen and (min-width: 1400px) and (min-height: 100px) {
	.textFontSize {
		font-size: x-large;
	}
}
@media screen and (min-width: 1400px) and (min-height: 500px) {
	.textFontSize {
		font-size: xx-large;
	}
}
@media screen and (min-width: 1400px) and (min-height: 600px) {
	.textFontSize {
		font-size: xx-large;
	}
}
/*--------------------------------------------------------------------------------*/
@media screen and (min-height: 400px) {
	.genPrezents_str01_imgViewTitle01 {
		max-width: 50%;
	}
}
@media screen and (min-height: 500px) {
	.genPrezents_str01_imgViewTitle01 {
		max-width: 60%;
	}
}
@media screen and (min-height: 600px) {
	.genPrezents_str01_imgViewTitle01 {
		max-width: 70%;
	}
}
/*--------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------*/
.genPrezentsIgnoreButton {
	position: absolute;
  display: flex;
  width: 100%;
  /* height: 100%; */
  bottom: 0px;
	align-content: center;
  justify-content: center;
  align-items: center;
	animation: 4s genPrezentsIgnoreButton_show ease;
}
@keyframes genPrezentsIgnoreButton_show {
  from { opacity: 0; }
  to { opacity: 1; }
}

.genPrezentsIgnoreButton01 {
	display: block;
  padding: 0px 0px;
  margin-bottom: 10px;
  text-align: left;
  vertical-align: top;
}
/*--------------------------------------------------------------------------------*/
.enterKeyIgnoreButton {
	display: table-cell;
	position: relative;
	background-color: var(--color001);
	border: 2px solid var(--color-def);
  border-radius: 12px;
	color: var(--color030);
	padding: 12px 32px;
	margin: 0px;
	opacity: 0.2;
	text-align: center;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
	text-decoration: none;
	overflow: hidden;
	cursor: pointer;
	/*width: 232px;*/
}
.enterKeyIgnoreButton:hover {
	opacity: 1;
	background-color: var(---color024);
  color: var(--color002);
}
.enterKeyIgnoreButton::after {
	content: "";
	background-color: #99B7FF;
	display: block;
	position: absolute;
	padding-top: 300%;
	padding-left: 350%;
	margin-left: -50px!important;
	margin-top: -120%;
	opacity: 0;
	transition: all 0.8s
}
.enterKeyIgnoreButton:active::after {
	padding: 0;
	margin: 0;
	opacity: 1;
	transition: 0s
}
/*--------------------------------------------------------------------------------*/
