/*IMPORT SCSS*/
/*-------------------------------------------*/
/*-------------------------------------------*/
/* FONTS */
/*-------------------------------------------*/
/*-------------------------------------------*/
/* COLORS */
/*-------------------------------------------*/
/*-------------------------------------------*/
.left-menu:before { content: ""; display: block; position: absolute; top: 0; left: 0; height: calc(100% + 80px); width: 100%; background: url("../images/patterned-transparent-gray.png") center/cover; box-shadow: 0 15px 15px #ccc; }

.left-menu ul { list-style: none; width: 90%; max-width: 100%; }

.left-menu ul li { cursor: pointer; padding: 20px 0; }

.left-menu ul li.active, .left-menu ul li:hover { color: #cc0000; }

.left-menu ul li.active { pointer-events: none; }

.left-menu ul li:not(:last-child) { border-bottom: 1px solid #ccc; }

@media (min-width: 576px) { .main-image { position: absolute; top: 80px; left: 0; width: calc((7 / 12) * 100%); height: calc(100% - 160px); max-height: 740px; }
  .img-with-buttons { max-height: 740px; } }

@media (max-width: 991px) { .left-menu:before { height: 100%; box-shadow: 0 0 15px #ccc; }
  .changing-content { padding-left: 30px !important; }
  .main-image { position: static; width: 150%; left: -50%; top: 0; z-index: -1; height: 100%; } }

@media (max-width: 575px) { .left-menu { /*max-width: 340px;*/ }
  .left-menu:before { width: 100%; }
  .main-image { max-width: 100%; } }