.map-wrapper { height: 100%; &.widget { height: 250px; } &.graph { height: auto; } } .card-header { border-bottom: 0; font-size: 18px; @media (min-width: 465px) { font-size: 20px; } } .full-container { padding: 0px 15px; width: 100%; min-height: 600px; height: calc(100% - 150px); } .full-container.nodepage { min-height: 400px; margin-top: 25px; margin-bottom: 25px; } .full-container.channelpage { min-height: 400px; margin-top: 25px; margin-bottom: 25px; min-height: 100%; } .full-container.widget { height: 250px; min-height: 250px; } .full-container.fit-container { margin: 0; padding: 0; height: 100%; min-height: 100px; .chart { padding: 0; min-height: 100px; } } .chart { min-height: 500px; width: 100%; height: 100%; @media (max-width: 992px) { padding-bottom: 25px; } @media (max-width: 829px) { padding-bottom: 50px; } @media (max-width: 767px) { padding-bottom: 25px; } @media (max-width: 629px) { padding-bottom: 55px; } @media (max-width: 567px) { padding-bottom: 55px; } } .chart.graph { min-height: 600px; } .chart.nodepage { min-height: 100%; width: 100%; height: 100%; padding-bottom: 0px; } .chart.channelpage { min-height: 400px; } .widget { width: 100%; margin-left: auto; margin-right: auto; height: 250px; -webkit-mask: linear-gradient(0deg, #11131f00 5%, #11131fff 25%); } .widget > .chart { min-height: 250px; -webkit-mask: linear-gradient(180deg, #11131f00 0%, #11131fff 20%); @media (max-width: 767.98px) { padding-bottom: 0px; } } .loading-spinner { position: absolute; top: 50%; left: calc(50% - 15px); z-index: 100; @media (max-width: 767.98px) { top: 550px; } } .loading-spinner.widget { position: absolute; top: 200px; z-index: 100; width: 100%; left: 0; @media (max-width: 767.98px) { top: 250px; } } .loading-spinner.nodepage { position: absolute; top: 200px; z-index: 100; width: 100%; left: 0; } .loading-spinner.channelpage { position: absolute; top: 400px; z-index: 100; width: 100%; left: 0; @media (max-width: 767.98px) { top: 450px; } }