:root {

  /**
   * colors
   */

  /* gradient */

  --bg-gradient-onyx: linear-gradient(
    to bottom right, 
    hsl(240, 1%, 25%) 3%, 
    hsl(0, 0%, 19%) 97%
  );
  --bg-gradient-jet: linear-gradient(
    to bottom right, 
    hsla(240, 1%, 18%, 0.251) 0%, 
    hsla(240, 2%, 11%, 0) 100%
  ), hsl(240, 2%, 13%);
  --bg-gradient-yellow-1: linear-gradient(
    to bottom right, 
    hsl(45, 100%, 71%) 0%, 
    hsla(36, 100%, 69%, 0) 50%
  );
  --bg-gradient-yellow-2: linear-gradient(
    135deg, 
    hsla(45, 100%, 71%, 0.251) 0%, 
    hsla(35, 100%, 68%, 0) 59.86%
  ), hsl(240, 2%, 13%);
  --border-gradient-onyx: linear-gradient(
    to bottom right, 
    hsl(0, 0%, 25%) 0%, 
    hsla(0, 0%, 25%, 0) 50%
  );
  --text-gradient-yellow: linear-gradient(
    to right, 
    hsl(45, 100%, 72%), 
    hsl(35, 100%, 68%)
  );

  /* solid */

  --jet: hsl(0, 0%, 22%);
  --onyx: hsl(240, 1%, 17%);
  --eerie-black-1: hsl(240, 2%, 13%);
  --eerie-black-2: hsl(240, 2%, 12%);
  --smoky-black: hsl(0, 0%, 7%);
  --white-1: hsl(0, 0%, 100%);
  --white-2: hsl(0, 0%, 98%);
  --orange-yellow-crayola: hsl(45, 100%, 72%);
  --vegas-gold: hsl(45, 54%, 58%);
  --light-gray: hsl(0, 0%, 84%);
  --light-gray-70: hsla(0, 0%, 84%, 0.7);
  --bittersweet-shimmer: hsl(0, 43%, 51%);

  /**
   * typography
   */

  /* font-family */
  --ff-poppins: 'Poppins', sans-serif;

  /* font-size */
  --fs-1: 24px;
  --fs-2: 18px;
  --fs-3: 17px;
  --fs-4: 16px;
  --fs-5: 15px;
  --fs-6: 14px;
  --fs-7: 13px;
  --fs-8: 11px;

  /* font-weight */
  --fw-300: 300;
  --fw-400: 400;
  --fw-500: 500;
  --fw-600: 600;

  /**
   * shadow
   */
  
  --shadow-1: -4px 8px 24px hsla(0, 0%, 0%, 0.25);
  --shadow-2: 0 16px 30px hsla(0, 0%, 0%, 0.25);
  --shadow-3: 0 16px 40px hsla(0, 0%, 0%, 0.25);
  --shadow-4: 0 25px 50px hsla(0, 0%, 0%, 0.15);
  --shadow-5: 0 24px 80px hsla(0, 0%, 0%, 0.25);

  /**
   * transition
   */

  --transition-1: 0.25s ease;
  --transition-2: 0.5s ease-in-out;

}

*{
	margin: 0;
	padding: 0;
	/* background-image: url('/images/background.png') no-repeat center center;
	background-size: cover; */
	/* z-index: 1; */
}
body.home-page #main {
  display: none;
}

html{
	scroll-behavior: smooth;
}

body{
	scrollbar-width: none; /* Для Firefox */
    -ms-overflow-style: none; /* Для Internet Explorer/Edge */
}

body.internal-page footer#footer,
body.internal-page header#header,
body.internal-page #scrollToTopButton, 
body.home-page #scrollToTopButtonAll {
  display: none;
}




::-webkit-scrollbar {
    width: 11px;
    height: 100%;
}

::-webkit-scrollbar-track {
    background: transparent; /* Цвет фона дорожки */
}

::-webkit-scrollbar-thumb {
    background-color: #F26419; /* Цвет ползунка */
    border-radius: 7px;  /*Скругление углов ползунка */
    /* border: 3px solid transparent; */
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #3076FD; /* Цвет ползунка при наведении */
}

/* Применяем вертикальное расположение скроллбара справа */

.block2 {
  margin-top: -160px;
}

a{
  text-decoration: none;
	/* cursor: pointer; */
}

.background-container{
	background-image: url('../images/background.jpg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 1hr;
}

.container{
    max-width: 1400px;
  	margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}

.container-fluid{
	/* min-width: 1900px; */
	min-width: 100%;
	margin: 0 auto;
}

#scrollToTopButton, 
#scrollToTopButtonAll {
	position: fixed;
	bottom: 30px;
	left: 50px;
	/* display: none; */
	opacity: 0;
    transition: opacity 1.5s;
	cursor: pointer;
    width:70px;
    height:70px;
}

#scrollToTopButton.top-small,
#scrollToTopButtonAll.top-small {
    /* display: block; */
    opacity: 1;
}

.alert-info {
    display: none;
}

/* -------------------Header---------------------------- */

#header, #header-all {
	transition: border 0.5s ease;
  }

  .header__header {
	font-family: 'Comfortaa', sans-serif;
	font-size: 16px;
	font-weight: 400;
	height: 20px;
	/* padding-top: 50px;	 */
	position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
}

  #header.small, #header-all.small {
    height: 20px;
    /* background-color: #333; */
	background-color: #f8f9fb;
	/* background-color: transparent; */
	/* opacity: 0.85; */
	/* background-color: #44B0FF; */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
    color: #000000;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 20px 0;
	
   
	/* padding-bottom: 25px; */
	/* border: 0px solid #44B0FF;
    border-width: 0 0 1px 0; */
}

#header.small::after,
#header-all.small::after{
	content: '';
    position: absolute;
    top: 60px;
    right: 50%;
    width: 100%;
    height: 1.5px;
    background: #5C95FF;
	animation-duration: 2.4s;
	animation-name: slidein-1;
}

#header.small::before,
#header-all.small::before{
	content: '';
    position: absolute;
    top: 60px;
    left: 50%;
    width: 100%;
    height: 1.5px;
    background: #5C95FF;
	animation-duration: 2.4s;
	animation-name: slidein-1;
}


#header .logotype,
#header-all .logotype,
#header.small .logotype,
#header-all.small .logotype{
	width: 50px;
	margin-bottom: -6px;
}

#header.small .nav_registration{
	
}

/* .header__header {

	font-family: 'Comfortaa', sans-serif;
	font-size: 16px;
	font-weight: 400;
	height: 80px;
	padding-top: 50px;	
} */

.header__header .container{
	display: flex;
	justify-content: space-between;
	align-items: center;
    width: 1400px;
}

#header.header__header .container,
#header-all.header__header .container {
  height: 65px;
}  

/* .header_nav {
	margin-right: -245px;
} */

.header_nav-ul {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
    gap: 72px;
	align-items: center;
	list-style-type: none;
}

/* .header_nav-ul li{
	margin-right: 72px;
} */

.header_nav-ul >li>a{
	text-decoration: none;
}

.cursor a, .cursor{
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: center;
	margin-bottom: 0 !important;
}

.courses-cursor {
    margin-left: 4px;
	vertical-align: middle;
	background-image: url('../images/courses-cursor.svg');
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
}

.ourcourses_cursor{
	width: 18px;
	position: relative;
	margin-left: 8px;
	transition: 0.5s ease;
	cursor: pointer;
}

.ourcourses_cursor_lg{
	width: 18px;
	position: relative;
	margin-left: 8px;
	transition: 0.5s ease;
	/* cursor: pointer; */
}

.ourcourses_cursor_lg {
    display: flex;
}

.ourcourses_cursor_lg.active .ourcourses-cursor-lg-1 {
    background-color: #111AFA;
    transform: rotate(-40deg);
}

.ourcourses_cursor_lg.active .ourcourses-cursor-lg-2 {
    background-color: #111AFA;
}

.ourcourses-cursor-1, .ourcourses-cursor-2{
	width: 11px;
	height: 2px;
	background-color: #000000;
	transition: 0.5s ease;
} 

.ourcourses-cursor-lg-1, .ourcourses-cursor-lg-2{
	width: 11px;
	height: 2px;
	background-color: #000000;
	transition: 0.5s ease;
} 

.ourcourses-cursor-1, .ourcourses-cursor-lg-1 {
    transform: rotate(40deg);
    position: absolute;
    left: 0;
}

.ourcourses-cursor-2, .ourcourses-cursor-lg-2 {
    transform: rotate(-40deg);
    position: absolute;
    right: 0px;
}

.ourcourses_cursor_lg .ourcourses-cursor-lg-1,
.ourcourses_cursor_lg .ourcourses-cursor-lg-2 {
    transition: background-color 0.5s, transform 0.5s;
}
 




/* Активные стили */
.ourcourses_cursor_lg .ourcourses-cursor-lg-1.active {
    background-color: #111AFA;
    transform: rotate(-40deg);
}

.ourcourses_cursor_lg .ourcourses-cursor-lg-2.active {
    background-color: #111AFA;
    transform: rotate(40deg);
}

/* .triangle {
    position: absolute;
    left: 16px;
    top: -20px;
}

.submenu {
    display: none; 
	position: absolute;
	left: -24px;
    top: 26px;
    width: 574px;
    height: 0;
    background-color: #44B0FF;
    z-index: 99;
	border-radius:  30px;
	
	transition: height 3.5s;
}

.cursor:hover .submenu.show{
	height: 308px;
}

.submenu.show {
    display: block;
}

.submenu-courses {
    display: grid;
	grid-template-columns: 1fr 1fr;
    
	align-items: center;

}

.submenu-courses .courses-link {
   
    padding: 15px 0;
    border: 1px solid #FFFFFF;
    border-width: 0 0 2px 0;
	width: 80%;
	margin: 0 auto;
	color: #FAFAFA;
} */

.triangle {
    position: absolute;
    left: 66px;
    top: 7px;
}

.triangle-2 {
    position: absolute;
    left: 19px;
    top: -25px;
}
.submenu {
    display: none;
    position: absolute;
    left: -74px;
    top: 10px;
    width: 600px;
    height: 0;
    z-index: 99;
    padding-top: 32px;
    padding-left: 38px;
    transition: height 3.5s;
}

.cursor:hover .submenu.show{
	height: 258px;
}

.submenu.show {
    display: block;
}

.submenu-courses {
	background-color: #5C95FF;
	border-radius:  30px;
	z-index: 99;
	position: relative;
    display: grid;
	grid-template-columns: 1fr 1fr;
    
	align-items: center;
	padding-top: 10px;
}

.submenu-courses .courses-link {   
	position: relative;
    padding: 15px 0;
    /* border: 1px solid #FFFFFF; */
    /* border-width: 0 0 1px 0; */
	width: 80%;
	margin: 0 auto;
	color: #FAFAFA;
}

.courses-link:last-child {
    margin-top: 30px;
    /* border: 1px solid #FFFFFF;
    border-width: 1px 0 0 0; */
    margin-left: 50%;
    text-align: center;
    position: relative;
    padding-bottom: 35px;
    width: 100%;
}

.courses-link a{
	text-decoration: none;
	color: #FAFAFA;
}

.courses-link:last-child a {
    position: absolute;
    left: 50%;
    transform: translate(-60%, -50%);
    margin: 10px;
}

.line-1, .line-2, .line-3, .line-4{
	position: absolute;
	left: 50%;
    height: 40px;
    width: 1px;
    background-color: #ffffff;
	transition: transform 3s;
	animation-duration: 1.5s;

}

.line-1 {
    transform: translate(-50%, -280%);
	animation-name: slideInOut-3;
}

.line-2 {
    transform: translate(-50%, -150%);
	animation-name: slideInOut-4;
}

.line-3 {
    transform: translate(-50%, -31%); 	
	animation-name: slideInOut-5;
}

.line-4 {
    transform: translate(-50%, 92%);
	animation-name: slideInOut-6;
}

.courses-link.after::after {
	content: '';
	position: absolute;
    left: -1px;
    bottom: 0px;
    width: 100%;
    height: 1px;
	background-color: #FFFFFF;
	animation-duration: 1.5s;
	animation-name: slidein-1;
}

.courses-link.before::before {
	content: '';
	position: absolute;
    right: 1px;
    bottom: 0px;
    width: 100%;
    height: 1px;
	background-color: #FFFFFF;
	animation-duration: 1.5s;
	animation-name: slidein-1;
}

.courses-link:last-child::after, .courses-link:last-child::before{
	content: '';
	position: absolute;
    top: 0px;
    width: 50%;
    height: 1px;
	background-color: #FFFFFF;
	animation-duration: 1.5s;
	animation-name: slidein-2;
}

.courses-link:last-child::after{
	left: 50%;
}

.courses-link:last-child::before{
	right: 50%;
}

.header_nav-ul li:hover .courses-link a{
	color: #ffffff;
}

.header_nav-ul li a::after .ourcourses_cursor .submenu.show .submenu-courses .courses-link a,
.header_nav-ul li .ourcourses_cursor .submenu.show .submenu-courses .courses-link a.active {
	color: #ffffff;
	background: none !important;
} 

.header_nav-ul li a::after .courses-link a.active {
	color: #ffffff;
	background: none !important;
}

.header_nav-ul li a.active::after .courses-link a,
.header_nav-ul li a:active::after .courses-link a{
    opacity: 0;
}

/* .header_nav-ul li a.::after {
    content: '';
    position: absolute;
    bottom: -5px; 
    left: 50%;
	bottom: -18px;
    width: 12px; 
    height: 12px; 
    border-radius: 50%;
    background: url(/images/header-circle.svg) no-repeat;
	background-size: cover;
    opacity: 0;
    transition: opacity 0.3s ease;	
    transform: translateX(-50%);
} */

.submenu.show >li>div> a{
	list-style: none;
	text-decoration: none;	
}

.nav_registration{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	flex-wrap: nowrap;
    gap: 40px;
}

.nav-language{
	margin-right: 40px;
}

.nav-log-in{
	margin-right: 40px;
}

/* .banner__section.small{
	padding-top: 240px;
}
 */

.banner__section{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding-top: 240px;
}

.banner_img{
	position: relative;
	width: 50%;
	margin-right: -15px;
}

.banner_img-img{
	margin-top: -100px;
	width: 100%;
}

.square-1 {
    position: absolute;
    top: -55px;
    left: 50px;
    width: 80px;
    height: 80px;
    animation: rotate 20s linear infinite;
}

.square-2 {
    position: absolute;
    top: 57px;
    left: 61px;
    width: 50px;
    height: 50px;
    animation: rotate 10s linear infinite;
}

.square-3 {
    position: absolute;
    top: 14px;
    left: 98px;
    width: 62px;
    height: 62px;
    animation: rotate-2 15s linear infinite;
}

.square-1 img, .square-2 img, .square-3 img{
	width: 100%;
}

@keyframes changeColor {
	0% {
	  background-color: blue;
	}
	50% {
	  background-color: red;
	}
	100% {
	  background-color: blue;
	}
  }
  
.on-off {
    position: absolute;
    bottom: 175.5px;
    right: 56px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    animation: changeColor 3s linear infinite; 
}

@keyframes moveAndPause {
	0% {
		right: 203px;
	}
	50% {
	  	right: 284px; 
	}
	100% {
		right: 203px; /* Возвращается в начальное положение */
	}
  }
  
  @keyframes moveAndPause-2 {
	0% {
		right: 115px;
	}
	50% {
	  	right: 35px; 
	}
	100% {
		right: 115px; /* Возвращается в начальное положение */
	}
  }

  .left-right {
    width: 50px;
    height: 46px;
    background-color: #e4650acf;
    position: absolute;
    top: 2px;
    right: 203px;
    animation: moveAndPause 5s linear infinite;
	/* animation-timing-function: ease-in-out; 
    animation-delay: 5s; */
}

.left-right-2 {
    width: 55px;
    height: 50px;
    background-color: #dff0ff;
    position: absolute;
    top: 106px;
    right: 35px;
    animation: moveAndPause-2 5s linear infinite;
		/* animation-timing-function: ease-in-out; 
    animation-delay: 5s; */
}

.banner_text{
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	width: 50%;
}

.banner_text_title{
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 66px;
}

p.banner_text_subtitle{
  font-family: 'Comfortaa', sans-serif;
  font-size: 14px;
}

p.banner_text_subtitle-2{
    display: none;
}

.text-1 {
	color: #E4650A;
	margin: 17px auto;
}

.banner-inform{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;	
    visibility: hidden;
}

.banner_inform_1, .banner_inform_2{
	width: 180px;	
	margin-right: 112px;
	position: relative;
}


.banner-inform-title, .banner-inform span{
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 80px;
	margin-bottom: 25px;
}
.banner-inform span{
    position: absolute;
    top: 0;
    left: 140px;
}


.inform-1{	
	font-family: 'Comfortaa', sans-serif;
	font-weight: 400;
	font-size: 24px;
}

.nav-button, .buy-button, .info-button, .info-button-1, .door-button, #flipButton, .flipButton-1, .program-course-button{
	font-family: 'Comfortaa', sans-serif;
	font-weight: 400;
	font-size: 16px;
	letter-spacing: 1px;
	height: 50px;
	border-radius: 50px;
	border: 0.5px solid #3498db;
	background: linear-gradient(to right, #44B0FF, #3A93FE, #3076FD, #275DFC);
	/* background: linear-gradient(to right, #44B0FF, #0d93ec, #111AFA); */
	/* background: radial-gradient(ellipse at top, #44B0FF, #111AFA); */
	color: #ffffff;
	/* box-shadow: 3px 2px 4px rgba(0, 0, 0, 0.1); */
	cursor: pointer;
	position: relative;
    /* overflow: hidden; */
}

/* .buy-button::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background: ;
	z-index: 50;
	transition: all 0.3s ease; 
  }
  
  .buy-button:hover::before {
	width: 100%;
	

  } */

  /* .buy-button:hover{
	transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  } */

  /* .buy-button:link,
  .buy-button:visited {
	  text-transform: uppercase;
	  text-decoration: none;
	  padding: 15px 40px;
	  display: inline-block;
	  border-radius: 100px;
	  transition: all .2s;
	  position: absolute;
  } */
  
.nav-button:hover, .buy-button:hover, .info-button:hover,
.info-button-1:hover, .footer-button:hover, .program-course-button:hover
{
	transform: translateY(-3px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
 
#header.small .nav-button:hover,
#header-all.small .nav-button:hover {
	transform: none;
	box-shadow: none;
}

.nav-button:active, .buy-button:active,
.info-button:active, .info-button-1:active,
.footer-button:active, .program-course-button:active
{
	transform: translateY(-1px);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
  
.nav-button::after, .buy-button::after,
.info-button::after, .info-button-1::after,
.footer-button::after, .program-course-button::after
{
	content: "";
	display: inline-block;
	height: 100%;
	width: 100%;
	border-radius: 50px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	transition: all 1s;
	background: linear-gradient(to right, #44B0FF, #3A93FE, #3076FD, #275DFC);
  }

.buy-button{
	animation: pulse 2s infinite;
}
  

.footer-button::after{
	background: linear-gradient(to right, #F4934E, #EC7C2C,#E4650A);
 } 

.nav-button:hover::after, .buy-button:hover::after,
.info-button:hover::after, .info-button-1:hover::after,
.footer-button:hover::after, .program-course-button::after
{
	transform: scaleX(1.4) scaleY(1.6);
	opacity: 0;
  }
  
  .btn-animated {
	  animation: moveInBottom 0.9s ease-out;
	  animation-fill-mode: backwards;
  }
  
 

  @keyframes pulse {
	0% { opacity: 1; }
	50% { opacity: 0.5; }
	100% { opacity: 1; }
  }

/* .buy-button:hover{
	background: transparent;
} */

.buy-button{
	width: 235px;
	/* background-color: #E4650A !important; */
	/* background: #ffffff !important;
	color: #000000; */
} 

.nav-button{
	width: 180px;
}

.info-button, .info-button-1{
	margin-top: 9px;    
    width: 243px;
    /* margin-left: -10px; */
    height: 40px;
}

.info-button{
	margin-top: 47px; 
}

.info-button-1{
    margin-top: 50px;
    margin-left: 2%;
    animation-duration: 1.5s;
    animation-name: slideInOut;
}

.header_nav-ul li a.ul-circle {
	font-family: 'Comfortaa' sans-serif;
	font-weight: 400;
	font-size: 17px;
	margin-bottom: 25px;
    color: inherit;
    text-decoration: none;
    position: relative;
	transition: color 0.5s;
}

.header_nav-ul li a.ul-circle::after {
    content: '';
    position: absolute;
    bottom: -5px; 
    left: 50%;
	bottom: -18px;
    width: 12px; 
    height: 12px; 
    border-radius: 50%;
    background: url(../images/header-circle.svg) no-repeat;
	background-size: cover;
    opacity: 0;
    transition: opacity 0.3s ease;	
    transform: translateX(-50%);
}

.header_nav-ul li.cursor a.ul-circle::after{
	left: 50%;
}

.header_nav-ul li:hover a.ul-circle{
	background: linear-gradient(to right, #44B0FF, #2780ed, #1558d7, #043feb);
	/* background: linear-gradient(to right, #44B0FF, #3A93FE, #3076FD, #275DFC); */
    -webkit-background-clip: text; 
    background-clip: text;
    color: transparent; 	
	font-weight: 400;
}

.cursor:hover .ourcourses_cursor .ourcourses-cursor-1 {
	background-color: #111AFA;
	transform: rotate(-40deg);
}


.cursor:hover .ourcourses_cursor .ourcourses-cursor-2 {
	background-color: #111AFA;
	transform: rotate(40deg);
}

.ourcourses_cursor:active .ourcourses-cursor-1{
	transform: rotate(-45del);
}


.header_nav-ul li a.ul-circle.active,
.header_nav-ul li a.ul-circle:active {
	background: linear-gradient(to right, #44B0FF, #2780ed, #1558d7, #043feb);
    /* background: linear-gradient(to right, #44B0FF, #3A93FE, #3076FD, #275DFC); */
    -webkit-background-clip: text; 
    background-clip: text;
    color: transparent; 
	font-weight: 400;
	/* transform:  translateY(10px); */
}

.header_nav-ul li a.ul-circle.active #header.small.active,
.header_nav-ul li a.ul-circle:active #header.small:active{
	padding-bottom: 50px;
}


.header_nav-ul li a.ul-circle.active::after,
.header_nav-ul li a.ul-circle:active::after {
    opacity: 1;
}

/* .header_nav-ul li.active a {
    color: blue !important;
} */

/* -------------------О Нас---------------------------- */

#about__us .container-fluid{
	background: url('../images/about_banner-2.png') no-repeat center;
	/* margin-top: 135px; */
	background-size: cover;
}

.about_us_inform{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 280px 0;
    position: relative;
}

/* .about_img{
	width: 50%;
} */

.about_img {
    position: absolute;
    width: 65%;
    top: 14%;
    z-index: 2;
}

.about_img img{
	width: 85%;
}

/* .about_text {
	width: 50%;
	margin-left: 62px;
	padding: 80px 0px 100px 0;
} */

.about_text {
    position: relative;
    width: 50%;
    margin-left: 0;
    padding: 80px 0px 95px 0;
    transform: translate(97%, -20%);
}


.about-title-1{
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 78px;
	margin-bottom: 25px;
	margin-left: 64px;
    display: none;
}

/* .about-slick{
    display: block;
	background-color: #FAFAFA;
	border-radius: 60px;
	padding: 56px 64px;
	box-shadow: 0 0 20px 12px #64616140;
    width: 557px;
    height: 228px;
	margin: 30px;
} */

.about-slick {
    display: block;
    background-color: #FAFAFA;
    border-radius: 60px;
    padding: 56px 64px;
    box-shadow: 0 0 20px 12px #64616140;
    width: 577px;
    height: 190px;
    margin: 30px;
}

.about-slick-2{
  display: none;
}

.about-slick p{	
	font-family: 'Comfortaa', sans-serif;
	font-weight: 500;
	font-size: 16px;
	letter-spacing: 1px;
	line-height: 26px;
}

.about-slick p:first-child{	
	/* margin-bottom: 25px; */
}

.about-slick:last-child{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.fpx{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.about-p {
	text-align: center; 
	/* font-size: 20px !important; 
	font-weight: 500 !important; */
	line-height: 30px !important; 
}

.about-p:first-child{	
	margin-bottom: 45px;
}

#about__us-2{
	margin-top: 260px;
	margin-bottom: 130px;
}	

.about_us_work{
	background: url('../images/work-line.png') no-repeat center;
	position: relative;
	height: 1044px;	
}

.about_us_work-2, .about_us_work-3{
   display: none;
}


.about_us_work .work-circle, .about_us_work .work-circle-2, .about_us_work .work-circle-3, .about_us_work .work-circle-4{
	position: absolute;
	width: 425px;
	height: 425px;
	border-radius: 50%;
	border: 20px solid #FDFDFD;
	top: calc(50% - 212.5px); /* Позиционируем планету по центру орбиты по вертикали */
	left: calc(50% - 212.5px);	
}

.about_us_work-2 .work-circle, .about_us_work-2 .work-circle-2, .about_us_work-2 .work-circle-3, .about_us_work-2 .work-circle-4,
.about_us_work-3 .work-circle, .about_us_work-3 .work-circle-2, .about_us_work-3 .work-circle-3, .about_us_work-3 .work-circle-4
{
	width: 425px;
	height: 425px;
	border-radius: 50%;
	border: 20px solid #FDFDFD;
}

.work-circle, .work-circle-4{
	background-color: #DFF0FF;
}

.about_us_work .work-circle{

	animation: planetAnimation-1 50s linear infinite; 

}

.about_us_work .work-circle-4{
	position: absolute;

	animation: planetAnimation-4 50s linear infinite; 
}

.work-circle-2, .work-circle-3{
	background-color: #FFF6C9;	
}

.about_us_work .work-circle-2{
	position: absolute;

	animation: planetAnimation-3 50s linear infinite; 
}

.about_us_work .work-circle-3{
	position: absolute;

	animation: planetAnimation-2 50s linear infinite; 
}

.work-text{
	margin-top: 23px;
	padding: 65px;
    text-align: center;
}

.about_us_work .work-center, .about_us_work-2 .work-center, .about_us_work-3 .work-center {
	position: absolute;
	top: 42%;
	left: 41%;
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 56px;
	text-align: center;
}

@keyframes planetAnimation-1 {
	from {
	  transform: rotate(0deg) translateY(-522px) rotate(0deg); /* Круг находится на верхнем краю орбиты */
	}
	to {
	  transform: rotate(360deg) translateY(-522px) rotate(-360deg); /* Круг совершает полный оборот вокруг центра орбиты */
	}
  }

  @keyframes planetAnimation-2 {
	from {
	  transform: rotate(0deg) translateX(-522px) rotate(0deg); /* Круг находится на левом краю орбиты */
	}
	to {
	  transform: rotate(360deg) translateX(-522px) rotate(-360deg); /* Круг совершает полный оборот вокруг центра орбиты */
	}
  }

  @keyframes planetAnimation-3 {
	from {
	  transform: rotate(0deg) translateX(522px) rotate(0deg); /* Круг находится на правом краю орбиты */
	}
	to {
	  transform: rotate(360deg) translateX(522px) rotate(-360deg); /* Круг совершает полный оборот вокруг центра орбиты */
	}
  }

  @keyframes planetAnimation-4 {
	from {
	  transform: rotate(0deg) translateY(522px) rotate(0deg); /* Круг находится на нижним краю орбиты */
	}
	to {
	  transform: rotate(360deg) translateY(522px) rotate(-360deg); /* Круг совершает полный оборот вокруг центра орбиты */
	}
  }

/* -------------------Особенности Курса---------------------------- */

#features{
	/* padding-top: 330px;
	padding-bottom: 250px; */
    padding-top: 250px;
    margin-bottom: -100px;
}

.bigtitle{
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;

	font-size: 88px;	
}

.features.bigtitle{
	text-align: center;
	margin-bottom: 110px;
}

.feature_block{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: 160px;
}

.features-img{
	width: 50%;
}

.features-text, .features-text-2{
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-top: 60px;
	width: 50%;
}

.features-text img, .features-text-2 img {
	width: 56px;
}

.title{
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 56px;
	margin: 40px 0;
}

.subtitle, .subtitle-2{
	font-family: 'Comfortaa', sans-serif;
	font-weight: 400;
	font-size: 17px;
	max-width: 625px;
	line-height: 24px;
}

.work-subtitle p.subtitle-2{
  display: none;
}

.features-text-2{
	position: relative;
	text-align: right;
	max-width: 625px;
}

.fti-2, .fti-4, .fti-6{
	position: absolute;
	right: 0;
}

.fti-2{
	top: -20px;
}

.fti-4{
	top: 95px;
}

.fti-6{
	top: 75px;
}


/* -------------------Наши курсы---------------------------- */

#ourcourses, .ourfaculty {
	/* overflow: auto; */
	padding-top: 80px;
}	

.ourcourses__blocks, .ourfaculty__blocks {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 80px;
    padding-top: 13px;
    margin-left: -11px;
}

.ourcourses-block, .ourfaculty-block {
	/* background: #FDFDFD; */
	background: #ffffff;
	border-radius: 50px;
	box-shadow: 0 0 10px 7px #64616140;
	width: 325px;
	height: 408px;	
	margin: 15px;
	position: relative;
}

.ourfaculty-block  .info-button-1 { margin-top: 18px; }

.ourcourses-block-2{
	/* background: #FDFDFD; */
	/* background: #ffffff; */
	border-radius: 50px;
	box-shadow: 0 0 10px 7px #64616140;
	width: 325px;
	height: 340px;	
	position: relative;
	margin: 15px ;
	transition: transform 1s;
	perspective: 1500px;
	transform-style: preserve-3d;
}


/* .ourcourses-block:hover{
	height: 606px;
} */


.ourcouses-img{
	margin-bottom: -4px;
}

.ourfaculty-img { height: 246px; }


.graphic-design-img, .fullstack-img, .frontend-img, .unity-img,
.golang-img, .qatesting-img {  
  height: 246.02px;
}

.graphic-design-img img, .fullstack-img img, .frontend-img img,
.qatesting-img img{
  border-radius: 50px 50px 0 0;
  width: 100%;
  height: -webkit-fill-available; 
}

.golang-img img {
  width: 100%;
}

.ourcouses-img img, .ourfaculty-img img{
	width: 100%;
}

.internal-page .ourcouses-img img {
	border-radius: 50px 50px 0 0;
}

.internal-page .ourfaculty-img img { border-radius: 50px; }

.ourcorses-title .subtitle{
	font-size: 16px;
}

.ourcouses-text-block, .all-ourcouses-text-block, .all-ourfaculty-text-block {
	overflow: hidden;	
	background-color: #ffffff;
	/* top: 52%;
	left: 0; */
	height: 185px;
	border-left: 1px solid #646161;
	border-bottom: 1px solid #646161;
	border-right: 1px solid #646161;
	border-radius: 0 0 50px 50px;
	transition: height 0.5s ease; 
	z-index: 2;
	box-shadow: 0 0 10px 7px #64616140;
	cursor: pointer;
}
.all-ourfaculty-text-block { height: 115px; }

.all-ourcouses-text-block, .all-ourfaculty-text-block {
  position: absolute; 
  width: 323px;
  bottom: 0;
  transition: 0.7s all;
}

.ourcourses-block:hover .ourcourses-text-block, .ourfaculty-block:hover .ourfaculty-text-block{
	height: 415px;	
}
 
/* .ourcouses-text-block:hover, .ourfaculty-block:hover {
	height: 415px;	
} */

.ourcouses-text-block:hover {
	height: 415px;	
}

 .all-ourcouses-text-block:hover, .all-ourfaculty-text-block:hover {
    height: 408px;
    border-radius: 44px;
}

.ourcouses-text-block-2{
	/* overflow: hidden; */
	background-color: #ffffff;
	position: absolute;
	bottom: -20px;
	height: 185px;
	border-left: 1px solid #646161;
	border-bottom: 1px solid #646161;
	border-right: 1px solid #646161;
	border-radius: 0 0 50px 50px;
	transition: height 0.5s ease; 
	box-shadow: 0 0 10px 7px #64616140;
	/* transition: transform 0.5s ease;  */
}

/* .ourcouses-text-block-2:hover{
	height: 410px;	
	transform: translateY(10px);
} */

.ourcouses-img{
	transition: transform 0.5s ease;
}

/* .ourcouses-block-2:hover .ourcouses-img {
	height: 410px;	
	transform: translateY(50px);
	opacity: 0;
} */

.ourcouses-text-block-2 p, 
.ourcouses-text-block p,
.all-ourcouses-text-block p{
	display: block;
	transition: transform 1.1s ease;
	/* animation-duration: 1.5s;
	animation-name: slideInOut; */
}

.ourcouses-text-block:hover p, .ourfaculty-text-block:hover p {
	/* display: none; */
	transform: translateY(170px);

}

.ourcouses-text-block-2:hover p{
	transform: translateY(165px);
}

.all-ourcouses-text-block:hover p, .all-ourfaculty-text-block:hover p{
	/* display: none; */
	transform: translateY(170px);

}

.subtitle-dark{
	/* position: absolute; */
	background-color: #ffffff;
	bottom: px;
	left: 0;
	height: 168px;
	display: none;
	padding-top: 5px;
	padding-left: 10px;
	margin-top: -25px;
	font-family: 'Comfortaa', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

.ourfaculty-block .subtitle-dark { padding-top: 30px; }

.subtitle-dark-2{
	/* position: absolute; */
	background-color: #222b7c;
	display: none;
	padding-top: 5px;
	padding-left: 10px;
	margin-top: -30px;
	font-family: 'Comfortaa', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0.3px;
	background-color: rgba(255, 255, 255, 0);
}

.android .all-ourcouses-text-block .subtitle-dark {
    line-height: 28px;
}
.li-1 {
	margin-bottom: 5px;
	animation-duration: 2.1s;
	animation-name: slideInOut-1;
}

.li-2 {
	margin-bottom: 5px;
	animation-duration: 1.8s;
	animation-name: slideInOut;
}

.li-3 {
	margin-bottom: 5px;
	animation-duration: 1.5s;
	animation-name: slideInOut;
}

.all-li-1 {
	margin-bottom: 5px;
	animation-duration: 2.1s;
	animation-name: moveInBottom;
}

.all-li-2 {
	margin-bottom: 5px;
	animation-duration: 1.8s;
	animation-name: moveInBottom-1;
}

.all-li-3 {
	margin-bottom: 5px;
	animation-duration: 1.5s;
	animation-name: moveInBottom-2;
}

.subtitle-dark-2>ul>li{
	margin-bottom: 5px;
	animation-duration: 1.5s;
	animation-name: slidein;
}

.ourcouses-text-block-2:hover .subtitle-dark-2,
.ourcouses-text-block:hover .subtitle-dark,
.all-courcouses-text-block-2:hover .subtitle-dark-2,
.all-ourcouses-text-block:hover .subtitle-dark, .all-ourfaculty-text-block:hover .subtitle-dark{
	display: block;
	/* -webkit-transition-duration: 4s;
    -o-transition-duration: 4s;
    -moz-transition-duration: 4s;
    transition-duration: 4s; */
}

.ourcorses-title, .teachers-title {	padding: 32px 15px 25px 25px; }

.ourfaculty-title {	padding: 22px 15px 25px 25px; }

.ourcorses-title-hover, .ourfaculty-title-hover{
	opacity: 0;
}

.ourcourses_title p, .teachers_title p, .ourfaculty_title p {
	margin-top: 36px;
	margin-bottom: 56px;
}

.ourcourses_title h1, .teachers_title h1, .ourfaculty_title h1 {
	margin-left: -5px;
}

.title-small, .title-small-2 {
	margin: 16px 0;
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0;
}

.title-small-1 {
	margin: 18px 0;
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0;
    color: #646161;
}

.title-small-2 {  
	/* margin-bottom: 43px; */
}



.ourcorses-title .subtitle, .teachers-title .subtitle, .ourfaculty-title .subtitle {
	color: #646161;
	letter-spacing: 0.5px;
}

/* -------------------Преподаватели---------------------------- */

#teachers{
	padding-top: 80px;
	margin-top: 80px;
	/* margin: 330px 0; */
}

.teachers-img{
	/* margin-bottom: 10px;
	text-align: center; */
}

.ourcourses-block-2 .teachers-img{
	/* margin-bottom: 10px; */
	text-align: center;
}

.teachers-img img, .flip-block img{
	width: 236px;
	margin-top: 20px;
	border-radius: 30px;
}

.teachers-title{
	text-align: center;
	margin-top: -66px;
}

.teachers-title>p.subtitle>img, .ourcorses-title>p.subtitle>img{
	margin: 4px 16px;
}

/* -------------------Footer---------------------------- */

#contacts{
	position: relative;
}
.mobile__footer{
  display: none;
}

#footer, #footer-all {
 position: relative; 
}

.footer__footer{
	margin-top: 320px;
    background: #5C95FF;
    clip-path: polygon(50% 0%, -865% 100%, 960% 100%);
    /* background: url('../images/footer.png');
    background-repeat: no-repeat;
    background-size: cover; */
	/* background: url('../templates/ereke/images/Footer.png)'); */
	height: 1320px;
    overflow: hidden;
}

.internal-page .footer__footer {
    margin-top: 0;
}

/* .footer_app{
	width: 1261px;
	height: 721px;
	border-radius: 100px;
	background-color: #FAFAFA;
	margin: 0 auto;
	
} */
.footer_app {
    width: 1190px;
    height: 666px;
    border-radius: 100px;
    background-color: #FAFAFA;
    margin: 0 auto;
}
.footer__footer > .container-fluid{
	padding-top: 145px;
}

.footer-line{
	margin: 72px auto;
	text-align: center;
}

.footer-logotype-blocks {
  display: grid;
  grid-template-columns: repeat(3, 1fr);  
}

.footer-logotype-blocks a {
  width: 50px;
  height: auto;
}

.footer-logotype-blocks a.sm {
  margin-top: -7px;
  margin-left: -6px;
  width: 64px;
}

.footer-logotype-blocks a img{
  width: 100%;
}

.copyright {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-family: 'Comfortaa', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #fff;
}

.afterline, .ourcoursesline{
	position: relative;
	max-width: 1400px;
}

.ourcoursesline{
  overflow: hidden;
}

/* .afterline::after{
	content: '';
	position: absolute;
	top: 10px;
	left: 0;
	width: 100%;
	height: 3px;
	background: #ffffff;
} */

.afterline::after{
  content: '';
  position: absolute;
  top: 10px;
  left: 50%;
  width: 50%;
  height: 3px;
  background: #ffffff;
  /* animation-duration: 2.4s;
  animation-name: slidein-1; */
}

.afterline::before{
  content: '';
  position: absolute;
  top: 10px;  
  right: 50%;
  width: 50%;
  height: 3px;
  background: #ffffff;
  /* animation-duration: 2.4s;
  animation-name: slidein-1; */
}


.ourcoursesline::after{
  content: '';
  position: absolute;
  top: 10px;
  left: 50%;
  width: 50%;
  height: 2px;
  background: #5C95FF;
  animation-duration: 2.4s;
  animation-name: slidein-1;
}

.ourcoursesline::before{
  content: '';
  position: absolute;
  top: 10px;  
  right: 50%;
  width: 50%;
  height: 2px;
  background: #5C95FF;
  animation-duration: 2.4s;
  animation-name: slidein-1;
}



.footer-title, .footer-title-2{
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 96px;
	letter-spacing: 0;
	text-align: center;
	padding-top: 62px;
	padding-bottom: 10px;
}

.footer-title{
	color: #5C95FF;
}

.footer-title-2{
	color: #DE6E4B;
}

.form-wrap{
	display: flex;
    flex-direction: column;
    align-items: center;
}

.input_form{
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* .input-valid > input{
	width: 520px;
	height: 56px;
	text-align: center;
	border-radius: 50px;
	margin-top: 25px;
	text-align: left;
	padding-left: 25px;
} */

/* .input-valid > input::placeholder{
	text-align: left;
	font-family: 'Comfortaa', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: #000000	;
} */

input.input-valid, select.input-valid {
	width: 520px;
	height: 56px;
	text-align: center;
	border-radius: 50px;
	margin-top: 25px;
	text-align: left;
	padding-left: 25px;
}

select.input-valid {
  width: 547px;
}

select:focus,
input:focus,
.custom-select:focus,
.my-custom-select:focus{
  outline: none;
  border-color: #007bff;
  box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); /* Подсветка на фокусе */
}

.custom-select, 
.my-custom-select{
  position: relative;
  overflow: visible; 
  width: 520px;
  height: 56px;
  border: 2px solid #000;
  background-color: #fff;
  text-align: center;
  border-radius: 50px;
  margin-top: 25px;
  text-align: left;
  padding-left: 25px;
  cursor: pointer;
  user-select: none;
  display: flex;
  align-items: center;
}

/* Отображение выбранного элемента */
.select-display,
.my-select-display{
  padding: 20px 70% 20px 0px;
  border-radius: 50px;
  /* background-color: #f9f9f9;  */
  text-align: left;
  font-family: 'Comfortaa', sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: #000000;
  outline: none;
}
.select-display:focus,
.my-select-display:focus{
  outline: none;  /* Убираем фокусный контур */
  box-shadow: 0 0 0 2px #5C95FF; /* Например, добавить мягкий голубой контур при фокусе, если нужно */
}
/* Список опций */
.select-options,
.my-select-options{
  display: none; /* Скрыт по умолчанию */
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  border: 1px solid #ccc;
  border-radius: 12px;
  background-color: #fff;
  color: #000;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  z-index: 10;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Опция */
.select-options li,
.my-select-options li {
  padding: 10px;
  font-size: 16px;
  border-radius: 12px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.select-options li:hover,
.my-select-options li:hover{
  background-color: #f0f0f0;
}

/* При клике раскрывается список */
.custom-select.open .select-options,
.my-custom-select.open .my-select-options{
  display: block;
}

input.input-valid:placeholder{
	text-align: left;
	font-family: 'Comfortaa', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: #000000	;
}

.input-valid-radio{
	/* margin: 30px 0 55px 0; */
    margin: 15px 0 30px 0;
	font-family: 'Comfortaa', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: #000000;	
    text-align: center;
}

p.input-valid-radio > input{
	margin-right: 5px;
}

.age-group {
    display: flex;
    justify-content: center;
    gap: 32px;
    margin-top: 32px;
}

.age-student {
  font-size: 16px;
}

.footer-button{
	width: 215px;
	height: 50px;
	background: linear-gradient(to right, #F4934E, #EC7C2C,#E4650A);
	border: 0.5px solid #E4650A;
	text-align: center;
	font-family: 'Comfortaa', sans-serif;
	font-size: 16px;
	font-weight: 600;
	color: #ffffff;
	padding-left: 0;
	cursor: pointer;
	position: relative;
    border-radius: 50px;
}

.footer_bottom_blocks .container {
    display: grid;
    grid-template-columns: 20% 80%;
    margin-top: 72px;
    gap: 50px;
}

.footer-logotype-title{
	width: 409px;
	font-family: 'Comfortaa', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	margin-top: 25px;
	color: #ffffff;
	text-align: left;
}

.footer-block a{
	font-family: 'Comfortaa', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	text-decoration: none;
	color: #ffffff;
}

.footer-block > a:first-child{
	margin-top: 26px;
}

.footer_blocks{
	display: flex;
	flex-direction: row;
    justify-content: space-between;
}

.footer-block{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
}

.footer-block-title{
	font-family: 'PTSansCaption', sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: #ffffff;
	margin-bottom: 10px;
}

.footer_block p{
	
}

.footer-logotype{
	display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
}

.footer_blocks .footer-block:first-child{
	margin-left: 0;
}

.footer_blocks .footer-block:last-child{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.footer_blocks .footer-block:last-child .footer-block-title {
}

.block {
    width: 100px;
    height: 100px;
    background-color: blue;
    transition: height 0.5s ease; /* добавляем анимацию */
	position: absolute;
} 

.block:hover {
    height: 250px; /* увеличиваем масштаб при наведении*/
	background-color: red; 
}
/* .block {
    position: relative;
    width: 100px;
    height: 100px;
    background-color: blue;
    transition: height 2.3s ease; 
} */

/* .block::before,
.block::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    background-color: blue;
    transition: height 2.3s ease;
}

.block::before {
    top: 0;
}

.block::after {
    bottom: 0;
}

.block:hover {
    height: 350px; 
}

.block:hover::before,
.block:hover::after {
    height: 225px; 
} */



.hidden-block {
  display: none; /* Скрытый блок по умолчанию */
}

.block:hover .hidden-block {
  display: block; /* Показать скрытый блок при наведении на блок */
}







  .example {
	animation-name: slide;
	animation-duration: 2s;
	width: 50px;
	height: 50px;
	background-color: blue;
	border-radius: 50%; /* Делаем круг */
	position: absolute;
	top: 50%;
	left: 50%;
  }
  
  @keyframes slide {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(100px);
	}
  }




  .example-1 {
	animation-name: slide;
	animation-duration: 5s;
	animation-iteration-count: infinite; /* или любое другое число */
	width: 70px;
	height: 70px;
	background-color: rgb(0, 255, 242);
	border-radius: 50%; /* Делаем круг */
	position: absolute;
	top: 50%;
	left: 50%;
	transition-delay: 2s;
  }
  
  @keyframes slide {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(100px);
	}
  }


  .example-2 {
	animation-name: slide;
	animation-duration: 2s;
	animation-delay: 1s;
	width: 80px;
	height: 80px;
	background-color: rgb(255, 0, 128);
	border-radius: 50%; /* Делаем круг */
	position: absolute;
	top: 50%;
	left: 50%;
  }
  
  @keyframes slide {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(100px);
	}
  }



  .example-3 {
	animation-name: slide;
	animation-duration: 2s;
	animation-timing-function: ease-in-out;
	width: 130px;
	height: 130px;
	background-color: rgb(255, 196, 0);
	border-radius: 50%; /* Делаем круг */
	position: absolute;
	top: 50%;
	left: 50%;
  }
  
  @keyframes slide {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(100px);
	}
  }


  .example-4 {
	animation-name: slide;
	animation-duration: 2s;
	width: 100px;
	height: 100px;
	background-color: rgb(0, 255, 106);
	border-radius: 50%; /* Делаем круг */
	position: absolute;
	top: 50%;
	left: 50%;
  }
  
  @keyframes slide {
	0% {
	  transform: translateX(0);
	}
	50% {
	  transform: translateX(50px);
	}
	100% {
	  transform: translateX(100px);
	}
  }


  
  

  /* .single-item{
	display: flex;
  } 

  .single-item>div{
	width: 100pX;
	height: 500px;
	background: #25c273;
	margin: 0 auto;
  }
 */


  .content {
	margin: auto;
	/* padding: 0 30px; */
	width: 100%;
	max-width: 1600px;
	box-sizing: border-box;
	margin-left: -15px !important;;
  }
  .content h2 {
	background: #32bd3e;
	color: #3498db;
	font-size: 36px;
	line-height: 100px;
	margin: 10px;
	padding: 2%;
	position: relative;
	text-align: center;
  }
  
  .slick-prev, .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}

#autoplay-2 .slick-prev, .slick-prev {
  z-index: 2;
}

#autoplay-2 .slick-prev, #autoplay-2 .slick-next {
	top: 39%;
}

#autoplay-2 .slick-dots{
	bottom: 163px;
	z-index: 1 !important;
}

#autoplay-3 .slick-dots, #autoplay .slick-dots{
	bottom: -45px;
	z-index: 1 !important;
}
#autoplay .slick-dots{
  left: 40px;
}

.slick-prev:before, .slick-next:before {
	/* color: #E4650A !important; */
	color: #5C95FF !important;
	font-size: 40px !important;
}

.slick-slide img {
    display: inline !important;
}

.slick-prev {
    left: -45px !important;
}

.slick-next {
    right: -45px !important;
}

.slick-list.draggable{
   width: 1420px !important;	
}

/* #autoplay .slick-list.draggable{
	width: 695px !important;
	height: 365px;
	
} */

#autoplay .slick-prev, #autoplay .slick-next {
    display: none !important;
}

#autoplay-2 .slick-list.draggable{
    width: 1420px !important;
	height: 690px !important;
}

/* #autoplay .slick-active{
	font-size: 8px !important;
} */

#autoplay .slick-dots li.slick-active button:before, 
#autoplay-3 .slick-dots li.slick-active button:before {
    opacity: .75;
    color: #646161;
    font-size: 12px;
}

#autoplay .slick-dots li button:before,
#autoplay-3 .slick-dots li button:before{
	font-size: 9px;
	color: #646161;
	opacity: .50;
}











.book-container {
    perspective: 1500px;
}

.book, .teachers-img {
    /* width: 236px; */
    height: 340px;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 1s ease;
    margin: 0 auto;
	
	/* margin-top: 20px; */
}

.book:hover, .teachers-img:hover {
    transform: rotateY(-180deg);
}

.first-image, .second-image, .card-container {
    position: absolute;
    width: 100%;
    /* height: 100%; */
	top: 0;
	left: 0;
}

.first-image {
    backface-visibility: hidden;
    z-index: 2; /* Помещаем первую картинку поверх второй */
}

.second-image, .card-container  {
    backface-visibility: hidden;
    transform: rotateY(180deg);
    background-color: #ffffff;
    margin-top: 6px;
    height: 320px;
}

.cover-label, .inner-label {

    transform: translate(-50%, -50%);
    color: black;
    font-size: 18px;
    font-weight: bold;
    opacity: 0;
    transition: opacity 0.3s ease;
	transform: rotateY(-180deg);
}

.cover-label {
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 24px;
	font-family: 'PTSansCaption', sans-serif;
    font-weight: 700;
    font-size: 24px;
    letter-spacing: 0;
}

.inner-label{
	position: absolute;
    top: 20%;
    right: 10px;
}

.book:hover .cover-label, .book:hover .inner-label, .teachers-img:hover .cover-label, .teachers-img:hover .inner-label, .teachers-img:hover .door-button, .teachers-img:hover .card-container{
    opacity: 1;
}

.door-button {
    opacity: 0;
    transition: opacity 1.5s ease;
    transform: rotateY(-180deg);
    position: absolute;
    bottom: -17px;
    right: 27px;
    width: 185px;
    height: 35px;
}

.ourcourses-block-2.open {
    transform: rotateY(-180deg);
}







.card-container{
    perspective: 1000px; /* Устанавливаем перспективу для эффекта 3D */
	opacity: 0;
} 	



/* .front, .back, .second-image{
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden; 
} */

/* .front {
    background-color: #f0f0f0; 
    display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
} */

/* .back {
    background-color: #ccc;
    transform: rotateY(-180deg); 
    display: flex;
    justify-content: center;
    align-items: center;
} */



















.flipContainer{
	position: relative;
	width: 200px;
	perspective: 1500px;
	transform-style: preserve-3d;
	margin: 0 auto;
}

#flipButton, #someId, .flipButton-1{ 
    width: 30px !important;
    height: 30px !important;
	background: url(../images/icons8-стрелка-100.png) no-repeat !important;
	background-size: cover !important;
}

#flipButton, #flipButton-2{
  display: none;
}

.flipBlock {
    height: 325px;
    width: 300px;
    position: relative;
    
    transform-style: preserve-3d;
    transition: transform 1.2s ease;
    perspective: 1500px;
    margin: 0 auto;
	padding-top: 15px;
    z-index: 2;
	text-align: center;
	overflow: hidden;
}

.flipBlock .front, .flipBlock .backk {
    position: absolute;	
	width: 300px;
	height: 325px;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    transition: transform 1.2s ease;
	cursor: pointer;
}

.flipBlock .front {
    /* background-color: #646161; */
    display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: rotateY(0deg);
	border-radius: 50px;	
}

.flipBlock .backk {
	position: relative;
    /* background-color: #fff; */
    display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: rotateY(180deg);
	transform-style: preserve-3d;
	overflow: hidden;
	border-radius: 50px;
	margin-top: -4px;
}

.backk img{
	/* width: 236px; */
	margin-top: -4px;
	border-radius: 50%;
	height: 236px;
}

.backk-backk {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
	margin-top: 22px;    
}

.backk-backk p{
	font-family: 'PTSansCaption', sans-serif;
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0;
	/* margin-right: 10px; */
	color: #646161;
}

.flipBlock:hover .front {
    transform: rotateY(180deg);
}

.flipBlock:hover .backk {
    transform: rotateY(0deg);
}

.brownBlock {
    /* z-index: 1; */
	position: absolute;
	top: 0;
	left: 0;
    width: 296px;
    height: 319px;
    background-color: #ffffff;
    /* margin-top: 20px; */
	transform-style: preserve-3d;
	transition: transform 1.3s ease-out;
	transform: rotateY(-90deg);
	opacity: 0;

}

.button-hover{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 90px;
	background-color: #44B0FF;
	transition: 0.2s;
}

.brownBlock>.subtitle-dark{
	display: block;
	margin-top: 50px;
}

.brownBlockk {
 
	position: absolute;
	top: 0;
    width: 200px;
    height: 200px;
    background: url('../images/banner.png');
    transform-style: preserve-3d;
	transition: transform 0.5s ease-out;
	transform: rotateY(-90deg);
	
	opacity: 0;
	
}


/* .flipBlock.flipped {
	transition: transform 1.2s ease;
    transform: rotateY(0deg) ;
} */

.brownBlock.flipped, .brownBlockk.flipped{
	position: absolute;
	top: 0;
	width: 296px;
    height: 319px;
	/* display: block ; */
	transform: rotateY(0deg);
	/* transform: translateX(0%); */
	z-index: 40;
	opacity: 1;	
	transform-style: preserve-3d;
	border-radius: 50px;
	border: 2px #5C95FF solid;
	transition: transform 1.3s ease;
}

/* .brownBlock.flipped{
	left: 0;
} */

.brownBlockk.flipped{
	right: 0;
	opacity: 0;
}

/* .brownBlock.flipped:hover .flipBlock{
	transform: rotateY(0deg);
} */


  

.animated-text {
	overflow: hidden;
	white-space: nowrap;
	font-size: 24px; /* Размер шрифта */
	font-family: Arial, sans-serif; /* Шрифт */
	color: #000000;
}

.animated-text span {
	display: inline-block;
	opacity: 0;
	animation: typing 5s steps(40, end) forwards; /* Продолжительность анимации и шаги */
}

@keyframes typing {
	from { opacity: 0; }
	to { opacity: 1; }
}






.parallax-block {
	min-height: 100%;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
  }
   
  #block1 {
	background-image: url('../images/teachers-2.png');
  }
   
  #block2 {
	background-image: url('../images/teachers-3.png');
  }
   
  #block3 {
	background-image: url('../images/teachers-4.png');
  }


/* -------------------Parralax effect---------------------------- */

.parallax {
	width: 100%;
	
	/* padding: 5rem; */
	/* min-height: 10rem; */
	/* position: relative;	 */
	/* border: 1px solid green;
	border-radius: 5px; */
	overflow: hidden;
  }
  
  .parallax__layer {
	transition: transform 0.3s linear;
  }

/* -------------------keyframes---------------------------- */

@keyframes rotate {
	0% {
	  transform: rotate(0deg);
	}
	100% {
	  transform: rotate(360deg);
	}
  }
  
  @keyframes rotate-2 {
	0% {
	  transform: rotate(0deg);
	}
	100% {
	  transform: rotate(-360deg);
	}
  }


.bottom, .bottom-2, .bottom-3, .bottom-3, .bottom-4, .bottom-5,
.bottom-6, .bottom-7, .bottom-8, .bottom-9, .bottom-10 {
  opacity: 0;
  transition: 0.2s;
}

.left, .left-2, .left-3, .left-4, .left-5,
.right, .right-2, .right-3, .right-4, .right-5, .right-6, .right-7 {
  opacity: 0;
  transition: 0.2s;
}

.slideInTop{
    opacity: 1; 
	animation: slideInTop 1s ease-in-out;
}

.slideInBottom{	
    opacity: 1;
	animation: slideInBottom 2s ease-in-out;
}

.slideInBottom-2{	
    opacity: 1;
	animation: slideInBottom-1 0.8s ease-in-out;
}

.slideInBottom-3{	
    opacity: 1;
	animation: slideInBottom-1 1s ease-in-out;
}

.slideInBottom-4{	
    opacity: 1;
	animation: slideInBottom-1 1.2s ease-in-out;
}

.slideInBottom-5{
    opacity: 1; 
	animation: slideInBottom-1 1.4s ease-in-out;
}

.slideInBottom-6{
    opacity: 1; 
	animation: slideInBottom-1 1.6s ease-in-out;
}

.slideInBottom-7{
    opacity: 1; 
	animation: slideInBottom-1 1.8s ease-in-out;
}

.slideInBottom-8{	
    opacity: 1; 
	animation: slideInBottom-1 2s ease-in-out;
}

.slideInBottom-9{	
    opacity: 1; 
	animation: slideInBottom-1 2.2s ease-in-out;
}

.slideInBottom-10{
    opacity: 1; 
	animation: slideInBottom-2 1.8s ease-in-out;
}

.slideInBottom-11{	
    opacity: 1; 
	animation: slideInBottom-2 0.7s ease-in-out, opacity 0.7s;
}

.slideInBottom-12{	
    opacity: 1; 
	animation: slideInBottom-2 0.7s ease-in-out, opacity 0.7s;
}

.slideInLeft{	
    opacity: 1; 
	animation: slideInLeft 1s ease-in-out;
}

.slideInLeft-2{	
    opacity: 1; 
	animation: slideInLeft 1.3s ease-in-out;
}

.slideInLeft-3{	
    opacity: 1; 
	animation: slideInLeft 1.6s ease-in-out;
}

.slideInLeft-4{	
    opacity: 1; 
	animation: slideInLeft-4 1s ease-in-out;
}

.slideInLeft-6{	
    opacity: 1; 
	animation: slideInLeft 0.9s ease-in-out, opacity 0.9s;
}

.slideInRight{	
    opacity: 1; 
	animation: slideInRight 1s ease-in-out;
}

.slideInLeft-5{	
    opacity: 1;
    animation: slideInLeft-5 1.3s ease-in-out, opacity 2s;
}

.slideInRight-2{	
    opacity: 1;
	animation: slideInRight 1.3s ease-in-out;
}

.slideInRight-3{	
    opacity: 1;
	animation: slideInRight 1.6s ease-in-out;
}

.slideInRight-4{
    opacity: 1;
	animation: slideInRight-4 1s ease-in-out;
}

.slideInRight-5{	
    opacity: 1;
    animation: slideInRight .6s ease-in-out, opacity .6s;
}

.slideInRight-6{	
    opacity: 1;
    animation: slideInRight 2.8s ease-in-out, opacity 2.8s;
}

.slideInRight-7{	
    opacity: 1;
    animation: slideInRight 4s ease-in-out, opacity 4s;
}

.slideInRight-8{	
    opacity: 1;
    animation: slideInRight 5.2s ease-in-out, opacity 5.2s;
}

.slideInTopLeft{
    opacity: 1;
	animation: slideInTopLeft 1.5s ease-in-out;
}

.slideInTopRight{
    opacity: 1;
	animation: slideInTopRight 1.2s ease-in-out;
}

.slideInBottomLeft{	
    opacity: 1;
	animation: slideInBottomLeft 1s ease-in-out;
}

.slideInBottomRight{
    opacity: 1;
	animation: slideInBottomRight 1s ease-in-out;
}

.opacity-ty{
	animation: opacity 2s;
}

.opacity-ty-1{
	animation: opacity 1s;
}

.opacity-ty-2{
	animation: opacity 1.6s;
}

.opacity-ty-3{
	animation: opacity 2.2s;
}

.opacity-ty-4{
	animation: opacity 2.8s;
}

.opacity-ty-5{
	animation: opacity 3.4s;
}

.opacity-ty-6{
	animation: opacity 4.0s;
}

.opacity-ty-7{
	animation: opacity 4.6s;
}

.opacity-ty-8{
	animation: opacity 5.2s;
}

.home-page .animate__animated.animate__lightSpeedInRight{
	--animate-duration: 2s;
}

.after-line{
	animation-duration: 3.4s;
    animation-name: slidein-1;
}

@keyframes opacity {
	from {
	  opacity: 0;
	}
	to {
		opacity: 1;
	}
  }

@keyframes slideInTop {
	from {
	  transform: translateY(-150%);
	}
	to {
	  transform: translateY(0);
	}
  }

  @keyframes slideInBottom {
	from {
	  opacity: 0;
	  transform: translateY(40px);
	}
	to {
	  opacity: 1;
	  transform: translateY(0);
	}
  }

  @keyframes slideInBottom {
	from {
	  opacity: 0;
	  transform: translateY(40px);
	}
	to {
	  opacity: 1;
	  transform: translateY(0);
	}
  }

  @keyframes slideInBottom-1 {
	from {
	  opacity: 0;
	  transform: translateY(140px);
	}
	to {
	  opacity: 1;
	  transform: translateY(0);
	}
  }

  @keyframes slideInBottom-2 {
	from {
	  opacity: 0;
	  transform: translateY(50px);
	}
	to {
	  opacity: 1;
	  transform: translateY(0);
	}
  }

  @keyframes slideInLeft {
	from {
	  transform: translateX(-40%);
	}
	to {
	  transform: translateX(0);
	}
  }


  @keyframes slideInLeft-4 {
	from {
	  transform: translateX(-850px);
	}
	to {
	  transform: translateX(0);
	}
  }


  @keyframes slideInLeft-5 {
	from {
	  transform: translateX(-30%);
	}
	to {
	  transform: translateX(0);
	}
  }
  
  @keyframes slideInRight {
	from {
	  transform: translateX(40%);
	}
	to {
	  transform: translateX(0);
	}
  }

  @keyframes slideInRight-4 {
	from {
	  transform: translateX(850px);
	}
	to {
	  transform: translateX(0);
	}
  }

  @keyframes slideInTopLeft {
	from {
	  transform:  translate(-30%, -50%);
	}
	to {
	  transform:  translate(0, 0);
	}
  }

  @keyframes slideInTopRight {
	from {
		transform:  translate(30%, -50%);
	  }
	  to {
		transform:  translate(0, 0);
	  }
	}

  @keyframes slideInBottomLeft {
	from {
		transform:  translate(-50%, 80%);
	}
	to {
	  transform: translate(0, 0);
	}
  }

  @keyframes slideInBottomRight {
	from {
		transform:  translate(50%, 80%);
	}
	to {
	  transform: translate(0, 0);
	}
  }




  @keyframes slidein {
	from {
	  margin-top: 100%;
	  width: 100%;
	}
  
	to {
	  margin-top: 0%;
	  width: 100%;
	}
  }

  @keyframes slidein-1 {
	from {
	  width: 0%;
	}
  
	to {
	  width: 100%;
	}
  }

  @keyframes slidein-2 {
	from {
	  width: 0%;
	}
  
	to {
	  width: 50%;
	}
  }

  @keyframes slideInOut {
	from {
	  transform: translateY(-80%);
	}
	to {
	  transform: translateY(0);
	}
  }

  @keyframes slideInOut-1 {
	from {
	  transform: translateY(-60%);
	}
	to {
	  transform: translateY(0);
	}
  }

  @keyframes slideInOut-2 {
	from {
	  transform: translateY(-60%);
	}
	to {
	  transform: translateY(0);
	}
  }

  @keyframes slideInOut-3 {
	from {
	  transform: translateY(-50%);
	}
	to {
	  transform: translateY(-280%);
	}
  }

  @keyframes slideInOut-4 {
	from {
	  transform: translateY(-50%);
	}
	to {
	  transform: translateY(-150%);
	}
  }

  @keyframes slideInOut-5 {
	from {
	  transform: translateY(-50%);
	}
	to {
	  transform: translateY(-31%);
	}
  }

  @keyframes slideInOut-6 {
	from {
	  transform: translateY(-50%);
	}
	to {
	  transform: translateY(92%);
	}
  }


  @keyframes moveInBottom {
	0% {
		opacity: 0;
		transform: translateY(30px);
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

@keyframes moveInBottom-1 {
	0% {
		opacity: 0;
		transform: translateY(40px);
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

@keyframes moveInBottom-2 {
	0% {
		opacity: 0;
		transform: translateY(50px);
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}











  @keyframes typing {
	from { width: 0 }
	to { width: 100% }
  }
  
  /* Мигание курсора */
  @keyframes blink-caret {
	from, to { border-color: transparent }
	50% { border-color: black }
  }
  
  /* Скрыть текст */
  .typewriter h1 {
	overflow: hidden;
	/* border-right: .15em solid black;  */
	white-space: nowrap;
	margin: 0 auto;
	letter-spacing: .15em; /* Расстояние между буквами */
	animation: typing 7s steps(40, end), blink-caret .75s step-end infinite;
  }








  /* .parallax {
	height: 1000px;
	overflow: hidden;
	position: relative;
  }
  
  .parallax-bg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: url('../images/first_image.png'); 
	background-size: cover;
	background-attachment: fixed;
	transition: transform 0.5s ease; 
  }
  
  .parallax:hover .parallax-bg {
	transform: scale(1.1); 
  }
  
  .parallax-content {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100%;
	text-align: center;
	color: white;
	z-index: 1;
  } */




  .wrapper {
    width: 57%;
	/* width: 100%; */
	/* margin: 0 auto;
	margin-top: 5rem;
	
	display: grid;
	place-items: center; */
  }

  .rectangle {
		/* position: absolute;
		top: 3rem;
		left: 0; */
	/* width: 150px;
	height: 150px; */
  }
  

  
  













  /* .pechat{
    width: 330px;
    overflow: hidden;
}
.pechat .text{
    position: relative;
    color: #facc15;
    font-size: 30px;
    font-weight: 600;
}
.pechat .first_text{
    color: #111111;
}
.sec-text:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #ffffff;
    border-left: 2px solid #facc15;
    animation: animate 4s steps(12) infinite;
}
@keyframes animate{
    40%, 60%{
        left: calc(100% + 4px);
    }
    100%{
        left: 0%;
    }
} */

/* .pechat .text {
    position: relative;
    color: #facc15;
    font-size: 30px;
    font-weight: 600;
    overflow: hidden;
}
.pechat .first_text {
    color: #111111;
}
.sec-text:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
   
    border-left: 2px solid #facc15;
    animation: animate 4s steps(12) infinite;
    overflow: hidden;
    white-space: nowrap;
    animation-play-state: paused; 
}
@keyframes animate {
    40%, 60% {
        left: calc(100% + 4px);
    }
    100% {
        left: 0%;
    }
}
.typing-animation {
    animation-play-state: running !important; 
} */



#slider {
    /* width: 600px;
    display: flex;
    gap: 15px;
    font-size: 30px; */
  }
  
  #sliderValue, #sliderValue-ru, #sliderValue-kz, #sliderValue-en, #sliderValue-1, #sliderValue-2{
    display: flex;
    /* color: #baee00; */
	color: #F26419;
      font-weight: 700;
	  font-size: 56px;
  }
  
  .start {
    opacity: 0;
  }
  
  .animation {
    animation: fade .3s forwards;
  }
  
  
  @keyframes fade {
    0%{
      opacity: 0;
      transform: translateY(-20px) rotateZ(35deg);
    }
    100%{
      opacity: 1;
      transform: translateY(0px) rotateZ(0deg);
    }
  }
  
  .holder-animation {
    animation: holder 4s;
  }
  
  @keyframes holder {
    0%{
      opacity: 1;
    }
    95%{
      opacity: 1;
    }
    100%{
      opacity: 0;
    }
  }









  /* .counter {
	font-size: 48px;
	font-weight: bold;
	color: #000000;
  } */


  .counter {
	font-size: 48px;
	font-weight: bold;
	opacity: 0; 
	transition: opacity 1s ease;
	color: #000000;
  }





 /* .modal-2 {
    display: none; 
    position: fixed; 
    z-index: 1; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgba(0,0,0,0.4);
}

.modal-content-2 {
    background-color: #fefefe;
    margin: 15% auto; 
    padding: 20px;
    border: 1px solid #888;
    width: 80%; 
}

.close-2 {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close-2:hover,
.close-2:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
} */











    /* .modal {
      display: none; 
      position: fixed; 
      z-index: 1; 
      left: 0; 
      top: 0; 
      width: 100%; 
      height: 100%; 
      overflow: auto; 
      background-color: rgb(0,0,0); 
      background-color: rgba(0,0,0,0.4); 
    }

    .modal-content {
      background-color: #fefefe;
      margin: 15% auto; 
      padding: 20px;
      border: 1px solid #888;
      width: 80%; 
      max-width: 500px;
      position: relative;
    }

    .close {
      color: #aaa;
      float: right;
      font-size: 28px;
      font-weight: bold;
    }

    .close:hover,
    .close:focus {
      color: black;
      text-decoration: none;
      cursor: pointer;
    }

    .form-wrap {
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .input {
      width: 100%;
      padding: 10px;
      margin: 5px 0;
      box-sizing: border-box;
    }

    .bt {
      padding: 10px 20px;
      background-color: #4CAF50;
      color: white;
      border: none;
      cursor: pointer;
    }

    .bt:hover {
      background-color: #45a049;
    }

    .mimage img {
      max-width: 100%;
      height: auto;
    } */

    /* .modal-2 {
      display: none; 
      position: fixed; 
      z-index: 1; 
      left: 0;
      top: 0;
      width: 100%; 
      height: 100%; 
      overflow: auto; 
      background-color: rgba(0,0,0,0.4); 
    }
 */

    /* Custom styles for the modal */
/* Модальное окно */
.modal {
    display: none; /* Оно скрыто по умолчанию */
    background: #5C95FF;
    width: 80%;
    position: fixed;
    z-index: 1001;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    border-radius: 100px;
    border: 5px solid #fff;
    width: 1190px;
    height: 666px;
}

/* Модальное окно для результата */
/* .modal-background {
    background: green;
    border-radius: 10px;
    width: 45%;
    height: 85px;
    padding: 20px;
    font-size: 36px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 27%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
} */
.modal-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Черный с полупрозрачностью */
  z-index: 999; /* Фон будет под модальным окном */
  display: none; /* Скрыт по умолчанию */
}

/* Кнопка закрытия */
.close-2 {
    color: #ffffff;
    font-size: 38px;
    font-weight: bold;
    position: absolute;
    right: 30px;
    top: 25px;
    cursor: pointer;
}

.close-2:hover {
    color: black;
}

/* Кнопка на странице */
.btn {
    background-color: transparent;
    color: #000000;
    border: none;
    cursor: pointer;
}

/* Форма */
form#contactForm {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* .modal-content{
  z-index: 1001;
} */

.modal-content, 
.modal-content .footer-title,
.modal-content p.input-valid-radio{
  color: #ffffff;
}

.modal-content .custom-select {
  background: #ffffff;
}

.modal-content .select-options {
  color: #000000;
}
    /* .btn:hover {
      background-color: darkgreen;
    } */

/* .hidden {
    display: none;
} */

/* #resultMessage {
    position: fixed; 
    top: 500px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    border-radius: 5px;
    z-index: 1000;
    opacity: 0.9; 
    transition: opacity 0.3s ease;
    box-sizing: border-box; 
    background-clip: padding-box;
    outline: none; 
    width: 80%;
    max-width: 600px; 
    height: 100px;
    font-size: 18px; 
    font-weight: 600;
} */

.resultMessageFooter {
    position: fixed;
    top: 31.5%;
    left: 50%;
    transform: translateX(-50%);
    padding: 20px 35px;
    border-radius: 25px;
    z-index: 1002;
    opacity: 1;
    transition: opacity 0.3s ease;
    box-sizing: border-box;
    background-clip: padding-box;
    outline: none;
    width: 48%;
    max-width: 870px;
    height: 150px;
    font-size: 24px;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
}

.resultMessageModal {
    position: absolute;
    top: 11%;
    left: 50%;
    transform: translateX(-50%);
    padding: 20px 35px;
    border-radius: 25px;
    z-index: 1000;
    opacity: 1;
    transition: opacity 0.3s ease;
    box-sizing: border-box;
    background-clip: padding-box;
    outline: none;
    width: 70%;
    height: 150px;
    font-size: 24px;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
}

        .modal-content.successModal,
        .modal-content.successFooter {
            background-color: #24CE1B !important;
            border: 2px solid #00ff00 !important;
        }

        .modal-content.errorModal,
        .modal-content.errorFooter {
            background-color: #ff0000 !important;
            border: 2px solid #ff0000 !important;
        }

.language-selector {
    position: relative;
    display: flex;
    align-items: center;
}

#language-list,
#language-list-all {
    display: none; /* Изначально скрыто */
    position: absolute;
    list-style-type: none;
    padding: 0;
    margin: 0;
    top: 60px;
    left: 20px;
    background-color: #5C95FF;
    border-radius: 17px;
    z-index: 99;
}

#language-list.open,
#language-list-all.open {
    display: block; /* Показать список, если есть класс "open" */
}

#language-list li,
#language-list-all li {
    margin-bottom: 5px;
    padding: 7px 60px 7px 25px;
    color: #ffffff;
    font-family: 'Comfortaa', sans-serif;
    font-size: 16px;    
}

.lang-block li a{
  display: flex;
  align-items: center;
}

.lang-block li a img{
  margin-top: -1px;
  margin-right: 12px;
  width: 35px;
  height: auto;
}

.after{
  position: relative;  
  overflow: hidden;
  width: 40%;
}

.after::after {
	content: '';
	position: absolute;
    left: 15px;
    bottom: 0px;
    width: 100%;
    height: 1px;
    
	background-color: #FFFFFF;
	animation-duration: 1.5s;
	animation-name: slidein-1;
  
}

.mod-breadcrumbs__wrapper{
  position: absolute;
    top: 195px;
    width: 100%;
    margin: 0 auto;
}

.mod-breadcrumbs.breadcrumb.px-3.py-2{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 55px;
}

/* ol li {
  list-style-type: none;
}

ol.mod-breadcrumbs.breadcrumb.px-3.py-2 li:nth-child(2){
  margin-left: -55px;
}

ol.mod-breadcrumbs.breadcrumb.px-3.py-2 li{
  color: rgba(58, 58, 58, 0.5);
}

ol.mod-breadcrumbs.breadcrumb.px-3.py-2 li:last-child{
  color: #000000;
}

.com-content-article__body{
  padding-top: 160px;
} */

 span.breadcrumb-item {
  padding-top: 160px;
  margin: 0 20px 0 0;
  color: #000000;
  font-size: 16px;
}

 span.breadcrumb-item a{
   text-decoration: none;
 }
 /* span.breadcrumb-item:first-child {
  
} */

span.breadcrumb-item span:last-child{  
  color: #5C95FF;
  /* color: rgba(58, 58, 58, 0.5);  */
  /* margin: 0 20px 0 0; */
  animation-duration: 2.4s;
    animation-name: slidein-1;
}

 span.separator{
   margin-right: 10px;  
}

.btn {
    padding: 11px 10px 10px 10px;
    border: none;
    /* background-color: #ccc; */
    cursor: pointer;
}
body.modal-open {
  overflow: hidden; /* Блокируем прокрутку */
}