@media (hover: none) {
    .pressed:active{
        transform: scale(0.99);
    }
    .pressed {
        touch-action: manipulation;
    }
}
@media (max-width: 1100px) {
	.devices {
		grid-template-columns: repeat(5, minmax(0px, 1fr));	
	}
    .mainmenu {
        z-index: 900;
    }
}
@media (max-width: 992px) {
    
    a:hover, button:hover, .pressed:hover{
        transform: scale(1);
    }
    a:active, button:active, .pressed:active{
        transform: scale(0.99);
    }
	.devices {
		grid-template-columns: repeat(4, minmax(0px, 1fr));	
	}
	.popup {
		padding: 0;
		align-items: flex-end;
	}
    .popup-inner {
        transform: translate(0, 200%);
        left: 0;
        max-width: 100%;
        bottom: 0;
        max-height: calc(100% - var(--safe-area-inset-top-redefined));
        border-radius: 0;
        min-height: 50vh;
		padding-bottom: var(--safe-area-inset-bottom-redefined);
    }
    .popup.open .popup-inner {
        transform: translate(0, 0);
    }
    .popup-full .popup-inner  {
        max-height: 100%;
		padding-top: var(--safe-area-inset-top-redefined);
        height: 100%;
    }
    .popup-page {
        padding-top: var(--safe-area-inset-top-redefined);
		padding-bottom: var(--safe-area-inset-bottom-redefined);
    }

    .mainmenu-inner {
        position: fixed;
        left: -480px;
        bottom: 0;
        transition: left 0.2s ease-in-out !important;
        min-height: none !important;
        max-height: none !important;
        height: 100vh;
        width: 100%;
        max-width: 480px;
        border-radius: 0;
    }
    .mainmenu.open .mainmenu-inner {
        left: 0;
    }
    .mainmenu-btn {
        width: 48px;
    }
    .mainmenu-top {
        padding-top: var(--safe-area-inset-top-redefined);
    }
    .mainmenu-bottom {
        padding-bottom: var(--safe-area-inset-bottom-redefined);
    }
	
}
@media (max-width: 767px) {
    .home-title {
        height: 3.333rem;
    }
    .home-name {
        font-size: 1.467rem;
    }
    .home.sticky .home-title{
        height: 1.667rem;
    }
    .home.sticky .home-locations .location {
        padding-top: 5.333rem;
    }
    .home-locations .location {
        padding-top: 5.5rem;
    }
    .location-summary {
        margin-top: 1.5rem;
    }
	.devices {
		/*grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));*/
	}
    .device-inner {
        font-size: 0.8rem !important;
    }
    .device-top {
        margin: 0.533rem;
        font-size: 0.8rem !important;
    }
    .device-bottom {
        padding: 0 0.533rem 0.533rem  0.533rem;
        font-size: 0.867rem !important;
    }
    .device-state {
        margin-bottom: 0.2rem;
    }
    .device-icon, .device-failed-icon {
        width: 1.333rem;
    }
    .device:hover {
        transform: none;
    }
    .device:active {
        transform: scale(0.99);
    }
    .device {
        touch-action: manipulation;
    }
    .form-item input.type-text, .form-item select.type-select, .form-item-submit input {
        font-size: inherit;
    }
    .skeleton-loading-summary-inner {
        margin: 1.333rem 0 0.333rem 0;
    }
    .home-setting-btn a{
        font-size: 1.067rem;
    }
    .home-top {
        top: 3rem;
    }
    .page.sticky .home-top {
        top: 1.5rem;
    }
    .page.sticky .home-info-top{
        height: 3.667rem;
    }
	.page.sticky .home .scroll-element {
		padding-top: 4rem;
	}
    .page.sticky.active-home .home-info-top{
        height: 5rem;
    }
    .video-cameras {
        gap: 1.333rem;
    }
    .video-item {
        width: calc(50% - 0.667rem);
    }
    .video-header {
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}
@media (max-width: 550px) {
    html {
        font-size: 13px;
    }
    body {
        font-size: 1rem;
    }
	.devices {
		grid-template-columns: repeat(3, minmax(0px, 1fr));	
	}
    .folder-grid.devices {
        grid-template-columns: repeat(3, minmax(0px, 1fr)) !important;
    }
    .level-control-circle-1 {
        width: 50%;
    }
    .level-control-circle-center {
        width: 30%;
    }
    .level-control-level {
        font-size: 1.286rem;
    }
    .level-control-title {
        margin-top: 0.143rem;
    }
    .popup-control-range {
        margin: 0 auto -7.143rem;
    }
    .level-control-risk-level {
        font-size: 0.857rem;
    }
    .popup-control-line-commands-onoff button, .popup-control .popup-control-commands button {
        padding: 0.857rem 1.429rem;
    }
    .popup-control-line-switch {
        width: 4.286rem;
        height: 2rem;
    }
    .popup-control-line-switch:after {
        width: 1.286rem;
        height: 1.286rem;
    }
    .popup-top-icon {
        max-width: 1.571rem;
    }
    .popup-top a {
        font-size: 1.286rem;
    }
    .popup-top-btn.popup-top-btn-close {
        font-size: 2rem;
    }
    .popup-top {
        flex-wrap: wrap;
    }
    .popup-top-btns {
        order: 10;
        width: 100%;
        padding: 1.071rem 0 0 0;
        justify-content: space-around
    }
    .popup-top-btns a {
        padding: 0.714rem 2.143rem;
    }
    .popup-top .popup-top-like-btn {
        font-size: 1.571rem;
    }
    .video-item {
        width: 100%;
    }
    .custom-checkbox {
        width: 2rem;
        height: 2rem;
        min-width: 2rem;
    }
    .custom-checkbox:before {
        width: 0.714rem;
        height: 0.714rem;
    }
    .scenario-device-remove-btn {
        width: 5.714rem;
    }
    .rightmenu-user-login-phone {
        font-size: 1.143rem;
    }
    .rightmenu-user-icon {
        font-size: 1.071rem;
        width: 3.143rem;
        height: 3.143rem;
    }
    .device-bottom {
        font-size: 0.857rem !important;
    }
    .appAuth-inner {
        max-width: 24rem;
        width: 24rem;
    }
    .pin-display {
        font-size: 3rem;
    }
    .btn {
        padding: 1rem 1rem;
    }
    .btn-block {
        margin: 0.357rem;
    }
    .zigbee-devices-support-item-left {
        width: 5rem;
    }
    .update-app-link-icon svg {
        max-width: 1.071rem;
    }
    .update-app-links.btns-items a.btn {
        padding: 0.714rem 0.571rem;
    }
    .history-chart #pager {
        flex-wrap: wrap;
    }
    .history-chart #pager-selects, .history-chart #pager-btns {
        width: 100%;
        flex-wrap: wrap;
    }
    .history-chart #pager-selects > *, .history-chart #pager-btns > * {
        min-width: inherit !important;
        max-width: none !important;
        flex: 1 1 0;
    }
}
@media (max-width: 380px) {
    .popup-control-range {
        margin: 0 auto -5.714rem;
    }
    .popup-control-range-btns {
        margin-bottom: 2.571rem;
    }
	.devices {
		grid-template-columns: repeat(2, minmax(0px, 1fr));	
	}
    .folder-grid.devices {
        grid-template-columns: repeat(2, minmax(0px, 1fr)) !important;
    }
}
@media (max-width: 340px) {
    .appAuth-inner {
        max-width: 20rem;
        width: 20rem;
    }
}