/* --------------- VARIABLES--------------- */ @desktop: ~"only screen and (min-width: 1200px)"; @medium: ~"only screen and (max-width: 1200px) and (min-width: 767px)"; @tablet: ~"only screen and (max-width: 978px)"; @mini-tablet: ~"only screen and (max-width: 767px)"; @phone: ~"only screen and (max-width: 575px)"; @color-magenta: #BC5E93; @color-top-menu: #0FA8A1; @color-top-menu-hover: #BEE5E5; @color-service-title: #E2CAB7; @color-service-back-more: #86CCCC; @color-light-grey: #d32c7d; /* надписи на 2 экране */ /* --------------- COMMON RULES--------------- */ @media @desktop { h1 { line-height: 34px !important; font-size: 36px !important; } h2 { } .list-product-card h3 { line-height: 28px !important; font-size: 24px !important; } .content { padding-left: 15px; } .list-product-card { padding: 20px; margin-bottom: 20px; } .phone-item { display: block; font-size: 17px; } } @media @medium { h1 { } h2, .list-product-card h3 { } } @media @tablet { h1 { } h2, .list-product-card h3 { } .phone-item { font-size: 13px; } header .my-header { background-size: 60% !important; } } @media @mini-tablet { h1 { } h2 { } header .my-header { background-size: 60% !important; } header .logo a .page-title { line-height: 32px; } } @media @phone { h1 { } h2 { } header .my-header { background-size: 100% !important; } }