* {box-sizing: border-box;}
* {margin: 0; padding: 0;}
/* ширина экрана ноута: 1536 / телефона  вертикально: 360 / телефона горизонтально: 800
делаем до 700 / до 1000 / выше 1000 
*/

::-webkit-scrollbar 
{
  width:10rem;
  background-color: #F1F1F1;
}

::-webkit-scrollbar-thumb 
{
    background-color: #A7B0EB;
}

table { border-collapse: collapse; }
	
@font-face
  {
  font-family: Nueva;
  src: url("../fonts/ofont.ru_Old Classic.ttf");
  }
  
@font-face
  {
  font-family: Garet;
  src: url("../fonts/ofont.ru_Garet.ttf");
  }  

 @font-face
  {
  font-family: Countryhouseg;
  src: url("../fonts/mr_countryhouseg_0.ttf");
  }   
  
 @font-face
  {
  font-family: Arial;
  src: url("../fonts/arialmt.ttf  ");
  }   

 @font-face
  {
  font-family: Tahoma;
  src: url("../fonts/tahoma.ttf  ");
  }  
  
 @font-face
  {
  font-family: Calibri;
  src: url("../fonts/calibri.ttf  ");
  } 	

	@font-face {
		font-family: "Tatianac";
		src: url("../fonts/tatianac.ttf");
	}  
  

body {
background-repeat:no-repeat;
background-attachment: fixed;
background-color:#CED4FD;
background-position:center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
background-size: cover;
font-size:15rem;
padding:0;
margin:0;
}

/* РЅР° РєРѕРјРїРµ*/
@media (min-width: 1200px)
{
	html {font-size: 1px;}	
	body { background-image:url("../img/images/fon4.jpg"); }
	#left_sidebar {display:flex;}
	#right_sidebar {display:flex;}	
	#header-1 {}
	#header-2 {}
	#header-3{}
	#gimn1 {display:flex;}
	#gimn2 {display:none;}
	#header {}
	#header-mob-link-menu {width:120rem;}
	#header-mob-link-menu5 {display:none;}	
	#header-logo {padding:4rem;}
	#content {padding:25rem 40rem 40rem 40rem;}
	#container {left:50%;width:950rem;margin-left:-475rem;}
	#logo {height:135px;width:135px;}
	#logo_mob {position:absolute;left:10rem;top:5rem;}
	#logo_mob img {height:120rem;}	
	#mob_menu {left:50%;margin-left:-170px;top:10px;border-radius:10rem;}

	.menu1 {width:322rem; margin:40px; padding:27px 10px; border-radius:10px 10px 10px 10px;}
	.menu-child  {width:300rem;font-size:15rem;}
	.menu-child1 {width:12rem;}	
	.menu-child-text{padding:5px 10px;}	
	
	#footer {display:none;}
	.pleer_AB{width:500rem;}
	#strelka {display:none;}
	#div-photo-fest {margin-left:-9rem;}	
	#div-photo-fest  img {width:95rem;height:115rem;}	
	.data_zag  {font-size:30rem;line-height:32rem;padding:5rem;margin-top:-20rem;}	
	
	.pleer_A1 {height:15rem;width:14rem;}
	#fest-sity-dates-gimn {margin-top:-15rem;}
}

/* на мобильном*/
@media (max-width: 1200px) 
{
	html {font-size: 2.4px;}	
	body	 {background-color:#E4E7FF; }
	#left_sidebar {display:none;}
	#right_sidebar {display:none;}		
	#header-1 {}
	#header-2 {}
	#header-3{}
	#header-logo {margin-left:-2rem;}
	#header-mob-link-menu {margin-right:-2rem;width:80rem;}
	#gimn1 {display:none;}
	#gimn2 {display:flex;}
	#header {position:fixed;top:1rem;left:4rem;right:4rem;}	
	#content {margin-top:195px;padding:10rem 5rem 5rem 5rem;}
	#container {left:3rem;right:3rem;}	
	#logo {height:155px;width:155px;}
	#logo_mob {position:absolute;left:4rem;top:6rem;}	
	#logo_mob img {height:62rem;}	
	#mob_menu {left:0rem;right:0rem;top:0rem;bottom:0rem;border-radius:0rem;}	
	#tcitata {display:none;}

	.menu1 {width:100%; margin:40px 0px 0px 0px; padding:0px;}	
	.menu-child {font-size:18rem;line-height:37rem;}
	.menu-child1 {width:22rem;}	
	.menu-child-text{padding:5px 30px;}	
	
	#footer {display:block;}
	.pleer_AB{width:310rem;}
	#close_menu {display:none;}	
	#div-photo-fest {}
	#div-photo-fest  img {width:60rem;height:77rem;}		
	.data_zag  {font-size:22rem;line-height:31rem;}	
	
	.pleer_A1 {height:15rem;width:11rem;}
}

.clearfix {clear: both;}

@keyframes ani {
  0% {transform: translateY(-150%);}
  100% {transform: translateY(0);}
}


a 
{
text-decoration:none;
color:#0000FF;
}

a:hover
{
color:#345DFF;
}

a:active
{
color:#89A1FF;
text-shadow: white 0px 0px 10px;
text-decoration:none;
}

#tcitata
{
position:fixed;
right:10px;
top:10px;
z-index:5;
color:white;
text-align:right;
font-family:Calibri;
font-size:14px;
}

#header
{
background-image:linear-gradient(to top, #EBEEFF, #A5B0FA);
border-radius:10px 10px 0px 0px;
min-height:50rem;
padding:5rem;
display:flex;
justify-content:space-between;
}

#header-logo
{

}

#header-text
{
width:100%;
display:flex;
flex-direction: column;
justify-content: center;
}

#header-mob-link-menu2
{
border-radius:10px;
}

#header-mob-link-menu2:hover
{
background-color:#DEE2FE;
box-shadow:inset 0px 0px 20px #9CABF1;
}
#header-mob-link-menu2:active
{
background-color:#E8ECFF;
}

#header-mob-link-menu4
{
border-radius:10px;
}

#header-mob-link-menu4:hover
{
background-color:#DEE2FE;
box-shadow:inset 0px 0px 20px #9CABF1;
}
#header-mob-link-menu4:active
{
background-color:#E8ECFF;
}

	
.data_zag 
{

text-shadow: #FFFFFF 1px -1px 0,#FFFFFF -1px 1px 0, #8989EA 2px -2px 0;
letter-spacing:3rem;
font-family:Arial;
color:#000066;
font-weight:bold;
text-align:center;
}

#logo
{

}
#logo img
{
width:120rem;
height:120rem;

}

#header-1
{
font-family:Arial;
font-size:25px;
letter-spacing:5px;
color:#000066;
line-height:35px;
text-shadow: #FFFFFF 1px -1px 0, #8989EA 2px -2px 0;
font-weight:bold;
}

#header-2
{
font-family:Arial;
font-size:60px;
line-height:75px;
letter-spacing:15px;
color:#000066;
text-shadow: #FFFFFF 1px -1px 0, #8989EA 2px -2px 0, #8989EA 3px -3px 0, #FFFFFF -1px 1px 0;
font-weight:bold;
padding-left:10px;
}

#header-3
{
font-family:Arial;
font-size:28px;
letter-spacing:9px;
color:#0000FF;
line-height:40px;
padding-left:4px;
}


#mob_menu
{
z-index:11;
position:fixed;
background:#CED4FD;
display:block;
box-shadow: inset 0px 0rem 45rem #6874C6;

clip: rect(auto auto 0rem auto);

//  transform: translateY(-150%);
//  animation: ani 1s forwards;
}
#strelka
{
text-align:center;
margin-top:20rem;
}
#strelka img
{
width:180rem;
height:48rem;
opacity:0.5;
}
#strelka img:active
{
opacity:0.3;
}

#gimn1
{
justify-content:center;
margin-top:15rem;
}
#gimn2
{
margin-top:10rem;
justify-content:space-evenly;
}

.pleer_A 
{
display:flex;
justify-content:space-between;
cursor:pointer;
background-color:;
padding:5rem;
border-radius:2rem;
}

.pleer_A:hover
{
background: linear-gradient(to bottom, #fff, #fff);
box-shadow:  0px 0px 5rem #E6E9FF;
}
.pleer_A:active
{
background:linear-gradient(to right, #fff, #B7C0F6);
box-shadow:  0px 0px 5rem #E6E9FF;
}

.pleer_A1
{

// padding:3rem 0rem 0rem 0rem;
// border-radius:10%;
margin:2rem 0rem 0rem 0rem;

background-image: url("../img/images/play3.png");
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
.pleer_A2
{
margin:-3rem 12rem 0 12rem;
color:#3E4DB0;
font-family:Tahoma;
font-size:15rem;
}
.pleer_A3
{
margin:-2rem 0 0 0;
color:#3E4DB0;
font-family:Tahoma;
font-size:15rem;
}
.pleer_B 
{
margin:1rem;
}

.gimn_text
{
margin:0 0 0 10rem;
cursor:pointer;
padding:3rem;
border-radius:2rem;
display:block;
}
.gimn_notes
{
margin:0 0 0 12rem;
cursor:pointer;
padding:3rem;
border-radius:2rem;
display:block;
}
.gimn_text:active, .gimn_notes:active 
{
background-color:#E7EAFC;
}
.download
{
position:absolute;
z-index:5;
margin-top:-28rem;
margin-left:-10rem;
width:64rem;
border-radius:2rem;
padding:2rem;
background-color:#ffffff;
font-size:10rem;
font-family:Calibri;
display:none;
text-align:center;
}

.mask
{
background-color:rgba(0,0,0,.7);
height:100%;
position:fixed;
width:100%;
top:0;
left:0;
z-index:10;
}

.close
{
position:absolute;
top:3rem;
right:3rem;
padding:5rem;
border-radius:5rem;
border:0px solid red;
cursor:pointer;
height:38rem;
width:38rem;
}
.close:hover
{
background-color:#B8BFF4;
box-shadow: inset 0px 0px 5px #2B73C4;
border:1px solid #224999;
}
.close:active
{
background-color:#B8BFF4;
box-shadow: inset 0px 0px 10px #2B73C4;
border:1px solid #224999;
}
.close img
{
height:25rem;
}


#container
{
position:absolute;
border-radius:10px;
box-shadow: 0px 0px 10px #0F1597;
border:1px solid #11159F;
text-align:center;
}

#content
{
color: #000000;
text-align:justify;
font-family:Tahoma;
font-size:16rem;
line-height:24rem;
width:100%;
background-color:#CED4FD;
border-radius:0px 0px 10px 10px;
min-height:200rem;
}

#left_sidebar
{
width:420rem;
padding-left:10rem;
}


.menu1
{

display:flex;
flex-direction:column;
position:relative;
box-shadow: inset -1px 1px #1E529A, inset 1px -1px #243C5C, 0px 0px 51rem #667FD8; 
border:1px solid #939DE3;
}
.menu-child
{
font-family:Garet;
display:flex;
color:#000066;
 border:1px solid #7474C5;
 border-width:2px 0px 0px 0px;
 box-shadow: inset 0px 1px #94A8DA;
}
.menu-child1
{
background-color:#9D9DE5;
margin:1px 0px 0px 0px;
}

.menu-last 
{
border-width:2px 0px 2px 0px;
box-shadow: inset 0px 1px #94A8DA, 0px 1px #94A8DA;
}	

.selected
{
background: linear-gradient(to right, #9D9DE5 0%, #9D9DE5 10%, #5A5BC3 100%);
color:#FFFFFF;

}
.menu-child:hover
{
background: linear-gradient(to right, #9D9DE5 0%, #9D9DE5 10%, #5A5BC3 100%);
color:#FFFFFF;
}

.menu-child:active
{
background: linear-gradient(to right, #9D9DE5 0%, #9D9DE5 50%, #8181E7 100%);
}



.div-button-menu
{
margin:5rem;
}


 

 

#right_sidebar
{
width:420rem;
background-color:;
padding-right:10rem;
}



.empty
{
height:5rem;
}
.empty2
{
height:20rem;
}


#footer
{
background:linear-gradient(to bottom, #EBEEFF, #A5B0FA);
//border:0px solid #007943;
//box-shadow: inset 0 0px 20px  #71E416;
font-size:15rem;
font-family:Garet;
color:#FFFFFF;
position:fixed;
height:50rem;
bottom:0;
left:4rem;
right:4rem;
z-index:9;
}


.button-submit {
border:0px solid blue;
margin:20px auto;
font-size:16rem;
line-height:21rem;
display:block;
padding:10rem;
text-align:center;
font-size:16rem;
font-family:Garet;
font-weight:bold;
text-decoration: none;
border-radius: 5px;
background: #7581CE;
box-shadow: 0 -3px #5C68B3 inset;
transition: 0.2s;
color:white;
width:90%;
cursor:pointer;
} 
.button-submit:hover { background: #5C68B3; color:white; }
.button-submit:active {
  background: #4757BD;
  box-shadow: 0 3px #4757BD inset;
  color:white;
}


.button-reset {
border:0px solid blue;
margin:20px auto;
font-size:16rem;
line-height:21rem;
display:block;
padding:10rem;
text-align:center;
font-size:16rem;
font-family:Garet;
font-weight:bold;
text-decoration: none;
border-radius: 5px;
background: #B685D8;
box-shadow: 0 -3px #9F6CC2 inset;
transition: 0.2s;
color:white;
width:90%;
cursor:pointer;
} 
.button-reset:hover { background: #9F6CC2; color:white; }
.button-reset:active {
  background: #8E53B7;
  box-shadow: 0 3px #8E53B7 inset;
  color:white;
}