body{
    --main-bg-color: #72c0ee;
    --menu-color: #37a5e7;
    --menu-font-family:cursive;
    background-color:var(--main-bg-color);

}
.top{
    background-image:url('pics/top.png');
    background-repeat: no-repeat;
    background-position:center;
    width:100%;
    height:283px;
}
.navigation_container{
    background-color:var(--menu-color);
    height:70px;
    /* padding:5px; */
    max-width:1500px;
    margin-top:10px;
    margin-left:auto;
    margin-right:auto;

    border-radius:10px;
    display:flex;
    justify-content: center;
}

.navigation_item{
    width:70px;
    text-align:center;
}

.navigation_item span{
    white-space: nowrap;
    margin-left:-50px;
    font-family: var(--menu-font-family);
    display:none;
    width:170px;
    color:white;
    margin-top:-5px;
    text-shadow: 1px 1px 2px black;
    font-size:20px;
    z-index: index 100;
}

.navigation_item:hover span{
    display:inline-block;
}

.navigatin_ball{
    display:block;
    width:70px;
    height:70px;
    border-radius:50%;
    background-repeat: no-repeat;
    background-position: center;
    animation-name:menuDown;
    animation-duration:0.5s;
    animation-fill-mode: forwards;
}
.navigation_item:hover .navigatin_ball{
    box-shadow:0px -3px 3px 0px white;
    background-color: var(--menu-color);
    animation-name:menuUp;
    animation-duration:0.5s;
    animation-fill-mode: forwards;
}
@keyframes menuUp{
    from{margin-top:0px;}
    to{margin-top:-10px;}
}
@keyframes menuDown{
    from{margin-top:-10px;}
    to{margin-top:-0px;}
}

#home{
    background-image:url('pics/home.png');
}
#mult{
    background-image:url('pics/mult.png');
}
#audio{
    background-image: url('pics/audio.png');
}
#raskraski{
    background-image: url('pics/raskraski.png');
}
#songs{
    background-image: url('pics/songs.png');
}
#books{
    background-image: url('pics/books.png');
}
#adults{
    background-image: url('pics/adults.png');
}
#diafilm{
    background-image: url('pics/diafilm.png');
}
#games{
    background-image: url('pics/games.png');
}
.carusel_container{
    max-width:1500px;
    height:350px;
    margin-top:20px;
    display:flex;
    justify-content: center;
    padding-top:50px;
    position:relative;
    overflow: hidden;
    margin-left:auto;
    margin-right: auto;
}
.carusel_img{
    box-shadow:0 0 2px 2px white;
    z-index:1;
    position:absolute;
    animation-name:imgAppear;
    animation-duration:1s;
    animation-fill-mode: forwards;
}

.carusel_img_delete{
    box-shadow:0 0 2px 2px white;
    z-index:1;
    position:absolute;
    animation-name:imgDisappear;
    animation-duration:1s;
    animation-fill-mode: forwards; 
}

@keyframes imgAppear {
    from{
        opacity:0;
        width:600px;
    }
    to{
        opacity:1;
        width:500px;
    }
}

@keyframes imgDisappear {
    from{opacity:1;}
    to{opacity:0;}
}
.text_bloñk{
    max-width:1500px;
    margin-left:auto;
    margin-right:auto;
    text-align:justify;
    font-family: var(--menu-font-family);
    font-size: 20px;
    color:black;
    /* text-shadow: 1px 1px 1px blue; */
}
.index_greetings{
	color:blue;
	font-size:25px;
	text-align:center;
}
.signature{
    text-align:right;
    font-style: italic;
}
.img_container{
    float:left;
    width:270px;
    text-align: center;
    margin:10px;
    background-color: var(--menu-color);
    border-radius: 5px;
}
.img_container img{
    width:250px;
    margin:10px;
    border-radius: 5px;
}
.img_container span{
    font-style:italic;
    color:white;
}
.bottom_container{
    background-color:var(--menu-color);
    height:70px;
    max-width:1500px;
    margin-top:10px;
    margin-left:auto;
    margin-right:auto;
    border-radius:10px;
    text-align:center;
    padding-top:10px;
}

.bottom_container span{
    font-family: var(--menu-font-family);
    font-size: 20px;
    color:white;
}
.bottom_container a{
    font-family: var(--menu-font-family);
    font-size: 20px;
    color:white;
    text-decoration: none;
}
.bottom_container a:hover{
    text-decoration: underline;
}
.page_name{
    max-width:1500px;
    height:60px;

    margin-left:auto;
    margin-right: auto;
    text-align:center;
    font-family: var(--menu-font-family);
    font-size:35px;
    margin-top:10px;
    color:blue;
    text-shadow: 1px 1px 2px red;
}
.page_name span{
    cursor:pointer;
}
.page_name span:hover{
    color:red;
    font-weight:bold;
}
#float_tooltip{
    width:300px;
    height:200px;
    border:1px solid black;
    position:fixed;
    top:0;
    left:0;
    border-radius: 20px;;
    display:none;
}
.page_container{
    max-width:1500px;
    margin-left:auto;
    margin-right: auto;
    display:flex;
    justify-content: center;
    flex-wrap: wrap;
}
.video_item_container{
    width:300px;
    height:300px;
    padding:5px;
    margin:5px;
    text-align:center;
    border-radius:10px;
    background-color:var(--menu-color);
    cursor:pointer;
}
.video_item_container:hover{
    box-shadow: 0 0 3px 3px white;
}
.video_item_container img{
    border-radius:10px;
}

.video_item_container span{
    font-family: var(--menu-font-family);
    font-size:25px;
    color:white;
}
.fog{
    position:fixed;
    top:0;
    margin:0;
    width:100%;
    height:100%;
    background: rgba(128,128,128,0.9);
    display:flex;
    justify-content: center;
    align-content:center;
    flex-wrap: wrap;
}
.win_for_video{
    width:600px;
    padding:10px;
    background-color:var(--main-bg-color);
    border-radius:10px;
}
 .win_for_video_top{
    height:60px;
    text-align:right;
    margin-bottom:20px;
    background-color:var(--menu-color);
 }
 .win_for_video_top img{
    cursor:pointer;
    margin:5px;
 }
 .audio_line{
	display:flex;
	max-width:1500px;
	margin-right:auto;
	margin-left:auto;
	font-family: var(--menu-font-family);
	font-size:20px;
    color:white;
	 
 }
 .audio_line_name{
	margin:5px;
	padding:5px;
	border-radius:10px;
	width: calc(100% - 250px);
	background-color:var(--menu-color);
 }
 .audio_line_time{
	margin:5px;
	padding:5px;
	border-radius:10px;
	width:100px;
	text-align:center;
	background-color:var(--menu-color); 
 }
 .audio_line_play{
	margin:5px;
	padding:5px;
	border-radius:10px;
	width:100px;
	text-align:center;
	cursor:pointer;
	background-color:var(--menu-color); 
	background-image:url('pics/play.png');
	background-repeat:no-repeat;
	background-position:center;
 }
 
 .audio_line_play:hover{
	box-shadow:0 0 2px 2px white;
 }
 .audio_line_download{
	margin:5px;
	padding:5px;
	border-radius:10px;
	width:100px;
	text-align:center;
	cursor:pointer;
	background-color:var(--menu-color);  
	background-image:url('pics/download.png');
	background-repeat:no-repeat;
	background-position:center;
 }
 .audio_line_download:hover{
	box-shadow:0 0 2px 2px white;
	
 }
.div_audio_name{
	margin-bottom:20px;
	font-family: var(--menu-font-family);
	font-size:20px;
    color:white;
} 
 
 .raskraski_chapter_container{
	position:relative; 
	width: 440px;
	height:360px;
	margin:5px;
	text-align:center;
	border-radius:20px;
 }
.raskraski_chapter_container span{
	display:inline-block;
	position:relative;
	z-index:1;
	margin-top:280px;
	margin-bottom:20px;
	font-family: var(--menu-font-family);
	font-size:20px;
	background-color:var(--main-bg-color);
	padding:5px; 
	border-radius:20px;
	box-shadow:0 0 2px 2px white;
}
 .raskraski_chapter_container img{
	border:1px solid black;
	top:25px;
 }
 
 .raskraski_chapter_container:hover img{
	box-shadow:0 0 2px 2px white;
 }
 
 .raskraski_chapter_img1{
	position:absolute;
	left:40px;
	transform: rotate(-15deg);
 }
  .raskraski_chapter_img2{
	position:absolute;
	left:120px;
	transform: rotate(0deg);
 }
  .raskraski_chapter_img3{
	position:absolute;
	left:200px;
	transform: rotate(15deg);
 }
.rasraski_chapters_container{
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.header{
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	font-family: var(--menu-font-family);
	font-size:30px;
	color:blue;
}

.raskraski_container{
	display:flex;
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	flex-wrap:wrap;
	justify-content:center;
}
.raskraski_container img{
	margin:5px;
}

.page_back{
	max-width:1500px;
	width:100%;
	text-align:center;
	margin:5px;
	font-family: var(--menu-font-family);
	font-size:20px;
	margin-left:auto;
	margin-right:auto;
	display:block;
	color:white;
}
.pesni_container{
	max-width:1500px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}

.pesni_line{
	margin:10px;
	padding:5px;
	background-color:var(--menu-color);
	border-radius:10px;
	font-family: var(--menu-font-family);
	font-size:20px;
}
.pesni_line:hover{
	box-shadow:0 0 2px 2px white;
}
.pesni_a {
		text-decoration:none;
		width:100%;
		display:inline-block;
	}

.pesni_line a span{
	color:white;
}
.pesni_author{
	font-style:italic;
}
.pesnia_container{
	width:100%;
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	font-family: var(--menu-font-family);
	font-size:20px;
}
.pesnia_name{
	font-size:30px;
	color:white;
}
.pesnia_container img{
	margin:20px;
}
.books_container{
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.books_container a{
	display:block;
	width:210px;
	height: 410px;
	font-family: var(--menu-font-family);
	font-size:20px;
	color:white;
	text-align:center;
	padding:10px;
	margin:5px;
	border-radius:10px;
	text-decoration:none;
}
.books_container a:hover{
	box-shadow:0 0 2px 2px white;
}

.adult_page_container{
	max-width:1500px;
	width:100%;
	margin-right:auto;
	margin-left:auto;
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	font-family: var(--menu-font-family);
	margin-top:20px;
}

.adult_article_preview{
	display:block;
	width:470px;
	height:450px;
	margin:5px;
	padding:5px;
	border:1px solid white;
	text-decoration:none;
	overflow:hidden;
	border-radius:10px;
}

.adult_article_preview:hover{
	box-shadow:0 0 2px 2px white;
}


.adult_article_name{
	font-size: 25px;
	color:white;
	background-color:var(--menu-color);
	width:470px;
	height:70px;
	display:flex;
	justify-content:center;
	align-content:center;
	flex-wrap:wrap;
	text-align:center;
	border-radius:10px;

}

.adult_article_short_text{
	font-size:20px;
	color:blue;
	text-align:justify;
}

.adult_aricle_container{
	width:100%;
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	font-family: var(--menu-font-family);
	margin-top:20px;
	color:blue;
	text-align:justify;
	font-size:20px;
}
.adult_aricle_container h3 {
	font-size:25px;
	color:white;
	background-color:var(--menu-color);
	border-radius:10px;
	text-align:center;
}
.adult_aricle_container h4{
	text-align:center;
}
.adult_aricle_container a{
	color:white;
	text-decoration:none;
}
.adult_aricle_container img{
	margin-left:10px;
	margin-right:10px;
	border-radius:10px;
}

.adult_aricle_container a:hover{
	box-shadow: 0 0 2px 2px white;
}
.img_article_left{
	float:left;
	margin-right:10px;
	border-radius:10px;
}
.diafilm_container{
	width:100%;
	max-width:1500px;
	margin-right:auto;
	margin-left:auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.diafilm_container a{
	display:block;
	border:1px solid white;
	margin:5px;
	padding:5px;
	width:305px;
	height:280px;
	text-align:center;
	text-decoration:none;
	border-radius:10px;
}
.diafilm_container a:hover{
	box-shadow:0 0 2px 2px white;
}
.diafilm_container a img{
	width:300px;
	height:225px;
	border-radius:10px;
}
.diafilm_container a span{
	font-family: var(--menu-font-family);
	font-size:20px;
	color:white;
	width:100%;
}
.diafilm_screen{
	width:1024px;
	height:768px;
	padding:5px;
	margin:5px;
	background-color:white;
	margin-left:auto;
	margin-right:auto;
	display:flex;
	overflow:hidden;
	position:relative;
	border-radius:10px;
	
}
.diafilm_screen img{
	margin-right:5px;
	padding:0px;
	margin-left:0px;
}

.diafilm_navigation{
	max-width:1024px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
.diafilm_navigation img{
	cursor:pointer;
	margin-top:5px;
	margin-left:40px;
	margin-right:40px;
}
.diafilm_container_full{
	width:100%;
	max-width:1500px;
	margin-right:auto;
	margin-left:auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	margin-top:20px;
}
.diafilm_container_full img {
	margin:5px;
	border-radius:10px;
	cursor:pointer;
}
.diafilm_container_full img:hover{
	box-shadow:0 0 2px 2px white;
}

.diafilm_container_img_selected {
	box-shadow:0 0 3px 3px white;
}
.left_arrow{
	width:100px;
	margin:20px;

}
.left_arrow img{
	cursor:pointer;
	margin-top: 320px;
}
.diafilm_container_flex{
	display:flex;
	max-width:1500px;
	
}
.diafilm_download_container{
	max-width:1500px;
	margin-top:20px;
	margin-left:auto;
	margin-right:auto;
}
.games_main_container{
	width:100%;
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	display:flex;
	justify-content:center;
	font-family: var(--menu-font-family);
	font-size:18px;
}

.games_main_item{
	width:262px;
	margin:5px;
	padding:5px;
	border-radius:10px;
	border:1px solid white;
	display:block;
	text-decoration:none;
	color:blue;
}
.games_main_item:hover{
	box-shadow: 0 0 2px 2px white;
}
.games_main_item img{
	border-radius:10px;
}
.games_main_item span{
	background-color:var(--menu-color);
	border-radius:10px;
	color:white;
	font-size:25px;
	display:block;
	padding:5px;
	margin:5px;
}

.computer_games_container{
	width:100%;
	max-width:1500px;
	margin-left:auto;
	margin-right:auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	
}
.computer_games_item{
	display:block;
	width:600px;
	text-decoration:none;
	color:blue;
	margin:10px;
	border:1px solid white;
	padding:5px;
	border-radius:10px;
	font-family: var(--menu-font-family);
	font-size:18px;
	text-align:justify;
}
.computer_games_item  img {
	border-radius:10px;
}
.computer_games_item span{
	width:100%;
	text-align:center;
	display:block;
	font-size:25px;
	color:white;
}