#dealOptions {
    display: flex;
    flex-direction: column;
    width: 100%;
    z-index: 1;
    box-sizing: border-box;
    position: static
}

    #dealOptions .column {
        display: flex;
        flex-direction: column;
        width: 23%
    }

        #dealOptions .column:first-child {
            margin-right: 20px
        }

    #dealOptions .stickyColumn {
        display: none
    }

    #dealOptions #sectionOne {
        display: flex;
        justify-content: center;
        padding: 30px 0;
        background-image: linear-gradient(275deg,#2971b3,#38accd);
        box-shadow: 0 0 26px 0 rgba(53,53,53,0.2)
    }

        #dealOptions #sectionOne .column:nth-child(3n) {
            width: 20%
        }

        #dealOptions #sectionOne .column:nth-child(4n) {
            width: 26%
        }

            #dealOptions #sectionOne .column:nth-child(4n) .radioButtons {
                display: flex;
                flex-direction: row;
                height: 100%
            }

        #dealOptions #sectionOne .sectionHeading {
            font-size: 20px;
            color: #fff;
            margin-bottom: 15px
        }

        #dealOptions #sectionOne .sectionInput {
            height: 35px;
            background-color: #fff;
            font-size: 15px;
            color: #303030;
            padding-left: 20px;
            box-sizing: border-box;
            outline: 0;
            border: 0;
            box-sizing: border-box;
            width: 100%
        }

    #dealOptions .inputCurrency {
        position: relative
    }

        #dealOptions .inputCurrency .poundIcon {
            position: absolute;
            font-size: 15px;
            top: 9px;
            left: 8px
        }

    #dealOptions #sectionOne .column:first-child .sectionInput {
        max-width: 265px
    }

    #dealOptions #sectionOne .column:nth-child(2n) .sectionInput {
        max-width: 245px
    }

    #dealOptions #sectionOne .lengthOfMortgageInput input {
        margin-right: 10px;
        width: 45px;
        font-size: 15px;
        color: #303030;
        padding: 12px
    }

    #dealOptions #sectionOne .lengthOfMortgageInput {
        font-size: 15px;
        color: #fff
    }

    #dealOptions #sectionOne .sectionHeadingRepayment {
        display: none
    }

    #dealOptions #sectionOne .column:nth-child(4n) .radioButtons #dealOptionsRadioButton {
        flex-grow: 0
    }

    #dealOptions #sectionTwo {
        display: flex;
        flex-direction: column;
        padding: 30px 0;
        background: #fff;
        box-shadow: 0 0 26px 0 rgba(0,0,0,0.16)
    }

        #dealOptions #sectionTwo .main {
            display: flex;
            justify-content: center
        }

        #dealOptions #sectionTwo .columnTwo {
            width: 43%
        }

        #dealOptions #sectionTwo .column:nth-child(3n) {
            width: 26%
        }

        #dealOptions #sectionTwo .sectionHeading {
            font-size: 20px;
            color: #323234;
            margin-bottom: 15px
        }

        #dealOptions #sectionTwo .desktopCheckboxes {
            display: flex
        }

            #dealOptions #sectionTwo .desktopCheckboxes #dealOptionCheckbox {
                margin-right: 25px
            }

    #dealOptions .desktopFooter {
        display: flex;
        justify-content: center;
        width: 100%;
        padding-top: 30px
    }

    #dealOptions .updateAllButton {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 400px;
        height: 44px;
        border-radius: 110px;
        background-color: #45c4d8;
        font-size: 17px;
        font-weight: bold;
        color: #fff;
        cursor: pointer
    }

    #dealOptions.showStickyDealOptions {
        flex-direction: column;
        width: 100%;
        z-index: 1;
        box-sizing: border-box;
        z-index: 2;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        display: flex;
        animation: showDesktopStickyAnimation .5s forwards
    }

@keyframes showDesktopStickyAnimation {
    from {
        transform: translateY(-20%);
        opacity: 0
    }

    to {
        transform: translateY(0);
        opacity: 1
    }
}

#dealOptions.showStickyDealOptions .column {
    width: 20%
}

#dealOptions.showStickyDealOptions .stickyColumn {
    display: flex;
    align-items: center;
    width: 16%
}

    #dealOptions.showStickyDealOptions .stickyColumn #refreshSearch {
        width: 170px;
        height: 35px;
        border-radius: 17.5px;
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 15px;
        color: #0c94c8;
        cursor: pointer
    }

#dealOptions.showStickyDealOptions #sectionOne {
    padding: 10px 0
}

    #dealOptions.showStickyDealOptions #sectionOne .column:nth-child(4n) {
        width: 20%
    }

    #dealOptions.showStickyDealOptions #sectionOne .sectionHeading {
        font-size: 15px;
        margin-bottom: 8px
    }

    #dealOptions.showStickyDealOptions #sectionOne .sectionHeadingRepayment {
        display: block
    }

    #dealOptions.showStickyDealOptions #sectionOne .column:first-child .sectionInput {
        max-width: 200px
    }

    #dealOptions.showStickyDealOptions #sectionOne .column:nth-child(2n) .sectionInput {
        max-width: 180px
    }

    #dealOptions.showStickyDealOptions #sectionOne .lengthOfMortgageInput input {
        width: 46px
    }

    #dealOptions.showStickyDealOptions #sectionOne #dealOptionsRadioButton {
        min-width: 100px
    }

        #dealOptions.showStickyDealOptions #sectionOne #dealOptionsRadioButton .radioButtonCheckmark {
            font-size: 12px;
            padding: 0;
            height: 30px
        }

#dealOptions.showStickyDealOptions #sectionTwo {
    padding: 10px 0
}

    #dealOptions.showStickyDealOptions #sectionTwo .columnTwo {
        width: 40%
    }

    #dealOptions.showStickyDealOptions #sectionTwo .column:last-of-type {
        width: 36%
    }

    #dealOptions.showStickyDealOptions #sectionTwo .sectionHeading {
        font-size: 15px;
        margin-bottom: 8px
    }

#dealOptions.showStickyDealOptions .desktopFooter {
    display: none
}

@media only screen and (max-width:1190px) {
    #dealOptions {
        display: none
    }

        #dealOptions.showStickyDealOptions {
            display: none
        }
}