/* flexbox */ .am-grid .am-flexbox { background: #fff; } .am-grid .am-flexbox .am-flexbox-item { margin-left: 0; } .am-grid .am-flexbox .am-flexbox-item.am-grid-item { position: relative; } .am-grid .am-flexbox .am-flexbox-item.am-grid-item-active .am-grid-item-content { background-color: #ddd; } .am-grid .am-flexbox .am-flexbox-item .am-grid-item-content { text-align: center; width: 100%; height: 100%; padding: 15px 0; } .am-grid .am-flexbox .am-flexbox-item .am-grid-item-content .am-grid-item-inner-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .am-grid .am-flexbox .am-flexbox-item .am-grid-item-content .am-grid-item-inner-content .am-grid-icon { max-width: 100%; } .am-grid .am-flexbox .am-flexbox-item .am-grid-item-content .am-grid-item-inner-content .am-grid-text { margin-top: 9px; font-size: 12px; color: #000; text-align: center; } .am-grid .am-flexbox .am-flexbox-item .am-grid-item-content .am-grid-item-inner-content.column-num-3 .am-grid-text { font-size: 16px; } .am-grid .am-flexbox .am-flexbox-item .am-grid-item-content .am-grid-item-inner-content.column-num-2 .am-grid-text { margin-top: 15px; font-size: 18px; } .am-grid.am-grid-line { position: relative; } .am-grid.am-grid-line:not(.am-grid-carousel) { border-top: 1PX solid #ddd; border-right: 1PX solid #ddd; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { html:not([data-scale]) .am-grid.am-grid-line:not(.am-grid-carousel) { border-top: none; } html:not([data-scale]) .am-grid.am-grid-line:not(.am-grid-carousel)::before { content: ''; position: absolute; background-color: #ddd; display: block; z-index: 1; top: 0; right: auto; bottom: auto; left: 0; width: 100%; height: 1PX; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: scaleY(0.5); -ms-transform: scaleY(0.5); transform: scaleY(0.5); } } @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) { html:not([data-scale]) .am-grid.am-grid-line:not(.am-grid-carousel)::before { -webkit-transform: scaleY(0.33); -ms-transform: scaleY(0.33); transform: scaleY(0.33); } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { html:not([data-scale]) .am-grid.am-grid-line:not(.am-grid-carousel) { border-right: none; } html:not([data-scale]) .am-grid.am-grid-line:not(.am-grid-carousel)::after { content: ''; position: absolute; background-color: #ddd; display: block; z-index: 1; top: 0; right: 0; bottom: auto; left: auto; width: 1PX; height: 100%; background: #ddd; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scaleX(0.5); -ms-transform: scaleX(0.5); transform: scaleX(0.5); } } @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) { html:not([data-scale]) .am-grid.am-grid-line:not(.am-grid-carousel)::after { -webkit-transform: scaleX(0.33); -ms-transform: scaleX(0.33); transform: scaleX(0.33); } } .am-grid.am-grid-line .am-flexbox { position: relative; border-bottom: 1PX solid #ddd; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { html:not([data-scale]) .am-grid.am-grid-line .am-flexbox { border-bottom: none; } html:not([data-scale]) .am-grid.am-grid-line .am-flexbox::after { content: ''; position: absolute; background-color: #ddd; display: block; z-index: 1; top: auto; right: auto; bottom: 0; left: 0; width: 100%; height: 1PX; -webkit-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%; -webkit-transform: scaleY(0.5); -ms-transform: scaleY(0.5); transform: scaleY(0.5); } } @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) { html:not([data-scale]) .am-grid.am-grid-line .am-flexbox::after { -webkit-transform: scaleY(0.33); -ms-transform: scaleY(0.33); transform: scaleY(0.33); } } .am-grid.am-grid-line .am-flexbox .am-flexbox-item { position: relative; } .am-grid.am-grid-line .am-flexbox .am-flexbox-item:first-child { border-left: 1PX solid #ddd; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { html:not([data-scale]) .am-grid.am-grid-line .am-flexbox .am-flexbox-item:first-child { border-left: none; } html:not([data-scale]) .am-grid.am-grid-line .am-flexbox .am-flexbox-item:first-child::before { content: ''; position: absolute; background-color: #ddd; display: block; z-index: 1; top: 0; right: auto; bottom: auto; left: 0; width: 1PX; height: 100%; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scaleX(0.5); -ms-transform: scaleX(0.5); transform: scaleX(0.5); } } @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) { html:not([data-scale]) .am-grid.am-grid-line .am-flexbox .am-flexbox-item:first-child::before { -webkit-transform: scaleX(0.33); -ms-transform: scaleX(0.33); transform: scaleX(0.33); } } .am-grid.am-grid-line .am-flexbox .am-flexbox-item:not(:last-child) { border-right: 1PX solid #ddd; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { html:not([data-scale]) .am-grid.am-grid-line .am-flexbox .am-flexbox-item:not(:last-child) { border-right: none; } html:not([data-scale]) .am-grid.am-grid-line .am-flexbox .am-flexbox-item:not(:last-child)::after { content: ''; position: absolute; background-color: #ddd; display: block; z-index: 1; top: 0; right: 0; bottom: auto; left: auto; width: 1PX; height: 100%; background: #ddd; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scaleX(0.5); -ms-transform: scaleX(0.5); transform: scaleX(0.5); } } @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) { html:not([data-scale]) .am-grid.am-grid-line .am-flexbox .am-flexbox-item:not(:last-child)::after { -webkit-transform: scaleX(0.33); -ms-transform: scaleX(0.33); transform: scaleX(0.33); } } .am-grid.am-grid-line.am-grid-carousel .am-grid-carousel-page { border-top: 1PX solid #ddd; border-right: 1PX solid #ddd; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { html:not([data-scale]) .am-grid.am-grid-line.am-grid-carousel .am-grid-carousel-page { border-top: none; } html:not([data-scale]) .am-grid.am-grid-line.am-grid-carousel .am-grid-carousel-page::before { content: ''; position: absolute; background-color: #ddd; display: block; z-index: 1; top: 0; right: auto; bottom: auto; left: 0; width: 100%; height: 1PX; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: scaleY(0.5); -ms-transform: scaleY(0.5); transform: scaleY(0.5); } } @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) { html:not([data-scale]) .am-grid.am-grid-line.am-grid-carousel .am-grid-carousel-page::before { -webkit-transform: scaleY(0.33); -ms-transform: scaleY(0.33); transform: scaleY(0.33); } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { html:not([data-scale]) .am-grid.am-grid-line.am-grid-carousel .am-grid-carousel-page { border-right: none; } html:not([data-scale]) .am-grid.am-grid-line.am-grid-carousel .am-grid-carousel-page::after { content: ''; position: absolute; background-color: #ddd; display: block; z-index: 1; top: 0; right: 0; bottom: auto; left: auto; width: 1PX; height: 100%; background: #ddd; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scaleX(0.5); -ms-transform: scaleX(0.5); transform: scaleX(0.5); } } @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) { html:not([data-scale]) .am-grid.am-grid-line.am-grid-carousel .am-grid-carousel-page::after { -webkit-transform: scaleX(0.33); -ms-transform: scaleX(0.33); transform: scaleX(0.33); } } .am-grid .am-carousel .am-carousel-wrap-dot > span { background: #dcdee3; } .am-grid .am-carousel .am-carousel-wrap-dot-active > span { background: #0ae; } .am-grid.am-grid-square .am-grid-item:before { display: block; content: ' '; padding-bottom: 100%; } .am-grid.am-grid-square .am-grid-item .am-grid-item-content { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .am-grid.am-grid-square .am-grid-item .am-grid-item-inner-content { height: 100%; } .am-grid.am-grid-square .am-grid-item .am-grid-item-inner-content .am-grid-icon { margin-top: 9px; width: 28%!important; }