.calculator{
    .calculator-title{
        font-size: 2rem;
        font-weight: 700;
        width: 30%;
        margin-bottom: 90px;

        @media screen and (max-width: 768px){
            width: 75%;
            margin-bottom: 40px;
         }
    }

    .select-btn{
        width: 100%;
    }

    .calculator-content{
        display: flex;
        justify-content: space-between;

        @media screen and (max-width: 768px){
            flex-direction: column-reverse;
        }
    }

    .calculator-right{
        max-height: 475px;
        @media screen and (max-width: 1300px){
            width: 55%;
        }
        @media screen and (max-width: 768px){
           width: 100%;
        }
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }

    .calculator-left{
        width: 22%;

        @media screen and (max-width: 1300px){
            width: 40%;
        }
        @media screen and (max-width: 768px){
            width: 100%;
         }

        input{
            width: 100%;
        }

        .calculator-inputs{
            margin: 36px 0;
            display: flex;
            gap: 24px;
            flex-direction: column;
        }

        .calculator-btns{
            display: flex;
            flex-direction: column;
            gap: 12px;

            .calculator-btn{
                width: 100%;

                button{
                    width: 100%;
                    border-radius: 6px;
                    background-color: #fff;
                    border: none;
                    outline: none;
                    cursor: pointer;
                    font-size: 1.25rem;
                    min-height: 48px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    position: relative;
                }

                &.first{
                    button{
                        background: #1D2D53;
                        color: #fff;
                        font-weight: 600;

                        img{
                            position: absolute;
                            left: 15px;
                        }
                    }
                }

                &.second{
                    button{
                        border: 2px solid #CACDD5;
                        color: #1D2D53;
                        font-weight: 600;
                    }
                }
            }
        }
    }

    .calculator-alert{
        margin-top: 60px;
        width: 50%;
        color: var(--50, #8E96A9);
        font-family: Georgia;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;

        @media screen and (max-width:768px){
            width: 100%;
        }

        img{
            margin-left: 10px;
            width: 7px;
            height: auto;
            transform: rotateZ(90deg);
        }
    }

}