*  {margin:0px;padding:0px;}
A {text-decoration:none;}
A:link {text-decoration:none;color:rgba(70, 181, 195, 1);}
A:visited {text-decoration:none;color:rgba(70, 181, 195, 1);}
A:active {text-decoration:none;color:rgba(70, 181, 195, 1);}
A:hover {text-decoration:none;color:rgba(70, 181, 195, 1);}
@font-face {
    font-family: Comicz;
	src: url('fonts/16872.ttf')}
html {width:100%;height:100%;}
header, content, footer {float:left;clear:left;width:100%}
#MainUnit {position:relative}
#SubMainUnit {position:absolute}
body {width:100%;min-width:320px;position:relative}
/*---------------------------------МЕНЮ И ТЕЛЕФОН-----------------------------------------*/

.myclass {margin-right:0;border-top-left-radius:0px;border-bottom-left-radius:0px;} /* ?????????????????????*/

#up_nav {width:20%;height:auto;position:fixed;z-index:5500;right:0}
#menu {width:100%;height:auto;float:right;clear:right;margin-right:-100%;margin-top:#5%;transition:#all ease 100ms;z-index:6000;}
#menu img {width:25%;margin-left:-25%;right:#80px;cursor:pointer;z-index:5000;display:block;position:relative}
#menu div {width:100%;height:auto;position:relative;margin-top:#-5%;outline:#1px solid;}
#menu ul {width:100%;height:auto;cursor:pointer;}
#menu ul li {width:100%;height:auto;list-style:none;float:left;position:relative;background:rgba(253, 220, 87, 0.9);box-shadow:#0 3px 20px rgba(0,0,0,0.3);}
#menu ul li a {width:auto;height:auto;display:block;text-align:center;padding:15px;font-family: "Comicz";color:#be6200;text-align: center;z-index:7000;
text-transform:uppercase;font-size:20px;}
#menu ul li a:active {color:#643401;}
#menu li ul {position:absolute;height:100%;right:-9999px;opacity:0;float:none;transition:opacity 0.8s}
#menu li ul li {width:80%;float:#left;margin-left:0;}
#menu.active {margin-right:0;border-top-left-radius:0px;border-bottom-left-radius:0px;}
#menuJSw.activeJSworks ul {right:67%;opacity:1;z-index:6000;width:80%;top:30%;}
#menuJSc.activeJScourses ul {right:67%;opacity:1;z-index:6000;width:80%;top:30%;}
#menu.active img {margin-left:75%;z-index:4000;}
#menu.active ul li {border-bottom:2px solid rgba(190, 98, 0, 0.1);}
#menu.active li ul li {z-index:7000;background: rgba(252,221,96, 1);box-shadow:0 3px 10px rgba(0,0,0,0.3);}
#menu.active li a {background: rgba(255, 233, 139, 0.2);}
#menu ul li a:hover {
    background: #f3cd3a;
}
#menu ul li a:active {
    background: #f9ce25;
}

#phone {width:100%;height:70px;float:right;border-bottom-left-radius:30px;
 background:rgba(253, 220, 87, 0.9) ;box-shadow:0 3px 20px rgba(0,0,0,0.2);color:#be6200;}
#phone img {height:90%;margin-left:5px;float:left}
#phone p a{width:70%;float:left;text-align:center;color:#be6200;font-size:25px;font-weight:bold;text-shadow:1px 1px 1px rgba(230,230,230,.7);font-family: Comicz;}
/*---------------------------------ЛОГО И ИМЯ---------------------------------------------*/
#logo {width:35%;float:left;margin-top:140px;margin-left:5%}
#logo img {width:100%;float:left;margin-left:20px}
#Title {width:40%;float:right;margin-top:140px;margin-left:5%}
#Title img {width:100%;float:right;margin-right:20%; opacity:0.7}
#Title h1 {display:none}
/*---------------------------------КОНТЕНТ------------------------------------------------*/
#Content {float:left;width:100%;margin-top:0px;position:relative;z-index:500;}
#Content p {color: rgba(24,18,56,1)}

/*----------------------------------------------------------------------------------------*/
	h2{font-size:32px;color:rgba(190, 98, 0, 1);text-align:center;padding:5px;text-transform: uppercase;}		/*--font-size-------*/																																				/*--font-size-------*/
	h3{font-size:32px;color:rgba(70, 181, 195, 1);text-align:center;padding:5px;text-transform: uppercase;}
	h3 span, h2 span, h4 span {font-size:24px}
	h4  {font-size:28px;font-family:"arial"}
	#block1 h2,#block1 h3,#block2 h2,#block2 h3,#ChildCour h2,#ChildCour h3,#Works h2,#Works h3,#AdultCour h2,#AdultCour h3  {font-family: "Comicz";}/*--font-size-------*/
	#about_us,#child_courses,#adult_courses,#b_courses,#d_learning,#contacts,#footr {font-family: Arial}
/*---------------------------------ЛЕВЫЙ БЛОК КОНТЕНТА------------------------------------*/
	#Children {width:100%}
	#block1 {width:45%;float:left;margin-left:5%;border-radius:10px 10px 0 10px;background:rgba(255,255,255,0.45);}
	#block1 .Children_orange {font-weight:normal;color:rgba(190, 98, 0, 1);padding:15px;margin-left:15px;font-family:"arial";list-style-type: circle;list-style-position:outside;font-size:30px;}/*--font-size-------*/
	#block1 .Children_orange span {text-shadow:#1px 1px 1px rgba(0,0,0,.5);font-family: "Comicz";font-size:34px;}																/*--font-size-------*/
	#block1 .Children_black	{padding:15px;margin-left:15px;font-family:"arial";list-style-type: circle;list-style-position:outside;font-size:30px;color:#333;font-size:27px}							/*--font-size-------*/
	#block1 p  span {color:rgba(190, 98, 0, 1);text-shadow:#1px 1px 1px rgba(0,0,0,.7)}/*rgba(70, 181, 195, 1)*/
	
/*---------------------------------ПРАВЫЙ БЛОК КОНТЕНТА------------------------------------*/
	#block2 {width:45%;float:left;margin-top:100px;background:rgba(255,255,255,0.45);z-index:400;border-left:1px solid rgba(72, 192, 188, 0.2)}
	#block2 img {width:100%;display:block; margin-top:30px }

/*---------------------------------ДЛЯ ДЕТЕЙ-----------------------------------------------*/
	#ChildCour h4 {padding:1px 0px;color:rgba(70, 181, 195 ,1);text-align:center;font-family: "Comicz";font-size:24px;}					/*--font-size-------*/
	#ChildCour #TypesCour {width: 29.33%;float:left;margin-left:3%;border-top:4px solid rgba(190, 98, 0,1);margin-top:15px;height:auto;}
	#ChildCour #TypesCour:nth-child(5) {clear:left}
	#ChildCour p {padding:15px;text-align:justify;font-family:"verdana";font-size:14px;}
	#ChildCour span {font-weight:bold;word-spacing:1px}
	#ChildCour #TypesCour img {width:25%;padding:5px 10px;float:left}
	#ChildCour #TypesCour:hover {background:rgba(255, 126, 30,.1);}
	#ChildCour #TypesCour:hover img {transform:rotate(360deg);transition:1s}
/*-----------------------------------РАБОТЫ-----------------------------------------------*/
	
	#Sites,#Grafic {width:100%;float:left}
	#Sites img,#Grafic img {width:40%;float:left;margin-left:6.666%;margin-top:30px;margin-bottom:30px;box-shadow: 0px 0px 15px rgba(0,0,0,.3);}
	#Sites img {transform:rotate(-2deg)}
	#Grafic img {transform:rotate(2deg)}
	#Sites img:hover,#Grafic img:hover {transform:rotate(0deg);transition: all 0.5s ease-in-out;}
	#Sites a,#Grafic a {width:auto;padding:2px 7px;text-align:center;font-size:30px;border:1px solid #fefcea;text-transform: uppercase;
	border-radius:50px;background: rgba(190, 98, 0,.8);color:white;}
	.cent {text-align:center;margin-bottom:50px;}
	#Grafic a {margin-top:15px;}
	#Sites a {margin-bottom:15px;}
	#Sites a:hover,#Grafic a:hover {text-shadow:1px 1px 10px rgba(0,0,0,.3);box-shadow: 0px 0px 15px rgba(0,0,0,.3);background: rgba(190, 98, 0,1)}
/*---------------------------------ДЛЯ ВЗРОСЛЫХ--------------------------------------------------*/
	#AdultCour p {text-align:justify;padding:15px;}
	#AdultCour li {color:#be6200;font-size:28px;}			/*--font-size-------*/
	 
		#accordion > h4 {
			color: blue;
			cursor: pointer;
			margin: 5px 0;
			padding: .4em .0em .4em .0em;
			/*border: 1px solid #ddd;
			border-radius: 5px;
			border: 1px solid #c5c5c5;*/
			background: #f6f6f6;
			font-weight: normal;
			color: #454545;
		}
		#accordion > h4.select {
			/*border: 1px solid #003eff;*/
			background:# rgba(70, 181, 195, 1);
			font-weight: normal;
			color:rgba(190, 98, 0, 1);
		}
		#accordion > div {
			height: 0;
			overflow: hidden;
			color: #333;
			margin-top:#-20px;
			padding-left: 15px;
			padding-right: 15px;
			transition: height .5s;
		}
		.tabs__text {
			font: 24px Arial;
			text-align: justify;
		}
	
/*-------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------*/
/*---------------------------------О Б Щ И Е _____ С Т И Л И------------------------*/
	#ChildCour,#AdultCour,#Works,#works_grafic,#works_sites,#about_us,#child_courses,#adult_courses,#b_courses,#d_learning,#contacts,#footr {width:90%;float:left;clear:left;margin-left:5%;box-sizing:border-box;}
	#about_us p,#child_courses p,#adult_courses p,#b_courses p,#d_learning p,#contacts p {text-align:justify;padding:20px;font-size:24px}
	#about_us ul li{font-size:22px}
	#child_courses b,#adult_courses b {color:rgba(70, 181, 195, 1);}
	#AdultCour ul,#adult_courses ul,#b_courses ul {margin-left:45px;font-size:24px;list-style-position: outside;list-style-type: circle;}										/*--font-size-------*/
	
	#b_courses p span {color:rgba(70, 181, 195 ,1);text-align:center}
	#contacts img {height:16px}

/*---------------------------------ПОДВАЛ--------------------------------------------------*/
	#footr {margin-top:50px;padding-top:50px;border-top:5px solid rgba(0,0,0,0.15);}
	#footr p {font-size:20px;padding:20px;font-weight:600;margin-bottom:10px;}															
	#footr h3 {font-size:20px;color:rgba(70, 181, 195, 1);text-align:center}										/*--font-size-------*/

	#footr_left {width:40%;float:left;height:auto}
	
	.photo {width:100%;}
	#photo {height:auto;padding:50%;-moz-user-select: none; user-select: none;position:relative;float:left}
	#photo img {display:block;position: absolute;width:35%;left:50%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
	#photo img:nth-child(1) {top:30%}
	#photo img:nth-child(2) {top:90%;cursor: zoom-in;transition:.3s;}
	#img2:focus {position:absolute;z-index:1000;width:100%;pointer-events:none;top:70%}
	#img2:focus  ~ div {position:absolute;top:0%;left:0%;right:0%;bottom:0%;background:;cursor:zoom-out;}

	

	#footr_right {width:60%;float:left;margin-left:0%;}
	#footr_right img {width:16px}
	#footr_right span img {width:75%}
	
	.footr_text {width:90%;float:left;clear:left;margin-left:5%;}
	#footr .footr_text p {font-weight:100;padding:10px;}
	#footr .footr_text p span {font-weight:bold; }
	#footr .footr_text div {width:100%;height:auto;float:left}

/*---------------------------------АДАПТАЦИЯ--------------------------------------------------*/

/*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/

/*ДОБАВИТЬ МЕДИА-ЗАПРОС НА 1920px!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/

@media only screen and (max-width:1920px)
{
	#about_us {outline:#1px solid red;margin-top:350px}
	#works_grafic {margin-top:350px}
	#works_sites {margin-top:350px}
	#child_courses {margin-top:350px}
	#adult_courses {margin-top:350px}
	#b_courses {margin-top:350px}
	#d_learning {margin-top:350px}
	#contacts {margin-top:350px}

}
/*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/

@media only screen and (max-width:1600px)
{
	#about_us {margin-top:275px}
	#works_grafic {margin-top:275px}
	#works_sites {margin-top:275px}
	#child_courses {margin-top:275px}
	#adult_courses {margin-top:275px}
	#b_courses {margin-top:275px}
	#d_learning {margin-top:275px}
	#contacts {margin-top:275px}

}
@media only screen and (max-width:1440px)
{
	#about_us {margin-top:235px}
	#works_grafic {margin-top:235x}
	#works_sites {margin-top:235px}
	#child_courses {margin-top:235px;}
	#adult_courses {margin-top:235px}
	#b_courses {margin-top:235px}
	#d_learning {margin-top:235px}
	#contacts {margin-top:235px}
}
@media only screen and (max-width:1360px)
{
	#about_us {margin-top:220px}
	#works_grafic {margin-top:220px}
	#works_sites {margin-top:220px}
	#child_courses {margin-top:220px;}
	#adult_courses {margin-top:220px}
	#b_courses {margin-top:220px}
	#d_learning {margin-top:220px}
	#contacts {margin-top:220px}

}
@media only screen and (max-width:1280px)
{
	#about_us {margin-top:200px}
	#works_grafic {margin-top:200px}
	#works_sites {margin-top:200px}
	#child_courses {margin-top:200px;}
	#adult_courses {margin-top:200px}
	#b_courses {margin-top:200px}
	#d_learning {margin-top:200px}
	#contacts {margin-top:200px}
	
	#footr p {font-size:18px;}															
	#footr h3 {font-size:18px}
	#footr_right img {width:18px}
	
	#AdultCour li {font-size:30px;}

	#phone p a {font-size:24px;}
	#phone img {height:70%;margin-top:2px}

	
}
@media only screen and (max-width:1152px)
{
	#about_us {margin-top:170px}
	#works_grafic {margin-top:170px}
	#works_sites {margin-top:170px}
	#child_courses {margin-top:170px;}
	#adult_courses {margin-top:170px}
	#b_courses {margin-top:170px}
	#d_learning {margin-top:170px}
	#contacts {margin-top:170px}
	

	#AdultCour li {font-size:28px;}

	#menu ul li a {font-size:18px;}
	#up_nav {width:22%}
	
	#footr_right span img {width:90%}
	
	
}
@media only screen and (max-width:1024px)
{
	#about_us {margin-top:180px;}
	#works_grafic {margin-top:180px}
	#works_sites {margin-top:180px}
	#child_courses {margin-top:180px;}
	#adult_courses {margin-top:180px}
	#b_courses {margin-top:180px}
	#d_learning {margin-top:180px}
	#contacts {margin-top:180px}
	
	h2{font-size:30px;}
	h3{font-size:30px;}
	h3 span {font-size:22px}
	h2 span {font-size:22px}
	#ChildCour h4 {font-size:22px}
	#block1 .Children_orange {font-size:26px;}
	#block1 .Children_orange span {font-size:26px;}
	#block1 .Children_black,#accordion > h4 	{font-size:26px;}
	
	
	#block1 {width:90%;margin-left:5%;margin-top:170px;}
	#block2 {clear:left;width:90%;margin-left:5%;border-left:0px solid;margin-top:0px;}
	#block2 img {width:60%;}
	

	#AdultCour li {font-size:24px;}
	#about_us p,#child_courses p,#adult_courses p,#b_courses p,#d_learning p,#contacts p {font-size:26px}
	#AdultCour ul,#adult_courses ul,#b_courses ul {font-size:24px;}	
	#ChildCour #TypesCour {width: 45.4%;}
	
	

	#ChildCour #TypesCour:nth-child(5) {clear:none}
	#ChildCour #TypesCour:nth-child(4) {clear:left}
	#ChildCour #TypesCour:nth-child(6) {clear:left}
	#logo {margin-top:100px;}
	#Title {margin-top:100px;}
	
	#phone {height:50px}
	#phone p a {font-size:18px;}
	#menu li ul li {font-size:14px;line-height:16px;}
	#menu ul li a {font-size:16px;}
	/*#menu img {margin-left:-50px;width:50px;}*/
	/*#menu img {width:60px;margin-left:-60px;}*/
	
	#Sites a,#Grafic a {font-size:24px;}
	
	.tabs__text {font: 20px Arial;}
		
}
@media only screen and (max-width:832px)
{
	#block1 {margin-top:125px}
	#about_us {margin-top:125px;}
	#works_grafic {margin-top:125px}
	#works_sites {margin-top:125px}
	#child_courses {margin-top:125px;}
	#adult_courses {margin-top:125px}
	#b_courses {margin-top:125px}
	#d_learning {margin-top:125px}
	#contacts {margin-top:125px}
	
	h2{font-size:28px;}
	h3{font-size:28px;}
	h3 span {font-size:20px}
	h2 span {font-size:20px}
	#ChildCour h4 {font-size:20px}
	
	#AdultCour li {font-size:24px;}
	#about_us p,#child_courses p,#adult_courses p,#b_courses p,#d_learning p,#contacts p {font-size:20px}	
	
	
	#phone {height:50px}
	#phone p a {font-size:18px;font-family: 'Veradana';font-weight:800}
	#phone img {height:65%;margin-top:5px}
	#up_nav {width:25%}
	#menu ul li a {font-size:14px;font-weight:300;padding:10px}
	/*#menu img {margin-left:-50px;width:50px;}*/
	#footr_right span img {width:100%}

	#footr p {font-size:16px;}


	#footr_right img {width:#16px}
}

@media only screen and (max-width:768px)
{
	h2{font-size:26px;}
	h3{font-size:26px;}
	h3 span {font-size:18px}
	h2 span {font-size:18px}
	#photo img:nth-child(1) {top:45%;}
	#photo img:nth-child(2) {top:110%;}
	
	#block1 .Children_orange {font-size:22px;}
	#block1 .Children_orange span {font-size:24px;}
	#block1 .Children_black	{font-size:22px;}
	#accordion > h4 {font-size:22px;}
	#AdultCour li {font-size:22px;font-family:arial}
	#about_us p,#child_courses p,#adult_courses p,#b_courses p,#d_learning p,#contacts p {font-size:22px}
	#AdultCour ul,#adult_courses ul,#b_courses ul {font-size:22px;font-family:arial}	
	#block2 img {width:65%;}
	
	#block1 {margin-top:150px}
	#about_us {margin-top:150px;}
	#works_grafic {margin-top:150px}
	#works_sites {margin-top:150px}
	#child_courses {margin-top:150px;}
	#adult_courses {margin-top:150px}
	#b_courses {margin-top:150px}
	#d_learning {margin-top:150px}
	#contacts {margin-top:150px}
	
	#ChildCour #TypesCour {clear:left;width:90%;margin-left:5%}
	#ChildCour #TypesCour img {width:20%;}

	#phone {height:45px}
	#menu ul li a {font-size:16px;padding:8px}
	/*#menu img {margin-left:-50px;width:50px;}*/
	#up_nav {width:30%}
	#logo {margin-top:60px;}
	#Title {margin-top:60px;}	
	#Sites a,#Grafic a {font-size:24px;}
	
}

@media only screen and (max-width:600px)
{
	#block1 {margin-top:110px;}
	#about_us {margin-top:110px;}
	#works_grafic {margin-top:110px}
	#works_sites {margin-top:110px}
	#child_courses {margin-top:110px;}
	#adult_courses {margin-top:110px}
	#b_courses {margin-top:110px}
	#d_learning {margin-top:110px}
	#contacts {margin-top:110px}
	
	#Sites img,#Grafic img {width:80%;clear:left;margin-left:10%;}
	


	
	#footr_left {width:90%;float:left;margin-left:5%;margin-bottom:-150px}
	
	#photo img:nth-child(1) {top:35%;width:40%;left:20%}
	#photo img:nth-child(2) {top:35%;width:40%;left:80%}
	#img2:focus {position:absolute;z-index:1000;width:100%;pointer-events:none;top:70%;left:50%;}
	
	#footr_right {width:90%;float:left;clear:left;margin-left:5%;}

	#footr_right span img {width:100%}

	#phone p a {font-size:16px;}
	#phone {height:45px}
	/*#menu img {margin-left:-40px;width:40px;}*/	
	#menu ul li a {font-family: 'Arial';font-size:12px}
	
	#footr .footr_text div {width:100%;}
}
@media only screen and (max-width:500px)
{	
	
	
	
	#block1 {margin-top:80px;}
	#about_us {margin-top:80px;}
	#works_grafic {margin-top:80px}
	#works_sites {margin-top:80px}
	#child_courses {margin-top:80px;}
	#adult_courses {margin-top:80px}
	#b_courses {margin-top:80px}
	#d_learning {margin-top:80px}
	#contacts {margin-top:80px}
	#menu img {margin-left:-35px;width:35px;}
	#up_nav {width:38%}
	
	
	#AdultCour ul,#adult_courses ul,#b_courses ul {margin-left:15px;}
	#ChildCour #TypesCour img {width:25%;}
	
}	
@media only screen and (max-width:425px)
{	

	#block1 {margin-top:60px}
	#about_us {margin-top:60px;}
	#works_grafic {margin-top:60px}
	#works_sites {margin-top:60px}
	#child_courses {margin-top:60px;}
	#adult_courses {margin-top:60px}
	#b_courses {margin-top:60px}
	#d_learning {margin-top:60px}
	#contacts {margin-top:60px}
	
	#Sites img,#Grafic img {width:80%;clear:left;margin-left:10%;}
	#Sites a,#Grafic a {font-size:22px;}
	
	h2{font-size:20px;}
	h3{font-size:20px;}
	h3 span {font-size:16px;}
	h2 span {font-size:16px}
	#ChildCour h4 {font-size:18px}
	#ChildCour h3 span {font-size:12px; font-family:#"verdana"}
	#block1 .Children_orange {font-size:18px;}
	#block1 .Children_orange span {font-size:20px;}
	#block1 .Children_black	{font-size:18px;}
	#accordion > h4 {font-size:19px;}
	#AdultCour li {font-size:19px;}
	#about_us p,#child_courses p,#adult_courses p,#b_courses p,#d_learning p,#contacts p {font-size:18px}
	#AdultCour ul,#adult_courses ul,#b_courses ul {font-size:20px;}	
	
	
	
	#block2 img {width:100%;}
	#up_nav {width:38%}
	
	#phone img {height:60%}
	#phone {height:40px}
	#menu img {margin-left:-35px;width:35px;}	
	
	#footr h3 {font-size:18px;}
	#footr p {font-size:14px}
	#footr_left {margin-bottom:-100px}
	.tabs__text {font: 14px Arial;}
	#footr .footr_text p {font-size:11px}
}

@media only screen and (max-width:375px)
{	
	#block1 {margin-top:60px}
	#about_us {margin-top:60px;}
	#works_grafic {margin-top:60px}
	#works_sites {margin-top:60px}
	#child_courses {margin-top:60px;}
	#adult_courses {margin-top:60px}
	#b_courses {margin-top:60px}
	#d_learning {margin-top:60px}
	
	h2{font-size:18px;}
	h3{font-size:18px;}

	
	
	#block1 .Children_orange {font-size:16px;}
	#block1 .Children_orange span {font-size:18px;}
	#block1 .Children_black	{font-size:16px;}
	#accordion > h4 {font-size:16px;}
	#AdultCour li {font-size:18px;}
	#about_us p,#child_courses p,#adult_courses p,#b_courses p,#d_learning p,#contacts p {font-size:18px}
	#AdultCour ul,#adult_courses ul,#b_courses ul {font-size:18px;}	
	#Sites a,#Grafic a {font-size:20px;}
	

	#up_nav {width:44%}
	#phone img {height:60%}
	#phone {height:40px}
	

	#footr_left {margin-bottom:-80px}
}

@media only screen and (max-width:360px)
{

}

@media only screen and (max-width:320px)
{	

	#logo {width:45%;margin-left:5%}
	#logo img {margin-left:2px}
	#Title {width:40%;margin-left:0}
	#Title img {margin-right:10%}

	#block1 {margin-top:30px}
	#about_us {margin-top:30px;}
	#works_grafic {margin-top:30px}
	#works_sites {margin-top:30px}
	#child_courses {margin-top:30px;}
	#adult_courses {margin-top:30px}
	#b_courses {margin-top:30px}
	#d_learning {margin-top:30px}
	#AdultCour li {font-size:16px;}
	
	#ChildCour #TypesCour img {width:30%;}
	
	#menu img {margin-left:-30px;width:30px;}
	#up_nav {width:48%}
	#phone img {height:60%}
	#phone {height:40px}
	#footr h3 {word-spacing:15px;font-size:16px;}
	
	
	#footr_left {margin-bottom:-60px}
}

/*---------------------------------------------------------------Стили графика--------------------------------------------------------------*/
.main_div{
	background: rgba(255, 255, 255, 0.5);
	width: 1024px;
	border-radius: 45px;
	margin: 30px auto;
	font: black;
padding-bottom: 35px;}
.content_c{
	width: 777px;
	background: rgba(255, 255, 255, 0.5);
	border-radius: 45px;
	float: right;
	margin-top: 16px;
	margin-right: 21px;
	outline: none;
	margin-bottom: 40px;
min-height: 700px;}
#back-top {
	position: fixed;
	bottom: 10px;
	/*margin-left: 150px;*/
	right: 6px;
}
#back-top a {
	width: 108px;
	display: block;
	text-align: center;
	font: 11px/100% Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	color: #bbb;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	color: #000;
}
/* arrow icon (span tag) */
#back-top span {
	width: 108px;
	height: 108px;
	display: block;
	margin-bottom: 7px;
	background: #ddd url(images2/up-arrow.png) no-repeat center center;
	/* rounded corners */
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover span {
background-color: #777;}
*, *::after, *::before {
  box-sizing: border-box;
}
}
.table{

	background: rgba(255, 255, 255, 0.5);
/*width: 480px;*/}
.documents img{
	width: 500px;
	margin:25px 100px;
}
.pod_menu {
	position: absolute; /* Подменю позиционируются абсолютно */
	border-top: none;
	background: #7fb5cc;
	display: none;
	margin-left: 183px; /* Сдвигаем подменю вправо */
	margin-top: -3em; /* Сдвигаем подменю вверх */
	border: 2px solid #ccc;
}
li:hover>.pod_menu { 
    display: block; /* При выделении пункта курсором мыши отображается подменю */
   }
   .pod_menu li:last-child{
	border-top: 3px so lid #37b1e3;
}
.pod_menu a{
	font-family: Arial, sans-serif;
	font-size: 15pt;
    font-weight: bold;
    display: block;
    padding:6px 7px;
    padding-right: 10px;
    text-decoration: none;
    color: #006d9a;
    line-height:22px;

}
.pod_menu>li>a:hover {
    color: #ffe; 
    background:#817547;

}
.sidebar{
	width: 188px;
	background: rgba(255, 255, 255, 0.5);
	border-radius: 23px;
	margin-left: 15px;
	margin-top: 18px;
	padding-top: 8px;
	padding-bottom: 8px;
	float: left;
}
.sidebar ul{
	padding: 0;
	list-style: none;
}
.sidebar>ul>li{
	border-top: 3px solid #37b1e3;
}
.sidebar>ul>li:last-child{
	border-bottom: 3px solid #37b1e3;
}
.sidebar>ul>li>a{
	font-family: Arial, sans-serif;
	font-size: 15pt;
    font-weight: bold;
    display: block;
    padding:6px 7px;
    padding-right: 10px;
    text-decoration: none;
    color: #006d9a;
    line-height:22px;
}
.sidebar>ul>li>a:hover {
    color: #ffe; 
background:url(images/orange.png) ;}

.clr{	
clear: both;}


/* -------------------------------- 

Primary style

-------------------------------- */
*, *::after, *::before {
  box-sizing: border-box;
}

.cd-accordion-menu {
margin: 0;
list-style: none;
padding: 0;
font-style: normal;
}
.cd-accordion-menu ul {
  /* by default hide all sub menus */
  display: none;
	padding:0;
  list-style: none;
}
.cd-accordion-menu li {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.cd-accordion-menu input[type=checkbox] {
  /* hide native checkbox */
  position: absolute;
  opacity: 0;
}
.cd-accordion-menu label, .cd-accordion-menu a {
  padding-left: 53px;
  position: relative;
  display: block;
  color: #006d9a;
  line-height: 1.5;
  font-weight: bold;
}
.no-touch .cd-accordion-menu label:hover, .no-touch .cd-accordion-menu a:hover {
  color: #ffe;
   background: url(images/orange.png);
}
.cd-accordion-menu label::before, .cd-accordion-menu label::after, .cd-accordion-menu a::after {
  /* icons */
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.cd-accordion-menu label {
  cursor: pointer;
}
.cd-accordion-menu label::before, .cd-accordion-menu label::after {
  background-image: url(images/cd-icons.svg);
  background-repeat: no-repeat;
}
.cd-accordion-menu label::before {
  /* arrow icon */
  left: 18px;
  background-position: 0 0;
  -webkit-transform: translateY(-50%) rotate(-90deg);
  -moz-transform: translateY(-50%) rotate(-90deg);
  -ms-transform: translateY(-50%) rotate(-90deg);
  -o-transform: translateY(-50%) rotate(-90deg);
  transform: translateY(-50%) rotate(-90deg);
}
.cd-accordion-menu label::after {
  /* folder icons */
  left: 31px;
  background-position: -16px 0;
}
.cd-accordion-menu a::after {
  /* image icon */
  left: 36px;
  /*background: url(images/cd-icons.svg) no-repeat -48px 0;*/
}
.cd-accordion-menu input[type=checkbox]:checked + label::before {
  /* rotate arrow */
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.cd-accordion-menu input[type=checkbox]:checked + label::after {
  /* show open folder icon if item is checked */
  background-position: -32px 0;
}
.cd-accordion-menu input[type=checkbox]:checked + label + ul,
.cd-accordion-menu input[type=checkbox]:checked + label:nth-of-type(n) + ul {
  /* use label:nth-of-type(n) to fix a bug on safari (<= 8.0.8) with multiple adjacent-sibling selectors*/
  /* show children when item is checked */
  display: block;
}
.cd-accordion-menu ul label,
.cd-accordion-menu ul a {

 
  /*padding-left: 82px;*/
}
.no-touch .cd-accordion-menu ul label:hover, .no-touch
.cd-accordion-menu ul a:hover {
	
   color: #ffe;
   background: url(images/orange.png);
}
.cd-accordion-menu > li:last-of-type > label,
.cd-accordion-menu > li:last-of-type > a,
.cd-accordion-menu > li > ul > li:last-of-type label,
.cd-accordion-menu > li > ul > li:last-of-type a {
  box-shadow: none;
}
.cd-accordion-menu ul label::before {
  left: 36px;
}
.cd-accordion-menu ul label::after,
.cd-accordion-menu ul a::after {
  left: 59px;
}
.cd-accordion-menu ul ul label,
.cd-accordion-menu ul ul a {
  padding-left: 100px;
}
.cd-accordion-menu ul ul label::before {
  left: 54px;
}
.cd-accordion-menu ul ul label::after,
.cd-accordion-menu ul ul a::after {
  left: 77px;
}
.cd-accordion-menu ul ul ul label,
.cd-accordion-menu ul ul ul a {
  padding-left: 118px;
}
.cd-accordion-menu ul ul ul label::before {
  left: 72px;
}
.cd-accordion-menu ul ul ul label::after,
.cd-accordion-menu ul ul ul a::after {
  left: 95px;
}
@media only screen and (min-width: 600px) {
  .cd-accordion-menu label, .cd-accordion-menu a {
	padding: 5px 0px 5px 80px;
   font-size: 15pt;
  }
  .cd-accordion-menu label::before {
    left: 24px;
  }
  .cd-accordion-menu label::after {
   /* left: 53px;*/
  }
  .cd-accordion-menu ul label,
  .cd-accordion-menu ul a {
    /*padding-left: 106px;*/
		padding-left: 40px;
  }
  .cd-accordion-menu ul label::before {
    left: 48px;
  }
  .cd-accordion-menu ul label::after,
  .cd-accordion-menu ul a::after {
    left: 77px;
  }
  .cd-accordion-menu ul ul label,
  .cd-accordion-menu ul ul a {
    padding-left: 130px;
  }
  .cd-accordion-menu ul ul label::before {
    left: 72px;
  }
  .cd-accordion-menu ul ul label::after,
  .cd-accordion-menu ul ul a::after {
    left: 101px;
  }
  .cd-accordion-menu ul ul ul label,
  .cd-accordion-menu ul ul ul a {
    padding-left: 154px;
  }
  .cd-accordion-menu ul ul ul label::before {
    left: 96px;
  }
  .cd-accordion-menu ul ul ul label::after,
  .cd-accordion-menu ul ul ul a::after {
    left: 125px;
  }
}
.cd-accordion-menu.animated label::before {
  /* this class is used if you're using jquery to animate the accordion */
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;

}
.table{

	background: rgba(255, 255, 255, 0.5);
	/*width: 480px;*/
	width: 100%; /*623px;*/
	max-width: 90%;

	margin: 70px auto;
	padding:20px 0; 
}

.table a{
	padding: 4px 20px; 
	font-style: normal;
	color: #006d9a;
	font-weight: bold;
    display: block;
	text-decoration: none;
}
.table a:hover{
	background:url(images/orange.png) ;
	color: #ffe; 
}
.text{
	margin:0 37px;
	font-family: arial,tahoma;
	text-align: justify;
	font-size: 14.0pt;
	line-height: 1.5;
	font-style: italic;
}

	.my-flex-cont {
 display: -ms-flexbox;
 display: -webkit-flex;
 display: flex;
 -ms-flex-flow: row wrap;
 -webkit-flex-flow: row wrap;
 flex-flow: row wrap;
 -ms-flex-pack: center;
 -webkit-justify-content: center;
 justify-content: center;
 -ms-flex-line-pack: start;
 -webkit-align-content: flex-start;
 align-content: flex-start;
 width: 100%;
}
.my-flex-box {
 margin: 10px;
 padding: 10px;
 -ms-flex: 0 1 158px;
 -webkit-flex: 0 1 158px;
 flex: 0 1 158px;
 -ms-flex-item-align: center;
 -webkit-align-self: center;
 align-self: center;
 -ms-flex-order: 5;
 -webkit-order: 5;
 order: 5;
}