.syn-center {
    text-align: center;
}

.syn-main-color {
    color: #1995ad !important;
}

.syn-bold {
    font-weight: bold;
}

.syn-mt-lg {
    margin-top: 50px !important;
}

.syn-mt-md {
    margin-top: 30px !important;
}

.syn-ml-sm {
    margin-left: 10px;
}

.syn-mr-sm {
    margin-right: 10px;
}

.syn-mb-md {
    margin-bottom: 30px !important;
}

.syn-mb-remove {
    margin-bottom: 0 !important;
}

.syn-mt-remove {
    margin-top: 0 !important;
}

.syn-radio {
    margin: 0 10px 3px 0;
}

.syn-text-normal {
    font-weight: normal !important;
}

.syn-grid {
    display: grid;
    grid-template-columns: auto auto;
}

.radio-box {
    display: flex;
    flex-direction: column;
    justify-content: left;
}

.radio-box label {
    cursor: pointer;
    margin-bottom: 10px;
}

.radio-box div {
    margin-bottom: 10px;
}

.radio-box label:last-child {
    margin-bottom: 0;
}

.syn-info-icon {
    margin-left: 5px;
    cursor: pointer;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg width='20px' height='20px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 3.53846C7.32682 3.53846 3.53846 7.32682 3.53846 12C3.53846 16.6732 7.32682 20.4615 12 20.4615C16.6732 20.4615 20.4615 16.6732 20.4615 12C20.4615 7.32682 16.6732 3.53846 12 3.53846ZM2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12Z' fill='%23030D45'%3E%3C/path%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 16.359C12.4248 16.359 12.7692 16.0146 12.7692 15.5897V11.4872C12.7692 11.0623 12.4248 10.7179 12 10.7179C11.5752 10.7179 11.2308 11.0623 11.2308 11.4872V15.5897C11.2308 16.0146 11.5752 16.359 12 16.359Z' fill='%23030D45'%3E%3C/path%3E%3Cpath d='M13.0256 8.41026C13.0256 7.84381 12.5664 7.38462 12 7.38462C11.4336 7.38462 10.9744 7.84381 10.9744 8.41026C10.9744 8.9767 11.4336 9.4359 12 9.4359C12.5664 9.4359 13.0256 8.9767 13.0256 8.41026Z' fill='%23030D45'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}

.syn-info-icon:hover {
    filter: brightness(0.8);
}

.syn-hidden {
    display: none !important;
}

.syn-tooltip {
    border: 1px solid #333;
    padding: 5px;
}

#tooltip {
    position: absolute;
    background: #333;
    color: #fff;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 14px;
    max-width: 250px;
    z-index: 9999;
}

.calcDialog {
    min-height: 100vh;
    min-width: 100vw;
}

.calcContent {
    padding: 30px;
    max-width: 75%;
    margin-left: auto;
    margin-right: auto;
}

.calcControls {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    display: flex;
    justify-content: space-between;
}

.syn-warning {
    display: none;
    color: red;
    font-size: 1.5em;
    font-weight: bold;
}

.syn-question-block {
    position: relative;
    background: #fff;
    box-shadow: 0 2px 12px rgba(68,74,85,.08),0 2px 8px rgba(68,74,85,.04);
    padding: 15px;
    border-radius: 2px;
    display: flex;
    flex-direction: column;
    justify-content: left;
    margin-top: 50px;
}

.syn-question-block label {
    font-weight: bold;
}

.syn-bar {
    height: 27px;
    background: #c3c2c2;
    border-radius: 12px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    max-width: 640px;
    width: 100%;
}

.syn-progress {
    color: #fff;
    background: rgba(25, 149, 173, 0.9);
    border-radius: 12px;
    text-align: center;
    width: 0%;
}

.calcPage, .syn-warning {
    max-width: 640px;
    margin-right: auto;
    margin-left: auto;
}

.userName {
    font-weight: bold;
}

#calcPage2 {
    display: none;
}

#calcPage3 {
    display: none;
}

#calcPage4 {
    display: none;
}

#calcPage5 {
    display: none;
}

#calcPage6 {
    display: none;
}

#calcPage7 {
    display: none;
}

#calcPage8 {
    display: none;
}

@media only screen and (max-width: 687px) {
    .calcContent {
        padding: 10px;
        max-width: 100%;
    }
}

@media only screen and (min-width: 688px) {

}