* {
	margin: 0;
	padding: 0;
}
html,
body {
	height: 100%;
}

/*colors and backgrounds*/
.darkblue {color:rgba(3, 42, 120, 0.90);}
.bg-darkblue {background:rgba(3, 42, 120, 0.90);}
.gr-blue {background:rgba(21, 45, 119, 0.90); background: linear-gradient(180deg, rgba(21, 45, 119, 0.90) 4.68%, #4687E8 23.02%, rgba(77, 131, 226, 0.60) 68.02%, rgba(93, 121, 211, 0.27) 100%);}
.grey, .grey a {color: rgba(0, 0, 0, .3);}
.grey a:hover {color: rgba(0, 0, 0, .6);}
.gr-bottom {background: linear-gradient(180deg, #6898EC 0%, rgba(38, 72, 152, 0.85) 54.17%, rgba(21, 45, 119, 0.90) 98.42%);}
.shadow-hover {box-shadow: 0 3px 13px rgba(0, 0, 0, 0.1);}
.shadow-hover:hover {box-shadow: 0 5px 16px rgba(0, 0, 0, 0.2); transition:all 0.4s;}
.gr-light {background: url(/assets/img/bg.png), #F1F1F5 50%; background-size: cover; background-repeat: no-repeat; linear-gradient(180deg, #F1F1F5 0%, rgba(241, 241, 245, 0.40) 100%);}

/*template*/

.wrapper {    
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

 @media (min-width: 2500px) {
  .wrapper {
    max-width: 85% !important; 
    margin:auto;
      } 
}  
    
.content {
	flex: 1 0 auto;
}
.footer {
	flex: 0 0 auto;
}

.topmenu {
position: absolute;
top:110px;
right:0;
bzckground:#FFF; 
width: 100%;
height: 75px;
z-index:100;
display:flex;
justify-content:center;
align-items:center;
flex-shrink:0;
}

.top {
width:100%;
height:110px;
padding:0;
display:flex;
justify-content:space-between;
align-items:center;
}

.logo-block {
width:100%;
height:110px;
padding:0;
display:flex;
justify-content:center;
align-items:center;
}

.logo {
width: 70px;
height: 70px;
border-radius: 50px;
background:#FFF;
display:flex;
justify-content:center;
align-items:center;
}
.logo img {
width: 47px;
height: 44px;
}

.logo-mobile {
width: 70px;
height: 70px;
border-radius: 50px;
border:2px solid #da3321;
background:#FFF;
display:flex;
justify-content:center;
align-items:center;
}
.logo-mobile img {
width: 47px;
height: 44px;
}

@media(max-width:768px){
.logo-mobile {width: 55px; height: 55px;}
.logo-mobile img {width: 35px; height: 35px;}
.top {height:90px;}
.topmenu {top:90px; height:60px;}
}

@media(max-width:360px){
.logo-mobile {width: 45px; height: 45px;}
}

.border-red {border:2px solid #da3321 !important;}
.address, .phones {line-height:1.3}

.searchform input {
background:none !important; 
border:0px !important; 
outline:none !important; 
color:white !important;
width:180px;
}
.searchform input::-webkit-input-placeholder {background:none !important; border:0px !important; outline:none !important; color:white !important;}
.searchform input:-moz-placeholder {background:none !important; border:0px !important; outline:none !important; color:white !important;}
.searchform button {background:none !important; border:0px !important; outline:none !important; color:white !important;}

.w-60 {width:60%}
@media (max-width:768px){
.w-60 {width:100%}
}

.main-content {margin-top:95px;}

@media (max-width:1366px){
.main-content {margin-top:80px;}
}

@media (max-width:768px){
.main-content {margin-top:77px;}
}

/* poster with calendar */
.calendar-wrapper, .mask, .bg-school, .calendar-caption {height:496px;}
.calendar-wrapper {
position:relative; 
}
.mask {position:absolute; top:0; left:0; width:100%; height:496px; background:rgba(3, 42, 120, 0.40);}
.calendar-wrapper-bg, .bg-school, .bg-concert, .bg-colledge, .bg-Vladimir, .bg-Moscow, .bg-music, .bg-piano {
width:100%;
height:100%;
background-repeat:no-repeat; 
background-position:top center;
}
.bg-school {background: url(/assets/img/dmsh1.jpg); background-size:cover;}
.bg-concert {background: url(/assets/img/hall1.jpg); background-size:cover;}
.bg-colledge {background: url(/assets/img/colledge.jpg); background-size:cover;}
.bg-Vladimir {background: url(/assets/img/Vladimir.jpg); background-size:cover;}
.bg-Moscow {background: url(/assets/img/moscow.jpg); background-size:cover;}
.bg-music {background: url(/assets/img/music.jpg); background-size:cover;}
.bg-piano {background: url(/assets/img/piano.jpg); background-size:cover;}

.calendar {
width:350px; 
display:flex;
justify-content:center;
align-items:center;
z-index:100000; 
border:1px solid #e9ecef;
box-shadow: 0 3px 13px rgba(0, 0, 0, 0.1);
}
.calendar:hover {box-shadow: 0 5px 16px rgba(0, 0, 0, 0.2); transition:all 0.4s;}
.calendar-caption {
width:70%;
z-index:1;
padding:40px;
}
.event-title, .event-info, .event-button {width:100%; height:90px;}
.event-info h4 {font-size:1.5em;}
.event-info p {font-size:1em;}
@media (max-width:1024px){
.event-info h4 {font-size:1.25em; margin-top:10px;}
.event-info p {font-size:0.9em;}
}
@media (max-width:834px){
.event-info p {display:none;}
}
@media (max-width:768px){
.calendar-wrapper {min-height:726px;}
.mask, .bg-school, .calendar-caption {height:320px;}
.calendar-caption {position:absolute; top:0; width:100%; padding:0 30px;}
.event-title, .event-info, .event-button {height:70px;}
.calendar {position:absolute; top:320px; left:0; width:100%;}
.event-info p {display:block;}
}
@media (max-width:480px){
.event-info h4 {font-size:1.1em;}
.event-info p {display:none;}
}
@media (max-width:320px){
.calendar-wrapper {min-height:724px;}
.calendar-caption {padding:20px;}
.calendar, .calendar:hover {border:0px; box-shadow: none;}
}
/*cols for main page blocks*/
.cols {
display:flex;
flex-direction:row;
justify-content:space-between;
}
.col-left, .col-right {width:50%;}
.col-left {padding-right:20px;}

@media(max-width:834px){
.cols {flex-direction:column; justify-content:start;}
.col-left, .col-right {width:100%;}
.col-left {padding-right:0;}
}
/*bannerPos styles*/
.pos-banner-btn_2 {  
  background: #2c53a6 !important;  
}
.pos-banner-btn_2:hover {
  background: #274A94 !important;  
}
#js-show-iframe-wrapper {min-width:280px !important;}

/*components*/
.card-title-block {
    height: 70px;
    overflow: hidden;
    position: relative;
    margin-bottom: 15px;
}
.card-title-block:after {
    content: "";
    text-align: right;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    height: 1.2em;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white 100%);
    pointer-events: none;
}

/*typography*/
.title {
font-family: 'Russo One', sans-serif !important;
font-size: 28px;
font-style: normal;
font-weight: 400;
line-height: normal;
}

.titleSchool{
font-family: 'Lobster', sans-serif !important;
font-size: 27px;
font-style: normal;
font-weight: 400;
letter-spacing: 1.62px;
}

 @media (min-width: 1920px) {
  .titleSchool {
    font-size: 29px; 
    letter-spacing: 2px;
      } 
}  

@media(max-width:1690px){
.titleSchool{font-size: 24px;}
}
@media(max-width:1440px){
.titleSchool{font-size: 22px; letter-spacing: 1.1px;}
}
.titleSchool-mobile, .titleSchool-mobile a  {font-family: 'Lobster', sans-serif !important;}
.text-shadow {text-shadow: 1px 2px 8px #003366;}
.date {font-size:14px;}  
.news-title, .news-title a, .activities-title, .activities-title a {font-weight:bold; font-size: 18px; color: inherit; transition:all 0.4s;}
.subtitle, .subtitle a {color: inherit; font-weight:bold; transition:all 0.4s;}
.news-title a:hover, .subtitle a:hover {color: #2c53a6;}  
.news-text {font-size:1em;}
  @media (max-width:768px){
.news-title, .news-title a {font-size:16px !important; line-height:1.3 !important;}
.date, .news-text {font-size:14px;}
  }
.text-justify {text-align:justify;}
  @media (max-width:1260px){
.text-justify {text-align:left;}
  }

/* styles for subdivision list */
.w-links {width:28%;}
.w-links-md {width:44%;}
.activities-block {width:100%; display:flex; flex-direction:row; justify-content:space-between; align-items:center;}
.sublinks-block {width:100%; display:flex; flex-direction:row; justify-content:center; align-items:center;}
.activities {width:315px; height:160px; display:flex; flex-direction:column; justify-content:center; align-items:stretch;}
.sublinks {width:315px; height:110px; display:flex; flex-direction:column; justify-content:center; align-items:stretch;}
.activities-icon {width:45px; height:auto;}
.h-110 {height:110px; display:flex; justify-content:center; align-items:center;}
.logos {height:95px; display:flex; justify-content:center; align-items:center;}

@media (max-width:1440px){
.activities, .sublinks {width:360px;}
.logos {height:120px;}
}
@media (max-width:1150px){
.w-links {width:43%;}
.activities, .sublinks {width:48%;}
}
@media (max-width:968px){
.w-links, .w-links-md {width:75%;}
}
@media (max-width:640px){
.w-links {width:100%;}
.logos {height:95px;}
.activities-block {display:flex; flex-direction:column;}
.activities, .sublinks {width:100%; height:auto; margin-right:0; margin-left:0;}
}

/*navigation*/
.mainmenu a {color:#FFF; font-size:1.1em; padding-left:0; padding-right:30px;}
.leftmenu {margin-top:75px;}
ul.mainmenu li a:hover, ul.mainmenu .selected, ul.leftmenu .selected {color:#E66759;}
.selected-border {border-left: 4px solid #E66759;}
.leftmenu a {
white-space:normal;
margin:0; 
line-height:1.1;
padding:15px 22px;
font-size:1.1em;
}
.leftmenu li {border-bottom:1px solid rgba(221, 222, 223, 0.25);}
.leftmenu li:last-child {border-bottom:0px;}
ul{
  margin: 0;
  padding: 0;
  box-sizing:borer-box;
}
.leftmenu {z-index:10000;}
ul.leftmenu li {  
  list-style: none;
  white-space:normal;
  width: 100%;  /* = left sidebar width */  
}
ul.leftmenu li a {
  text-decoration: none;
  display: block;
  color:#FFF; 
}
ul.leftmenu li ul {
  display: none; /*hide menu*/ 
  background: linear-gradient(180deg, rgba(12, 32, 95, 0.94) 1.56%, rgba(15, 39, 113, 0.94) 8.85%, rgba(32, 60, 148, 0.94) 23.44%, rgba(73, 113, 236, 0.94) 66.15%, rgba(94, 129, 238, 0.92) 99.99%, rgba(121, 150, 240, 0.94) 100%); color:#FFF;  
}
ul.leftmenu li ul ul {
  display: none; 
  background: rgba(3, 42, 120, 0.90); color:#FFF;
}
ul.leftmenu li ul ul ul {
  display: none;
  background: #003366; color:#FFF;
}
ul.leftmenu li ul li {border-bottom:0px solid rgba(221, 222, 223, 0.25);}
ul.leftmenu li ul ul li {border-bottom:0px solid rgba(221, 222, 223, 0.25);}
ul.leftmenu li ul ul ul li {border-bottom:0px solid rgba(221, 222, 223, 0.25);}
ul.leftmenu li ul li:last-child, ul.leftmenu li ul ul li:last-child, ul.leftmenu li ul ul ul li:last-child {border-bottom:0px;}
ul.leftmenu li a:hover {background: rgba(44, 83, 166, .7);}
ul.leftmenu li ul a:hover {background: #003366;}

ul.leftmenu li:hover {
   position: relative;  
   z-index:1001;
   }
  
ul.leftmenu li:hover > ul {
  display: block;   
}
ul.leftmenu li:hover ul{
  position: absolute;
  top: 0;
  left: 100%; /*opening menu to right*/
  width:390px;
  z-index:1000;
}

@media (max-width:1440px){
ul.leftmenu li:hover ul {width:350px;}
}

/* nav-elements */
.breadcrumbs {font-size:inherit; text-transform:none;}
@media(max-width:768px){
.breadcrumbs {font-size:14px !important;}
}

#nav-icon {
    width: 30px;
    height: 25px;
    position: relative;    
    transform: rotate(0deg);
    transition: .5s ease-in-out;
    cursor: pointer;
}
#nav-icon span {
    display: block;
    position: absolute;
    height: 4px;
    width: 100%;
    background: #2c53a6;
    border-radius: 4px;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: .25s ease-in-out;
}
#nav-icon span:nth-child(1) {
    top: 0px;
}
#nav-icon span:nth-child(2) {
    top: 9px;
}
#nav-icon span:nth-child(3) {
    top: 18px;
}
#nav-icon.open span:nth-child(1) {
    top: 9px;
    transform: rotate(135deg);
}
#nav-icon.open span:nth-child(2) {
    opacity: 0;
    left: -30px;
}
#nav-icon.open span:nth-child(3) {
    top: 9px;
    transform: rotate(-135deg);
}

@media (max-width:360px) {
#nav-icon {
    width: 22px;
    height: 18px;
    position: relative;    
    transform: rotate(0deg);
    transition: .5s ease-in-out;
    cursor: pointer;
}

#nav-icon span {
    height: 3px;
    border-radius: 3px;
}

#nav-icon span:nth-child(2) {
    top: 7px;
}
#nav-icon span:nth-child(3) {
    top: 14px;
}
#nav-icon.open span:nth-child(1) {
    top: 7px;
    transform: rotate(135deg);
}
#nav-icon.open span:nth-child(2) {
    opacity: 0;
    left: -22px;
}
#nav-icon.open span:nth-child(3) {
    top: 7px;
    transform: rotate(-135deg);
 }
}

.carousel-indicators {
  position: absolute;
  right: 0;
  bottom: -30px;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  padding: 0;
  margin-right: 15%;
  margin-bottom: 1rem;
  margin-left: 15%;
}
.carousel-indicators [data-bs-target] {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 10px;
  height: 10px;
  padding: 0;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #2c53a6;
  background-clip: padding-box;
  border: 2px;
  border-radius:50%;
  opacity: 0.5;
  transition: opacity 0.6s ease;
}
@media (prefers-reduced-motion: reduce) {
  .carousel-indicators [data-bs-target] {
    transition: none;
  }
}
.carousel-indicators .active {
  opacity: 1;
}

/* pagination */
.pagination {
    display: flex;
    justify-content:center;
    align-items:start;
    padding-left: 0;
    list-style: none;
}
.page-link {
    position: relative;
    display: block;
    padding: 0.55rem 0.85rem !important;
    margin-left: 0;
    line-height: 1.25 !important;
    color: #1A1A1A !important;
    background-color: transparent !important;
    border: 0 solid transparent !important;
    box-shadow:none !important;
}
.page-item.active .page-link {
    z-index: 3;
    color: #fff !important;
    width:35px;
    height:35px;
    display:flex;
    justify-content:center;
    align-items:center;
    background-color: #2c53a6 !important;
    border-color: #2c53a6 !important;
    border-radius:50% !important;
    box-shadow:none !important;
}

.bottom__cookie-block {
    width: 100%;
    height: auto;
    background: rgba(3, 42, 120, 0.90);
    color:#FFF;
    display: none;
    position: fixed;
    bottom: 0;
    z-index: 100000;
    text-align: center;
    -webkit-transform: translateZ(0);
    }  
    
.bottom__cookie-block .buttons {
    width:100%;
    display:inline-flex;
    justify-content:center;
    align-items:center;
}

.qr {width:100%; color:#FFF;}
.qr img {width:120px; height:auto;}