@import url('colors.css');
@import url('text.css');

@import url('sections/main-look-section.css');
@import url('sections/learn-all-section.css');
@import url('sections/turn-smartphone-section.css');
@import url('sections/smart-diagnostic-section.css');
@import url('sections/useful-info-section.css');
@import url('sections/features-table-section.css');
@import url('sections/faq-section.css');



html, body {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

#main {
    padding: 9px 12px;
}

.unit-option {
    display: none;
}

.unit-option.active {
    display: inline;
}

.toast-container {
    position: fixed !important;
    bottom: 1rem;
    right: 1rem;
    z-index: 1055;
}

@media (max-width: 992px) {
    #main {
        padding: 9px 0;
    }
}

.arrow-btn::after {
    content: '→';
    position: absolute;
    font-size: 14px;
    right: 10px;
    transform: translateY(0);
    top: calc(50% - 10px);
}

.arrow-btn {
    position: relative;
}

.close-arrow-btn {
    position: relative;
    display: inline;
}

.close-arrow-btn:after {
    content: '→';
    position: relative;
    font-size: 14px;
    left: 10px;
}