@charset "UTF-8";
.block-system-main-menu li {
  background-color: white; }
.block-system-main-menu li:hover {
  background-color: antiquewhite; }

.block-menu-menu-additional li:first-of-type {
  padding-left: 0;
  margin: 0; }
.block-menu-menu-additional a {
  text-decoration: none; }
  .block-menu-menu-additional a:hover {
    text-decoration: underline; }

@media (min-width: 769px) {
  .block-menu-blocks-1 .content {
    /*
	//..........................................................
	// Треугольники у пунктов меню, имеющих дочерние пункты
	// На подуровнях вправо
	span.arrow {
		width: 0;
		height: 0;
		border-top: 6px solid transparent;
		border-left: 6px solid lighten($c-nav-back,40%);
		border-right: 6px solid transparent;
		border-bottom: 6px solid transparent;
		align-self: center;
		//margin-top: $padding-v;
		margin-right: $padding-h;
	}
	// На первом уровне треугольник направлен вниз
	.level-1 > li > span.arrow {
		width: 0;
		height: 0;
		border-top: 6px solid lighten($c-nav-back,40%);
		border-left: 6px solid transparent;
		border-right: 6px solid transparent;
		border-bottom: 6px solid transparent;
		align-self: center;
		margin-top: $padding-v;
		margin-right: $padding-h;
	}
	*/ }
    .block-menu-blocks-1 .content ul {
      margin: 0; }
      .block-menu-blocks-1 .content ul ul {
        padding-left: 0; }
    .block-menu-blocks-1 .content li {
      list-style: none;
      display: flex;
      gap: 0.1rem;
      align-items: center;
      justify-content: space-between;
      position: relative;
      margin: 0;
      background-color: #fff; }
      .block-menu-blocks-1 .content li:hover {
        background-color: #fff; }
    .block-menu-blocks-1 .content a {
      padding: 0.5rem 0.7rem;
      color: #14245A;
      text-decoration: none;
      font-family: Myriadpro-semibold, Helvetica, Arial, sans-serif;
      font-size: 1.1rem;
      flex-grow: 1;
      white-space: nowrap; }
      .block-menu-blocks-1 .content a:hover {
        color: #C61D23; }
    .block-menu-blocks-1 .content .level-1 {
      display: flex;
      gap: 0;
      padding: 0;
      margin: 0;
      /*
		@media all and (max-width: $bp-desktop-mid) {
			display:grid;
			grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
			grid-template-rows: 1fr;
			> li {
				justify-content: start;
			}
		}*/ }
      .block-menu-blocks-1 .content .level-1 > li {
        background-color: #fff; }
        .block-menu-blocks-1 .content .level-1 > li:hover {
          background-color: #fff; }
      .block-menu-blocks-1 .content .level-1 > li > a {
        font-size: 1.25rem; }
    .block-menu-blocks-1 .content .level-2 {
      position: absolute;
      top: 2.38rem;
      left: 0;
      min-width: 14rem;
      box-shadow: 1px 5px 5px #e2e2e2;
      z-index: 10;
      transition: 0.2s ease-in-out;
      transform: scaleY(0);
      transform-origin: 0 0; }
    .block-menu-blocks-1 .content ul li:hover .level-2 {
      transition: 0.2s ease-in-out;
      transform: scaleY(1);
      transform-origin: 0 0;
      transition-delay: 0.2s; }
    .block-menu-blocks-1 .content .level-3 {
      position: absolute;
      top: 0;
      left: 14rem;
      min-width: 14rem;
      transition: 0.2s ease-in-out;
      transform: scaleY(0);
      transform-origin: 0 0; }
    .block-menu-blocks-1 .content ul.level-2 li:hover .level-3 {
      transition: 0.2s ease-in-out;
      transform: scaleY(1);
      transform-origin: 0 0;
      transition-delay: 0.2s; }
    .block-menu-blocks-1 .content .level-4 {
      position: absolute;
      top: 0;
      left: 14rem;
      min-width: 14rem;
      transition: 0.2s ease-in-out;
      transform: scaleY(0);
      transform-origin: 0 0; }
    .block-menu-blocks-1 .content ul.level-3 li:hover .level-4 {
      transition: 0.2s ease-in-out;
      transform: scaleY(1);
      transform-origin: 0 0;
      transition-delay: 0.2s; }
    .block-menu-blocks-1 .content span.arrow {
      position: relative;
      width: 16px;
      height: 16px;
      margin-left: -0.5rem;
      margin-right: 0.5rem; }
    .block-menu-blocks-1 .content span.arrow::before, .block-menu-blocks-1 .content span.arrow::after {
      position: absolute;
      content: "";
      width: 6px;
      height: 2px;
      background-color: #14245A;
      border-radius: 0px; }
      .block-menu-blocks-1 .content .level-1 > li > span.arrow::before {
        transform: rotate(40deg);
        top: 7px;
        right: 7px; }
      .block-menu-blocks-1 .content .level-1 > li > span.arrow::after {
        transform: rotate(-40deg);
        top: 7px;
        left: 7px; }
    .block-menu-blocks-1 .content .level-2 > li > span.arrow::before, .block-menu-blocks-1 .content .level-3 > li > span.arrow::before, .block-menu-blocks-1 .content .level-4 > li > span.arrow::before {
      transform: rotate(50deg);
      bottom: 9px;
      left: 5px; }
    .block-menu-blocks-1 .content .level-2 > li > span.arrow::after, .block-menu-blocks-1 .content .level-3 > li > span.arrow::after, .block-menu-blocks-1 .content .level-4 > li > span.arrow::after {
      transform: rotate(-50deg);
      top: 9px;
      left: 5px; } }

@media (max-width: 768px) {
  .block-menu-blocks-1 .content {
    /*
		//......................................................
		// Треугольники у пунктов меню, имеющих дочерние пункты
		// Сначала треугольник направлен вниз
		
		// По умолчанию треугольники направлены вниз
		li span.arrow, .level-1 > li > span.arrow{
			width: ($f-size-nav*1.15 + $padding-v*2);
			height: ($f-size-nav*1.15 + $padding-v*2);
			position: absolute;
			right: .5rem;
		}

		li span.arrow::after {
			position: absolute;
			content: "";
			width: 0;
			height: 0;
			border-top:  6px solid lighten(yellow,40%) ;
			border-left: 6px solid transparent;
			border-right: 6px solid transparent;
			border-bottom: 6px solid transparent;	
			position: absolute;
			top: 1rem;
			right: .7rem;
		}
		// После клика направлены вверх
		li span.arrow.active::after {
			width: 0;
			height: 0;
			border-top:  6px solid transparent;
			border-left: 6px solid transparent;
			border-right: 6px solid transparent;
			border-bottom: 6px solid lighten(red,40%) ;
			position: absolute;
			top: .5rem;
			right: .7rem;
		}
		*/ }
    .block-menu-blocks-1 .content ul {
      margin: 0; }
      .block-menu-blocks-1 .content ul ul {
        padding-left: 0; }
    .block-menu-blocks-1 .content li {
      list-style: none;
      position: relative;
      display: flex;
      flex-direction: column;
      gap: 0.1rem;
      margin: 0;
      background-color: #fff; }
      .block-menu-blocks-1 .content li:hover {
        background-color: #fff; }
    .block-menu-blocks-1 .content a {
      padding: 0.5rem 0.7rem;
      text-decoration: none;
      font-family: Myriadpro-semibold, Helvetica, Arial, sans-serif;
      font-size: 1.2rem;
      color: #14245A; }
      .block-menu-blocks-1 .content a:hover {
        color: #C61D23; }
    .block-menu-blocks-1 .content .level-1 {
      display: flex;
      flex-direction: column;
      padding: 0;
      margin: 0; }
    .block-menu-blocks-1 .content .level-2, .block-menu-blocks-1 .content .level-3, .block-menu-blocks-1 .content .level-4 {
      position: relative;
      top: 0;
      left: 0;
      width: 100%;
      transition: 0.2s ease-in-out;
      transform: scaleY(0);
      transform-origin: 0 0;
      display: none; }
      .block-menu-blocks-1 .content .level-2.open, .block-menu-blocks-1 .content .level-3.open, .block-menu-blocks-1 .content .level-4.open {
        display: block;
        transition: 0.2s ease-in-out;
        transform: scaleY(1);
        transform-origin: 0 0;
        transition-delay: 0.2s; }
    .block-menu-blocks-1 .content span.arrow {
      position: absolute;
      width: 32px;
      height: 32px;
      right: 0.55rem;
      top: 0.4rem; }
    .block-menu-blocks-1 .content span.arrow::before, .block-menu-blocks-1 .content span.arrow::after {
      position: absolute;
      content: "";
      width: 6px;
      height: 2px;
      background-color: #14245A;
      border-radius: 0px; }
      .block-menu-blocks-1 .content li span.arrow::before {
        transform: rotate(40deg);
        top: 13px;
        right: 15px; }
      .block-menu-blocks-1 .content li span.arrow::after {
        transform: rotate(-40deg);
        top: 13px;
        left: 15px; }
    .block-menu-blocks-1 .content li span.arrow.active::before {
      transform: rotate(-40deg);
      top: 13px;
      right: 15px; }
    .block-menu-blocks-1 .content li span.arrow.active::after {
      transform: rotate(40deg);
      top: 13px;
      left: 15px; } }
/**
* Compiled from sites/amberarena.ru/files/themes_creator/themes/amberarena_ru/stylesheets/all/menu.scss
* 
*/

